budrobundy69 / budrobundy69/openapi-angular-spring-example

🧩 Integrate OpenAPI TypeScript Client into Angular 19 with Signals

Ouverte
#21 0 commentaires 0 réactions 1 personne assignée Réclamée par @budrobundy69 Voir sur GitHub
🎨 frontend 🛠️ setup
Langage dominant
HTML
Étoiles
0
Forks
0
Métriques de merge des PR
Aucune PR mergée en 30 j

Description

### 🧩 Integrate OpenAPI TypeScript Client into Angular 19 with Signals

**Goal:** Use the generated OpenAPI TS client to communicate with the backend, and manage state using Angular Signals and SignalStore.

---

### ✅ Tasks

#### 1. Setup SignalStore

- [ ] Create a signal store (`apiStore`) in `frontend/src/app/stores/`
- [ ] Store loading state, errors, and response data
- [ ] Export actions for component usage

#### 2. Create ApiService Wrapper

- [ ] Create `api.service.ts` in `frontend/src/app/services/`
- [ ] Inject OpenAPI-generated services (e.g., `DefaultService`)
- [ ] Wrap service methods to return observables or promises
- [ ] Handle and log HTTP errors gracefully

#### 3. Create Example Feature

- [ ] Create a component that:
- [ ] Triggers an API call using the store
- [ ] Displays loading/error/success state
- [ ] Uses Signals for UI updates

#### 4. Optional: Add Test Coverage

- [ ] Unit test the SignalStore and ApiService
- [ ] Mock OpenAPI responses

---

### 📁 Suggested Structure

frontend/
├── src/
│ ├── app/
│ │ ├── api/ # OpenAPI-generated
│ │ ├── services/
│ │ │ └── api.service.ts
│ │ ├── stores/
│ │ │ └── api.store.ts
│ │ └── features/
│ │ └── sample/
│ │ └── sample.component.ts

---

### 🔜 Next Steps (Separate Issues)

- Add tests to CI
- Extend SignalStore pattern across features
- Trigger OpenAPI client generation automatically in CI
- Cloud Foundry deploy with OpenAPI client

---

**Labels:** `🔄 openapi`, `🧱 frontend`, `🌐 angular`, `📦 integration`, `⚡ state`, `🧪 test`
**Milestone:** `M1 - Backend MVP`
**Project:** `OpenAPI Angular Spring Example`

Guide de contribution

Aucun guide de contribution indexé pour ce dépôt

Évaluation

Cette issue n'a pas encore été évaluée.

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.