4.8/5 Trustpilot (1388 avis)
React de A à Z (React Hooks inclus)
React de A à Z (React Hooks inclus)
Le développement web moderne repose sur deux technologies devenues incontournables : React et Next.js. Cette formation complète vous emmène des tout premiers composants jusqu'au déploiement d'applications professionnelles, avec une approche 100 % orientée pratique. Vous ne vous contentez pas de comprendre la théorie : vous construisez, vous testez et vous mettez en ligne de vrais projets.
Ce que vous allez apprendre dans cette formation React et Next.js
Le parcours part des fondations de React pour monter progressivement vers les fonctionnalités avancées de Next.js. À la fin du cours, vous saurez concevoir, sécuriser et déployer des applications web évolutives en toute autonomie. Voici les compétences que vous développerez :
- créer vos premiers composants React et maîtriser la syntaxe JSX,
- gérer l'état de vos applications avec useState et les principaux Hooks (useEffect, useActionState),
- mettre en place un routage dynamique et des formulaires avancés,
- concevoir des interfaces modernes et responsives avec Tailwind CSS et Shadcn UI,
- comprendre le rendu serveur et client (SSR) propre à Next.js,
- sécuriser vos routes, exploiter les Server Actions et gérer l'authentification,
- déployer en continu sur Vercel et optimiser le SEO de vos applications.
À qui s'adresse ce cours et pourquoi le suivre
Que vous soyez développeur débutant curieux du développement moderne par composants ou créateur de projets souhaitant gagner en autonomie, cette formation vous donne les clés pour agir immédiatement. Vous apprenez à connecter vos données, à gérer vos déploiements et à structurer vos projets simplement et efficacement.
Pour aller plus loin, découvrez notre channel React et l'ensemble de nos formations JavaScript. Ou alors optez pour notre formation certifiante Front End Développeur.
Votre formateur : Clément Lv accompagne depuis plusieurs années les personnes souhaitant se perfectionner sur les technologies web et data. Il structure ses cours autour de la pratique concrète, pour vous rendre opérationnel rapidement sur vos propres projets.
Qu’allez-vous apprendre dans ce cours ?
Plan de cours
Chapitre 1
Architecture et Logique Essentielle avec React
Architecture et Logique Essentielle avec React
Chapitre 2
Hooks, Routage et Formulaires Avancés
Hooks, Routage et Formulaires Avancés
Chapitre 3
Next.js Avancé – Rendu, Actions et Authentification
Next.js Avancé – Rendu, Actions et Authentification
Table des matières
Chapitre 1 : Architecture et Logique Essentielle avec React
1h18
Leçon 1Au programme de la formation React et Next.js
Leçon 2Créer son premier projet React avec Vite
Leçon 3Comprendre la structure des fichiers d'un projet React
Leçon 4Créer votre premier composant React
Leçon 5Maitriser les règles de syntaxe du JSX
Leçon 6Découper votre interface en composants
Leçon 7Intégrer de la logique JavaScript dans le JSX
Leçon 8Styliser un composant React avec le CSS
Leçon 9Gérer les événements utilisateur (clics, saisies)
Leçon 10Gérer l'état d'un composant avec useState
Leçon 11Passer des données entre composants avec les Props
Leçon 12Afficher une liste dynamique avec map()
Leçon 13Appliquer des styles CSS dynamiques et conditionnels
Leçon 14Faire remonter les données vers le composant parent
Leçon 15Filtrer une liste en temps réel avec React
Chapitre 2 : Hooks, Routage et Formulaires Avancés
48m49
Leçon 1Découvrir les React Hooks : à quoi ils servent
Leçon 2Mettre en place la navigation avec React Router
Leçon 3Naviguer entre les pages avec le composant Link
Leçon 4Gérer des formulaires avancés avec Formik
Leçon 5Fluidifier l'interface avec les Transitions React
Chapitre 3 : Next.js Avancé – Rendu, Actions et Authentification
1h18
Leçon 1Qu'est-ce que Next.js et pourquoi l'utiliser
Leçon 2Créer des routes statiques et dynamiques
Leçon 3Structurer une application avec les Layouts
Leçon 4Styliser une application Next.js
Leçon 5Gérer la navigation dans Next.js avec Link
Leçon 6Différencier Server et Client Components
Leçon 7Comprendre le rendu (SSR, SSG) dans Next.js
Leçon 8Traiter les données avec les Server Actions
Leçon 9Gérer les formulaires avec le Hook useActionState
Leçon 10Créer vos propres Routes API dans Next.js
Leçon 11Mettre en place l'authentification dans Next.js
Leçon 12Protéger les pages avec les Middlewares et la session
