AdamThomasandClaude Sonnet 5
db11d9a3ba
C'est l'écran d'accueil réel d'un compte bénévole (`homePath`) — consulté sur son propre téléphone la plupart du temps, mais la page rendait un cadre de téléphone factice à taille fixe (376×772 px, fausse barre de statut) pensé pour être visionné sur un écran d'ordinateur, plus une note de choix de conception destinée à l'équipe, pas au bénévole. Sur un vrai téléphone, c'était un téléphone dessiné à l'intérieur du vrai téléphone. - Retiré le cadre (`PhoneFrame`) et la note de conception (`DesignNote`) — toujours utilisés par la page référent (`MobileLeadPage.tsx`, non touchée ici), donc le composant partagé reste en place. - Le contenu (bandeau d'accueil + cartes de créneaux) devient la page elle-même : pleine largeur sur mobile, centrée avec une largeur de lecture confortable (max 640 px) et un peu plus d'air à partir de `sm:` pour un écran d'ordinateur. Mêmes repères de conception qu'avant (fonds opaques, cibles tactiles ≥ 52 px), déplacés en commentaire de code. - `AppShell` : la barre d'onglets ne s'affiche plus quand il n'y a qu'un seul écran accessible (bénévole, référent) — elle n'a de sens que pour la coordination (3 écrans) ; simplifie l'en-tête sur les rôles qui n'ont nulle part où naviguer. Vérifié : typecheck, lint, build, smoke frontend OK. À noter : `MobileLeadPage.tsx` (référent) a exactement le même défaut (maquette de téléphone + note de conception) — pas touchée ici, la demande portait sur la vue bénévole. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_017uUsRg7XzopkCPWimwg9ZM
Gestion des bénévoles
Application web de gestion des bénévoles pour un festival associatif. Backend FastAPI + PostgreSQL, frontend React (à venir), déploiement Docker Compose auto-hébergé.
Voir CLAUDE.md pour le vocabulaire du domaine, l'arborescence
et les conventions.
Démarrage rapide
make demo # base + backend + frontend, jeu de démonstration chargé
make blank # idem, mais édition vierge + 1er compte coordination
- Frontend : http://localhost:5173
- API : http://localhost:8000 · Docs : http://localhost:8000/docs
make downarrête tout ·make logssuit les logs du backend
Chaque commande construit les images, applique les migrations, prépare les
données, bascule le frontend sur l'API réelle (.env) et affiche les
identifiants de connexion.
make blank accepte des paramètres :
make blank EMAIL=moi@festival.fr PASSWORD=mon-mot-de-passe-solide \
NAME="Festival 2026" START=2026-07-01 END=2026-07-04
Le jeu de démo : 120 bénévoles fictifs, 15 postes, 4 jours. L'édition vierge : une édition + un compte coordination (mot de passe) + 3 créneaux types.
Tests
docker compose run --rm backend uv run pytest
La base de test (benevoles_test) est créée automatiquement au premier
démarrage du conteneur PostgreSQL.
Structure
| Dossier | Rôle |
|---|---|
backend/ |
API FastAPI, modèle SQLModel, migrations Alembic |
frontend/ |
Interface React + Vite + TS + Tailwind (service frontend) |
deploy/ |
Configuration de déploiement production (compose, Caddy, runbook) |
.gitlab-ci.yml |
Chaîne CI/CD (tests → build → SSH sur le VPS) |