ARCHITECTURE ET COMPOSANTS

• Écosystème React/Vue : philosophie, Virtual DOM, cycle de vie des composants
• Création de projet avec Vite : structure, scripts, hot module replacement
• Composants fonctionnels (React) / Single File Components (Vue) : syntaxe
• Props : passage de données parent vers enfant, typage avec PropTypes
• Atelier : décomposition d'une maquette en arbre de composants

ÉTAT ET RÉACTIVITÉ

• useState (React) / ref et reactive (Vue) : état local, mutations et rendu
• useEffect (React) / watchEffect (Vue) : effets de bord et cycle de vie
• Communication enfant vers parent : callbacks et événements émis
• Gestion d'état global : Context API (React) ou Pinia (Vue)
• Atelier : application avec état partagé entre composants frères

ROUTING ET APPELS API

• React Router / Vue Router : routes, paramètres, redirections, navigation
• Pages et layouts : organisation des routes, routes imbriquées
• Fetch et axios : appels API dans les composants, loading et error states
• Rendu conditionnel et listes : if/ternaire et map avec keys
• Atelier : SPA multi-pages connectée à une API publique (météo, films)

FORMULAIRES, STYLES ET DÉPLOIEMENT

• Formulaires contrôlés (React) / v-model (Vue) : liaison bidirectionnelle
• Validation de formulaires avec react-hook-form ou VeeValidate
• Styling : CSS Modules, styled-components (React) ou scoped styles (Vue)
• Build et déploiement : npm run build, Vercel / Netlify en quelques clics
• Atelier : déploiement de l'application finale sur Vercel

PROJET ET ÉVALUATION FINALE

• Livrable : application SPA connectée à une API REST, multi-pages
• Format : démonstration en ligne via URL de déploiement fournie
• Critères : composants réutilisables, gestion d'état, routing, qualité du code
• Revue collective : retours sur l'architecture et les patterns utilisés
• Bilan : prochaines étapes TypeScript, tests, SSR (Next.js / Nuxt)