Contenu du cours
Maîtrise de React
Maîtrise de React
1. Introduction aux Fondamentaux de React
Qu'est-ce Que React?SPAs vs. MPAs dans le Développement WebComment React Fonctionne Avec le DOM VirtuelIntroduction à JSX dans ReactCréer des Éléments JSX ComplexesRendu des Éléments dans ReactDéfi : Rendu d'ÉlémentComposant ReactProps dans ReactDéfi : Composants FonctionnelsRendu ConditionnelDéfi : Rendu Conditionnel - Notification de ChatDéfi : Rendu Conditionnel - Alerte BancaireRendu d'une Collection de DonnéesDéfi : Rendre une Collection de DonnéesRécapitulatif de la Section Introduction à React
2. Stylisation dans les Applications React
Introduction à la Stylisation dans ReactStyles en LigneStyles en Ligne en PratiqueDéfi : Styles en LigneStyliser avec le Fichier CSSStyliser avec le Fichier CSS en PratiqueDéfi : Styliser Avec le Fichier CSSStylisation Avec Les Modules CSSOrganisation de la Structure des DossiersDéfi : Modules CSSRésumé de la Section sur le Style dans React
3. Hooks et Contexte React
Introduction : Hooks et Contexte ReactHook useStateDéfi : Basculer la VisibilitéHook useRefDéfi : Créer un Composant de FormulaireHook useEffectDéfi : Récupération et Affichage des DonnéesHook useMemoDéfi : Filtrage de la Liste de VoituresContexteContexte en PratiqueDéfi : Application du Monde de l'AstronomieRésumé de la Section sur les Hooks et le Contexte de React
Résumé de la Section React dans le Monde Réel
Suivez ces étapes pour développer une application React sur votre machine locale :
Installer Node.js et npm :
- Visitez le site officiel de Node.js à https://nodejs.org;
- Téléchargez l'installateur pour votre système d'exploitation et suivez les instructions d'installation pour installer Node.js et npm.
Installer un éditeur de code :
- Choisissez un éditeur de code qui vous convient, tel que Visual Studio Code;
- Installez l'éditeur de code sur votre ordinateur;
- Cet éditeur de code sera votre outil pour écrire du code React.
Créer un dossier de projet :
- Créez un dossier vide sur votre ordinateur pour stocker votre projet React;
- Ce dossier servira de répertoire racine pour votre projet.
Ouvrez l'éditeur de code :
- Lancez l'éditeur de code de votre choix ;
- Accédez au dossier du projet que vous avez créé à l'étape 3 ;
- Cela vous permettra de commencer à travailler sur votre projet React dans l'éditeur de code.
Ouvrez le terminal :
- Dans l'éditeur de code, ouvrez le terminal ou l'interface de ligne de commande ;
- C'est ici que vous exécuterez des commandes pour configurer et gérer votre projet React.
Configurez le projet :
- Dans le terminal, exécutez la commande
npx create-react-app .; - Cette commande initialise un nouveau projet React en utilisant l'outil Create React App.
Démarrez la page en direct :
- Exécutez la commande
npm startune fois le projet créé ; - Cela démarre le serveur de développement et ouvre un aperçu en direct de votre application React dans le navigateur.
Personnalisez le projet :
- Ouvrez le dossier
srcdans votre répertoire de projet ; - Vous pouvez supprimer tous les fichiers par défaut créés par Create React App ;
- Construisez vos composants React, ajoutez des styles et implémentez des fonctionnalités dans le dossier
src.
Bon codage !
En suivant ces étapes, vous aurez un projet React de base configuré et prêt pour le développement. Vous pouvez maintenant commencer à construire vos composants React, à styliser votre application et à ajouter des fonctionnalités selon les besoins de votre projet.
Tout était clair ?
Merci pour vos commentaires !
Section 4. Chapitre 6
