Dans ce second volet sur l'apprentissage du framework ReactJS, nous allons installer React en ligne de commande. Pour cela nous utiliserons un terminal.
Ensuite, nous allons apprendre à créer des composants à base de classe.
Dans le volet précédent, nous avons appris à créer des composants fonctionnels (à base de fonction).
Nous allons donc apprendre à transformer nos composants fonctionnels en composants à base de classe.
De cette façon, nous allons découvrir les états (state) que l'on peut donner à notre application grâce aux composants à base de classe.
Nous apprendrons comment mettre à jour ces états au travers d'un événement Javascript.
Nous terminerons ce second volet par la mise en place d'un exercice complet afin de mettre en pratique ce que nous aurons appris dans ce tuto.
Un QCM vous sera proposé à la fin de ce cours pour vérifier vos nouvelles connaissances.
Bon tuto !
Table des matières de cette formation React (durée : 1h50m)
-
Installer ReactJS en ligne de commande
- Avant de commencer gratuit 00:05:26
- Installer React gratuit 00:03:14
- Lancer le projet React gratuit 00:10:06
- Retour sur la fonction render utilisée dans React 00:06:12
- Afficher notre composant 00:12:18
- Créer un fichier JS pour le composant 00:03:46
- Passer des props 00:01:30
- Ajouter du CSS 00:04:00
-
Les composants à base de classe
- Déclarer un composant à base de classe 00:05:53
- Récupérer les props 00:05:02
- Mettre en place un événement 00:10:29
-
Application
- Créer le fichier index.js 00:06:58
- Créer le fichier ProduitListe.js 00:05:23
- Créer les fichiers index.css et ProduitListe.css 00:07:43
- Créer le fichier ProduitItems.js 00:05:56
- Envoyer des props 00:07:38
- Définir un état par défaut 00:07:31
-
Conclusion
- Pour la prochaine fois 00:01:42
- QCMaccéder
- Certificat
Formateur : Carl Brison
-
Ça se corse, et c'est moins clair, vu l'appel caché au script index.js (du moins je ne l'ai pas vu...). Ces appels resteront-ils ainsi des “boîtes noires”?
-
Super , comme d'habitude hâte de commencer le troisième volet.
-
Super bien expliqué , heureusement que j'ai suivi vos tutos sur l'architecture MVC en php , cela m'aide à comprendre la philosophie de la découpe ... Didier
-
Avec quelle version de logiciel ce tuto est-il compatible ?React
-
Quel est le niveau requis pour suivre ce tuto ?débutant
note moyenne
avis laissés