Udemy – React JS pour TOUS – L’Ultime Formation | 71 heures | 2025

Bienvenue à la Formation React JS pour Tous – L’Ultime Formation.

La formation en Français qui vous permet de Maîtriser React JS, (avec les HOOKS), REDUX, FIREBASE, APIs et autres avec des exercices simples, accessibles à tous, ainsi qu’avec la réalisation d’une vraie application React JS qu’on codera ensemble, étape par étape, du début jusqu’à son déploiement sur Firebase !

Dans cette description, je préfère vous épargner la littérature. Si vous êtes ici c’est que vous savez déjà ce que c’est que React JS. Je vais donc aller droit au but et vous présenter concrètement le contenu de cette formation avec le plus de détails possible.

Pour un meilleur apprentissage, cette formation est composée de 3 sections:

Les bases de la librairie React JS: Cette première section est composée d’une bonne trentaine de vidéos qui vous expliquent, pas à pas, les concepts de base de React JS.

• Vidéo 1: La première vidéo est une petite introduction avant de nous lancer dans la formation.
• Vidéo 2: Comme indiqué dans la documentation de React, les composants permettent de découper l’interface utilisateur d’une application sous React en éléments indépendants et réutilisables. Cela nous permet de considérer chaque élément de manière isolée et réutilisable. C’est ce que nous allons étudier dans cette vidéo.
• Vidéo 3: Dans cette vidéo, j’aborde avec vous les points suivants: La création d’une application React JS via CDN. La notion des composants dans REACT. Le JSX et son intérêt comparé à la méthode via JavaScript. L’utilité d’un composant parent. L’attribut ‘Class’ qui devient un ‘className’. La logique d’affichage des différents composants React dans un seul composant parent ‘App’. Comment compiler notre code ES6 via Babel afin de pouvoir l’interpréter sur notre navigateur.
• Update: Exercice React avec CDN – Updated React 18.
• Vidéo 4: Dans cette vidéo, nous allons voir les différentes façons d’initialiser une application React.
• Vidéo 5: Dans cette vidéo, nous allons voir les différents éléments livrés dans notre application que nous avons installée via la ligne de commande ‘create-react-app’.
• Update vidéo 5: Présentation de l’application initialisée – Update React 18.
• Vidéo 6: Dans cette vidéo, je continue avec l’application précédemment installée (cars) afin de continuer notre étude sur la notion des Composants dans React tout en abordant les notions de PROPS et STATE dans React.
• Vidéo 7: Dans cette vidéo, je continue avec l’application précédemment installée (cars) afin de finaliser notre étude sur les notions de PROPS et STATE dans React.
• Vidéo 7-2: Correction exercice sur les props et les states.
• Vidéo 7-3: Dans cette vidéo, nous allons voir la différence entre “Export Default” et “Named Exports”
• Vidéo 7-4: Exercice pour réviser les props et children.
• Vidéo 7-5: Correction de l’exercice sur les props et children.
• Vidéo 7-6: Notes sur les composants et les props.
• Vidéo 8: Dans cette vidéo nous allons apprendre à travailler sur les événements JavaScript dans React.
• Vidéo 9: Dans cette deuxième partie relative au changement de state, nous allons effectuer une incrémentation de la date existante dans un state.
• Vidéo 9-1: Destructuring array et callback function + invoquer une méthode dans les props.
• Vidéo 9-2: Dans cette vidéo, nous allons faire un petit exercice afin de réviser les événements React et plus précisément dans un composant fonction.
• Vidéo 9-3: Nous cette nouvelle vidéo, nous allons corriger l’exercice relatif aux événements dans un composant de type fonction.
• Vidéo 10: Dans cette vidéo, nous allons continuer avec nos exercices sur les Props dans React et nous allons voir comment passer une fonction dans un props.
• Vidéo 10-1: Exercice – Passer une fonction dans props.
• Vidéo 10-2: Correction de l’exercice.
• Vidéo 11: Dans cette vidéo, nous allons étudier la notion de Fragments dans React et comprendre son utilité dans une application React.
• Vidéo 12: Dans cette vidéo, nous allons faire une petite révision afin de bien comprendre cette notion d’affectation par décomposition ou Destructuring en JavaScript ES6.
• Vidéo 13: Dans cette vidéo, nous allons appliquer ces connaissance relatives au destructuring dans React.
• Vidéo 14: Dans cette vidéo, je vous ai concocté quelques petits exercices pour vous expliquer les conditions dans React.
• Vidéo 15: Dans cette vidéo nous allons voir comment afficher des images dans une application React.
• Vidéo 16: Dans cette vidéo nous allons étudier les formulaires dans React.
• Vidéo 17: Dans cette vidéo, nous allons apprendre à faire du CSS dans une application React.
• Vidéo 17-2: Exercice 1 – CSS Bootstrap.
• Vidéo 17-3: Correction de l’exercice 1.
• Vidéo 17-4: Exercice 2 – CSS et Props d’un Custom Button.
• Vidéo 17-5: Correction de l’exercice 2.
• Vidéo 17-6: Exercice 3 – Gérer le onClick sur le custom button.
• Vidéo 17-7: Correction de l’exercice 3.
• Vidéo 17-8: Présentation du package React-Bootstrap.
• Vidéo 17-9: Exercice 4: React-Bootstrap.
• Vidéo 17-10: Correction de l’exercice 4.