C'est le point de départ idéal pour tous ceux qui sont désireux d'apprendre les bases modernes de React de la manière la plus interactive et pratique possible.
Tout au long de ce cours, vous vous attaquerez à plus de 170 défis de codage interactifs et construirez six projets passionnants. Si vous en avez assez des cours sur React qui vous laissent les yeux rivés sur un écran d'éditeur vide, vous êtes au bon endroit ! Ici, vous **construirez réellement des projets React à la fin**, ce qui vous donnera la confiance et les compétences nécessaires pour vous attaquer à des applications du monde réel. Section 1 : Pages statiques (projet : site ReactFacts) Dans cette section d'introduction, vous vous familiariserez avec les bases de React, notamment les composants, JSX et le stylisme. Vous créerez un site ReactFacts simple, en découvrant le code composable et déclaratif, les éléments React et les meilleures pratiques pour construire des pages statiques dans React. Sujets abordés : - Intro à React - Pourquoi React ? Composable et déclaratif - Éléments React - JSX - Création de composants personnalisés - Fragments - Stylisation avec les classes Section 2 : React piloté par les données (projet : Travel Journal) Ensuite, vous découvrirez comment rendre vos apps React dynamiques en introduisant des composants réutilisables, des props et un rendu piloté par les données. Dans le projet inspirant Travel Journal, vous mapperez des données aux composants, manipulerez des actifs statiques et utiliserez des accessoires pour personnaliser l'expérience utilisateur. Sujets abordés : - Composants réutilisables - Accessoires - Évaluation de JS à l'intérieur de JSX - Gestion des ressources statiques - Mappage de données aux composants Section 3 : React State (projet : Chef Claude) Ce module vous présente la gestion des états de React, vous permettant de manipuler des événements, de gérer des états complexes et de créer des formulaires réactifs. Le projet Chef Claude vous aidera à voir la différence entre les props et l'état, à mettre en œuvre le rendu conditionnel et à styliser dynamiquement les composants en fonction de l'interaction de l'utilisateur. Sujets abordés : - Écoute d'événements - Props vs. État - Création et modification de l'état - État complexe - Formulaires et actions de formulaire - Rendu conditionnel - Définition de l'état des enfants - Styles dynamiques Section 4 : Effets secondaires (projet : Meme Generator) Explorez les effets secondaires dans React avec ce module sur la récupération de données, les composants contrôlés et les refs. Dans le projet Meme Generator, vous vous entraînerez à gérer les effets de bord, à optimiser les dépendances et à nettoyer les ressources, ce qui vous donnera une base solide pour gérer les données et les effets externes. Sujets abordés : - Composants/formes contrôlés - Programmation fonctionnelle dans React - Récupération de données - Gestion des effets de bord - Dépendances des effets de bord - Nettoyage des données - Références Section 5 : Projet de synthèse 1 : Jeu Tenzies Ce projet de synthèse vous met au défi de mettre en œuvre tout ce que vous avez appris en construisant un jeu Tenzies complet. À travers des défis étape par étape, vous améliorerez vos compétences en apprenant l'initialisation paresseuse de l'état et l'accessibilité, en créant une expérience interactive soignée. Sujets abordés : - Série de défis pour construire le projet de base - Initialisation paresseuse de l'état - Améliorations de l'accessibilité Section 6 : Projet de base 2 : Assemblage : Endgame Dans ce projet de fin d'études, vous devrez relever une série de défis pour construire une application complexe et multifonctionnelle. À la fin de Assembly : Endgame, vous aurez acquis une expérience réelle dans la résolution de problèmes et la combinaison de toutes les compétences React que vous avez développées tout au long du cours. Sujets abordés : Série de défis pour construire le projet de fin d'études Pourquoi ce cours ? Ce cours est rempli de défis de codage que vous compléterez en écrivant du code React directement à l'intérieur du navigateur ! Avant même de vous en rendre compte, vous aurez écrit six applications React interactives ! Vous bénéficierez également de l'apprentissage espacé et de la répétition dans ce cours. Assurez-vous de vous donner du temps (jours/semaines) pour le terminer, et prévoyez de nombreuses pauses. Une fois que vous aurez terminé, vous vous sentirez confiant dans vos compétences React et serez prêt à poursuivre votre voyage de codage.
