Menu

Tech

COMMENCER À APPRENDRE

Français

Récapitulatif : Découvrez React

Fait partie de la section Les fondamentaux du Journey React de Coddy — leçon 5 sur 42.

Défi

Facile

Récapitulatif du chapitre : construisez une petite page en utilisant tout ce que vous avez appris dans ce chapitre.

À l'intérieur du <div> conteneur, ajoutez un <h1> avec id="title" et le texte My React Page.
En dessous, ajoutez un <p> avec id="intro" et le texte Built with components.
Donnez à ce paragraphe la classe CSS lead, à la façon JSX.

Essayez vous-même

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="styles.css" />
    </head>
    <body>
        <div id="root"></div>
        <script type="module" src="main.jsx"></script>
    </body>
</html>

Toutes les leçons de Les fondamentaux

1Découvrez React

Qu'est-ce que React ?Votre premier composant Règle du parent unique JSX n'est pas de l'HTMLRécapitulatif : Découvrez React

4Props

Que sont les props ?Passer des props Deux props Même composant, nouvelles données La prop Children Récapitulatif : Props

7Conditions et Listes

Rendu ternaire Afficher avec &&Afficher une liste L'importance des clés Filtrer, puis mapper Récapitulatif : Conditions et Listes

2Expressions JSX

Accolades Calculs entre accolades Accolades dans les attributs Appel de fonctions dans JSX Récapitulatif : Expressions JSX

5État et événements

Qu'est-ce que l'état ?Compteur de clics Comptage par étapes Basculer avec l'état État indépendant Récapitulatif : État et événements

8Projet : Carte de profil

Étape 1 : Structure de la carte Étape 2 : Carte avec props Étape 3 : Bouton Like Étape 4 : Interrupteur de suivi

3Composants

Éléments de base Votre deuxième composant Réutiliser des composants Composer une page Récapitulatif : Composants

6Formulaires et Champs de Saisie

Champs de saisie contrôlés Répéter la saisie Compteur de caractères Bouton d'effacement Récapitulatif : Formulaires et Champs de Saisie