Adds front-end set-up

README.md

@@ -7,6 +7,7 @@ Een modulaire monolith CMS gebouwd met .NET 10.
 - `src/SlpModularCms.Api`: De host applicatie en API shell.
 - `src/SlpModularCms.Core`: Kern functionaliteiten, data modellen en interfaces.
 - `src/SlpModularCms.Modules.*`: Onafhankelijke functionele modules.
+- `frontend/`: De CMS admin web-UI (Vite + React + TypeScript). Bewust buiten `src/` gehouden om de .NET solution schoon te houden.
 
 ## Development Setup
 
@@ -59,6 +60,48 @@ De API gebruikt een beveiligde flow voor authenticatie:
 - **Rate Limiting**: Login endpoints hebben rate limiting (Fixed window 5/min, Sliding window 20/min).
 - **Error Handling**: Foutmeldingen volgen de RFC 9457 `ProblemDetails` standaard.
 
+## Frontend Development (CMS Admin UI)
+
+De frontend is een Vite + React 19 + TypeScript single-page application in de map `frontend/`. Hij gebruikt TanStack Router, Tailwind v4 (hoofdkleur `#ac0000`) met shadcn/ui-stijl componenten, react-i18next (NL/EN), en MSW voor mocking in tests.
+
+### Vereisten
+- Node.js 20+ (getest met v24)
+- pnpm 9+ (getest met v11)
+
+### Snel starten
+```powershell
+cd frontend
+pnpm install
+pnpm dev
+```
+De dev-server draait op `http://localhost:5173`.
+
+### Configuratie
+De frontend leest de API-basis-URL uit een environment-variabele (zie `frontend/.env.example`):
+```
+VITE_API_BASE_URL=http://localhost:5000
+```
+Kopieer `.env.example` naar `.env.local` en pas de waarde aan indien nodig. Optioneel kan met `VITE_ENABLE_MSW=true` de MSW-mockbackend in de browser worden ingeschakeld voor frontend-ontwikkeling zonder draaiende API.
+
+### Vereiste backend
+De app verwacht de .NET API (Unit 0) draaiend op de geconfigureerde origin met:
+- **CORS** die de frontend-origin (`http://localhost:5173`) toestaat met `credentials`.
+- De `httpOnly` `refreshToken` cookie op pad `/api/v1/auth` (silent refresh bij opstarten).
+- RFC 9457 `ProblemDetails` foutmeldingen.
+
+> Let op: de API-poort in `.env.example` (`5000`) moet overeenkomen met de werkelijke API-poort en de `Cors:AllowedOrigins` configuratie van de backend.
+
+### Scripts
+```powershell
+pnpm dev            # ontwikkelserver (HMR)
+pnpm build          # type-check (tsc) + productie-build
+pnpm preview        # productie-build lokaal bekijken
+pnpm test           # unit/integratietests (Vitest + Testing Library + MSW)
+pnpm test:coverage  # tests met coverage-rapport
+pnpm lint           # ESLint
+pnpm format         # Prettier (4-space indent)
+```
+
 ## Database Migraties
 
 Alle database commando's moeten worden uitgevoerd vanaf de **root** van de projectmap.