Comprendre ce qu'est React, pourquoi l'utiliser, et découvrir l'écosystème (npm, create-react-app, Vite). Installation de l'environnement de dev et premier "Hello World".

Découverte du JSX : intégration d'expressions JavaScript, attributs, classes CSS. Rendu conditionnel simple avec && et ternaires.

Créer et utiliser ses premiers composants fonctionnels. Passer et recevoir des données via les props. Découpage d'interface en composants.

Introduction au concept d'état local. Gérer les données dynamiques dans un composant avec le Hook useState. Mise à jour d'état simple et asynchrone.

Gérer les clics, saisies, soumissions. Lier les inputs d'un formulaire à l'état React (formulaires contrôlés). Validation basique.

Comprendre les effets de bord. Utiliser useEffect pour exécuter du code après le rendu, sans dépendances ([]) et avec nettoyage.

Gérer les dépendances dans useEffect. Effectuer un appel API (fetch ou axios) pour charger des données et les afficher. États de chargement et d'erreur.

Consolidation des acquis dans un projet guidé (ex: liste de tâches avec ajout/suppression, ou répertoire de contacts). Rendu conditionnel, état, événements.

Rendre des listes dynamiques avec .map(). Importance cruciale de la prop key pour les performances et la stabilité.

Utiliser useRef pour accéder aux éléments DOM et stocker des valeurs mutables. Introduction à useMemo pour l'optimisation de calculs coûteux.

Comprendre le problème du recréation des fonctions et l'optimiser avec useCallback. Différence avec useMemo.

Créer des composants layout et conteneurs avec props.children. Passer des éléments React, des composants et des fonctions comme props.

Comprendre le "prop drilling". Créer et fournir un contexte global (ex: thème, langue) avec createContext et Context.Provider.

Combiner useContext et useReducer pour un état global plus complexe. Créer un hook personnalisé pour exposer le contexte.

Extraire la logique métier réutilisable dans des hooks personnalisés (ex: useFetch, useLocalStorage). Règles des Hooks.

Projet guidé intégrant appel API, état global avec Contexte, formulaire et hooks personnalisés. Pensée architecturale.

Installation et configuration. Composants BrowserRouter, Routes, Route, Link. Création d'une navigation basique.

Routes dynamiques (useParams), recherche (useSearchParams), navigation programmatique (useNavigate). Route 404.

Pourquoi Redux ? Principes (Store, Actions, Reducers). Configuration d'un store avec Redux Toolkit (configureStore), création d'un slice (createSlice).

Utiliser le store dans les composants (useSelector, useDispatch). Actions asynchrones avec createAsyncThunk. Structure d'un projet Redux.

Combiner les deux dans un mini-projet (ex: blog). Gestion de l'état utilisateur/auth et des données persistantes entre les pages.

Approfondissement des techniques de mémoïsation. Identifier les re-rendus inutiles avec React DevTools et y remédier.

Créer des modales avec createPortal. Manipulation directe du DOM et intégration avec des bibliothèques externes (ex: une librairie de graphiques) via useRef.

Pourquoi tester ? Configuration de Jest et React Testing Library. Rédiger des tests simples pour un composant et un hook personnalisé.

Conception et construction d'une application complète (ex: réseau social minimaliste, app de recettes). Contenu : Revue d'architecture, intégration de tous les concepts (Router, Redux, Contexte, Hooks, API). Build de production et déploiement sur Vercel/Netlify.