Scaffold de base en attendant l'intégration du design Claude Design (« Bénévoles Festival.dc.html ») : routage, plomberie i18n (t() + locales/fr.json), client API avec proxy Vite vers le backend. Build et lint passent. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01AwswqSChc3Rwtu61pRXiY2
1.7 KiB
1.7 KiB
Frontend — Gestion des bénévoles
React + Vite + TypeScript + Tailwind. Interface en français, code en anglais.
Le design fait foi : projet Claude Design « Bénévoles Festival »
(Bénévoles Festival.dc.html). Les écrans et composants réels sont dérivés de
ce fichier et intégrés au fil des étapes. Le contenu actuel est un squelette
(routage, i18n, client API).
Commandes
| Action | Commande |
|---|---|
| Installer | npm install |
| Dev (hot reload) | npm run dev → http://localhost:5173 |
| Build de production | npm run build |
| Prévisualiser le build | npm run preview |
| Lint | npm run lint |
| Vérif. de types | npm run typecheck |
En dev, Vite proxifie /api vers le backend (VITE_API_TARGET, défaut
http://localhost:8000).
Conventions
- Aucun texte visible en dur. Tout passe par
src/i18n(t(key, params)) etsrc/i18n/locales/fr.json, même en monolingue. - Code, noms de fichiers et de variables en anglais.
- Alias d'import
@/→src/. - Vocabulaire métier : voir le glossaire FR ↔ EN de
CLAUDE.md.
Arborescence
src/
├── main.tsx # point d'entrée (React Query + Router)
├── index.css # directives Tailwind
├── app/
│ ├── router.tsx # routes
│ └── AppLayout.tsx # coquille de mise en page (remplacée par le design)
├── pages/ # écrans
├── api/client.ts # client HTTP + ApiError
└── i18n/ # t() + locales/fr.json