# D2 02 API Service

> Generates an Angular service that calls the up-api CRUD endpoints for a given entity (getAll, getById, save, update, delete). Use when the user asks for Day 2 step 3 of the CRUD drill, or asks to create the Angular service that talks to up-api. Needs the same entity used on Day 1.

- Skill: `softinter-chiangrai/d2-02-api-service` (Agent Skill)
- Install (CLI): `npx skillmds@latest add softinter-chiangrai/d2-02-api-service`
- Raw SKILL.md: https://api.skillmd.com/api/skills/softinter-chiangrai/d2-02-api-service/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Integrations & APIs
- Author: softinter-chiangrai (https://skillmd.com/u/softinter-chiangrai)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/softinter-chiangrai/d2-02-api-service

---


# Day 2 · Step 2 — API service

If the entity isn't already established in this conversation, ask which entity (it must match the one
exposed by up-api's CRUD endpoints).

`up-app/src/app/services/<entity>.service.ts`:
```typescript
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

export interface <Entity> {
  id?: number;
  // one field per column from the Day 1 entity spec
}

@Injectable({ providedIn: 'root' })
export class <Entity>Service {
  private base = 'http://localhost:8080/api/<entity>s';
  constructor(private http: HttpClient) {}

  getAll(): Observable<<Entity>[]> { return this.http.get<<Entity>[]>(this.base); }
  getById(id: number): Observable<<Entity>> { return this.http.get<<Entity>>(`${this.base}/detail/${id}`); }
  save(item: <Entity>): Observable<<Entity>> { return this.http.post<<Entity>>(`${this.base}/save`, item); }
  update(id: number, item: <Entity>): Observable<<Entity>> { return this.http.put<<Entity>>(`${this.base}/update/${id}`, item); }
  delete(id: number): Observable<void> { return this.http.delete<void>(`${this.base}/${id}`); }
}
```

Register `provideHttpClient()` in `app.config.ts` if it isn't already there. No redeploy needed for this step.

