Formation Complète sur React
Tous les éléments de React : introduction, formation complète sur les concepts de base, ainsi que toutes les bibliothèques (ou 'librairies') que j'utilise au quotidien, les bonnes pratiques, etc.
Leçons du chapitre
React : Les Bases Essentielles
Découvrez les bases fondamentales de React. Apprenez les 3 concepts essentiels : les composants, le state (`useState`) et les props, et créez votre première application avec Vite.
React avec Vite : Setup et Premiers Pas
Apprenez à démarrer un projet React moderne en un clin d'œil avec Vite. Je vous montre pourquoi c'est l'outil indispensable aujourd'hui et comment lancer votre première application en quelques minutes.
Les Composants React en Détail
Plongez au cœur des composants React. Découvrez en détail les composants fonctionnels, la différence avec les 'class components', et les différentes syntaxes pour écrire du code moderne.
Rendu et Virtual DOM en React
Découvrez le fonctionnement interne de React. On explore le processus de rendu en 3 étapes (Trigger, Render, Commit) et la magie du Virtual DOM qui rend React si performant.
React : Index Complet des Hooks
Une introduction et un index complet des Hooks React. Découvrez ce que sont les Hooks, les règles à respecter, et explorez les catégories : Hooks de base, de performance, d'état, avancés et personnalisés.
Le Hook useState
Apprenez à gérer l'état local de vos composants avec le hook `useState`. Découvrez sa syntaxe, ses avantages par rapport aux anciennes classes, et des exemples pratiques pour chaque type de données.
Le Hook useEffect
Gérez les effets de bord dans vos composants avec le hook `useEffect`. Apprenez à effectuer des appels API, à gérer des timers et à interagir avec le cycle de vie du composant.
Le Hook useRef
Découvrez le hook `useRef` pour manipuler le DOM directement et stocker des valeurs mutables sans déclencher de re-render. Un outil essentiel pour sortir du flux React.
Le Hook useMemo
Optimisez vos composants React avec le hook `useMemo`. Apprenez à mémoriser les résultats de calculs coûteux et à éviter les re-renders inutiles de vos composants enfants.
Le Hook useCallback
Optimisez vos composants avec le hook `useCallback`. Apprenez à mémoriser vos fonctions pour éviter les re-renders inutiles des composants enfants et améliorer les performances.
Le Hook useReducer
Simplifiez la gestion d'états complexes avec le hook `useReducer`. Découvrez comment centraliser votre logique, gérer des actions multiples et organiser votre code à la manière de Redux.
Le Hook useContext
Évitez le 'prop drilling' et partagez facilement des données dans votre application avec `useContext`. Apprenez à créer un `Provider` et à consommer des données globales.
Les Hooks Avancés de React
Explorez les hooks React avancés. Découvrez `useLayoutEffect`, `useId`, `useTransition`, `useDeferredValue` et `useImperativeHandle` pour des cas d'usage spécifiques de performance et de manipulation DOM.
Les Custom Hooks (Hooks Personnalisés)
Apprenez à créer vos propres hooks pour extraire et réutiliser la logique de vos composants. Découvrez des exemples pratiques comme `useToggle` et `useLocalStorage`.
React Router : La Navigation
Apprenez à gérer la navigation et les URLs dans votre application React avec React Router. On couvre la configuration des routes et les composants `Link` et `NavLink`.
React : Gestion de l'État (State Management)
Explorez les différentes stratégies de gestion d'état en React. On compare la Context API, Zustand, Redux Toolkit, Jotai et TanStack Query pour choisir la bonne solution pour votre application.
L'Écosystème des Librairies React
Explorez l'immense écosystème de React. Une liste organisée des meilleures librairies pour l'UI, la gestion d'état, les formulaires, les animations, et bien plus encore.
React : Gestion des APIs et des Données
Découvrez les meilleures pratiques pour récupérer et gérer les données d'APIs dans vos applications React. On explore `useState`/`useEffect` et la puissance de **TanStack Query** pour la synchronisation et le cache.
React : Next.js et les Meta-Frameworks
Découvrez les meta-frameworks comme Next.js qui révolutionnent le développement React. On explore le Server Components, le routing, le SSG, les Server Actions et bien plus encore.
React : Formulaires et Validation
Simplifiez la gestion de vos formulaires en React ! Découvrez React Hook Form pour des formulaires performants et sa combinaison gagnante avec Zod pour une validation robuste et type-safe.
React : Types et Validation avec Zod & TypeScript
Découvrez comment Zod renforce la validation de vos données en JavaScript et TypeScript. Apprenez à créer des schémas, à valider des APIs et des formulaires, et à profiter de l'inférence de types pour un code plus sûr.
React : Les Animations
Donnez vie à vos applications React avec des animations. Découvrez les meilleures librairies : Framer Motion pour sa simplicité, React Spring pour la physique, et la puissance de GSAP.
React : Concepts Avancés et Optimisations
Poussez vos compétences React encore plus loin. Cette section explore des sujets techniques comme la synchronisation de l'état URL avec nuqs, l'optimisation de l'immutabilité avec Immer, et les défis de `setLoading()` avec les React Server Components.
React : Annexe des Liens et Ressources
Une collection organisée de liens et ressources essentiels pour l'écosystème React, couvrant les hooks, les outils, les librairies d'UI, la gestion d'état, et ma stack personnelle.