Devenir un PRO du React

199 €

Devenir un PRO du React

Fermé

Tous les outils clé en main pour trouver son premier job en tant que développeur React JS (freelance ou salarié)

👨‍💻 Formateur : Vincent

Acheter maintenant

Un parcours unique pour faire décoller ta carrière 🚀

Nous avons concentré toutes les connaissances qu'il faut absolument maîtriser pour devenir un développeur React d'exception. En suivant cette formation, tu auras toutes les clés en main pour trouver un job en tant que développeur React, que ce soit dans une entreprise en tant que free-lance.

Avec un salaire moyen de presque 42 000 EUROS / an, ta nouvelle casquette de développeur React va considérablement te rapprocher de ton rêve de liberté. Et tu peux me croire : te lever le matin pour aller au travail ne sera plus jamais une corvée !

COMMANDER LA FORMATION

Ce que tu vas apprendre

React Network : ton premier réseau social en React !

Les concepts clés et détaillés du framework React
Les fonctionnalités principales de la majeure partie des apps
Un projet pour t'accompagner tout au long de ton apprentissage

Dans cette formation

Un format qui a fait ses preuves :

🎬 Plus de 11 heures de vidéo
📄 Document PDF de 200 pages + codes sources
👨‍💻 Partie théorique pour comprendre en profondeur
✅ Accès 24h /24 et 7j /7

Prérequis :

💻 Les bases du JavaScript (incluses dans la formation Apprenti Développeur Web)
🚀 De la motivation, et rien d'autre

BONUS : Accès au Slack des Développeurs Libres

FAQ

Comment accéder à ma formation ?

Une fois la formation commandée, tu recevras un mail de confirmation et tu seras directement redirigé.e vers ton espace personnel. Sur cet espace, tu auras accès à toutes tes formations.
Elles sont disponibles 24h sur 24, 7 jours sur 7. Il te suffit d'une connexion internet. Les vidéos ne peuvent pas être téléchargées. Seul les fichiers PDF peuvent être enregistrées sur ton ordinateur.

Faut-il savoir coder avant de commencer cette formation ?

Il est préférable d'avoir quelques connaissances en développement web. Des notions de HTML, CSS voire JavaScript seront très utiles pour suivre cette formation. Mais il est tout à fait possible d'apprendre ces trois langages en parallèle de cette formation.

Pourrais-je devenir développeur avec cette formation ?

Oui ! Cette formation est conçue pour apporter toutes les bases nécessaires à quelqu'un sui souhaite se lancer en tant que développeur React en freelance ou dans une entreprise. Bien sur, cela ne se fera pas en un claquement de doigts, cela nécessitera beaucoup de travail et de rigueur, mais ça, c'est à vous de les trouver, tout le reste : c'est dans la formation ! 😉

Contenu

Introduction

Aperçu

Rejoins le groupe Slack

Devenir un Pro du React.pdf

React.js : c'est quoi ? et pourquoi ?

Objectifs : Comprendre ce qu'est réellement la librairie React.JS, et pourquoi l'utiliser.

Qu'est-ce que React.js et pourquoi l'utiliser ?

Aperçu

📄 Version PDF

Aperçu

Avant de commencer...

Objectifs : La syntaxe JavaScript moderne est un pré-requis impératif avant d'aller plus loin dans la formation.

Pré-requis : Le "JavaScript moderne"

Aperçu

Les bons outils

Aperçu

Mise en place de l'environnement de développement

Aperçu

📄 Version PDF

Aperçu

Création du squelette de notre application React

Objectif : C'est parti, nous allons tout de suite créer notre projet React.js !

Comprendre

Aperçu

Appliquer

Aperçu

📄 Version PDF

Aperçu

La structure de fichiers d'un projet React

Objectifs : Comprendre à quoi servent les fichiers et les dossiers créés.

Comprendre

Aperçu

📄 Version PDF

Aperçu

Nettoyage du projet pour partir de zéro

Objectifs : Partir d'un projet vierge pour comprendre la structure d'un projet React.

Appliquer

📄 Version PDF

Analyse du code react

Objectifs : comprendre dans les moindres détails le contenu d'un projet React

Comprendre

Evaluer

Correction

📄 Version PDF

JSX (Javascript Syntax eXtension)

Objectifs : Maîtriser l'utilisation de la syntaxe JSX.

Comprendre

Appliquer

Evaluer

Correction

📄 Version PDF

Créer notre premier composant

Objectifs : comprendre le développement par composants.

Comprendre

Appliquer

Evaluer

📄 Version PDF

Les props

Objectifs : Rendre nos composants génériques avec les props

Comprendre

Appliquer

Evaluer

Correction

📄 Version PDF

Aide-nous à améliorer cette formation 💡

Ton avis est précieux

Les props sous toutes les coutures

Objectifs : Savoir utiliser les props en toute situation.

Appliquer

Evaluer

📄 Version PDF

Les props - attributs vs enfants

Objectifs : Dans ce chapitre, nous allons voir comment passer des enfants à notre composant, toujours avec le mécanisme des props.

Comprendre

Appliquer

Evaluer

📄 Version PDF

React Dev Tools

Objectifs : Premier aperçu des React Dev Tools qui permettent de visualiser l'arbre de nos composants React et d'interagir avec les props.

Appliquer

📄 Version PDF

Générer une liste de composants

Objectifs : Nous affichons pour le moment 3 posts en faisant référence aux données "en dur", avec des indices numérotés.

Nous allons maintenant voir comment boucler sur nos données de manière générique, et en utilisant les pratiques recommandées en React.

Comprendre

Appliquer

Evaluer

📄 Version PDF

Les événements

Objectifs : Dans ce chapitre, nous allons voir comment interagir avec notre application React.JS via des événements.

Comprendre

Appliquer

📄 Version PDF

Le state et le hook useState

Objectifs : La notion de state (état) est le concept central de React.

Nous ne l'avons pas vu jusqu'ici car notre page est statique, sans la moindre interaction.

Cela va à présent changer, nous allons implémenter des interactions, et toute interaction dans React repose sur la notion de state.

React utilise une logique de programmation déclarative.

Ce type de programmation utilise souvent une notion d'état (c'est le cas de React).

Voyons en quoi consiste la programmation déclarative, et en quoi cela introduit naturellement le concept de state (état) qui va nous aider à créer des applications d'une manière très simple et élégante..

Comprendre

Appliquer

Evaluer

📄 Version PDF

Supprimer un post (depuis le composant de plus haut niveau)

Objectifs : Actualiser l'affichage lorsqu'on supprime un post.

Appliquer

📄 Version PDF

Modifier le state depuis un composant enfant

Objectifs : Apprendre comment un composant A peut modifier le state d'un composant B (B étant le parent de A).

Comprendre

Appliquer

Evaluer

📄 Version PDF

Le "props drilling" et le flux d'information

Objectifs : Comprendre le flux des données échangées entre les différents composants d'une application React.

Comprendre

Appliquer

📄 Version PDF

Objectifs : Le prochain chapitre sera consacré à la mise en place des styles CSS de notre application.

Avant de nous pencher sur les styles, ajoutons à notre applications les éléments qui manquent comparé au résultat final souhaité :

Pouvoir ajouter une image à un post
Afficher une photo de profil sur chaque utilisateur
Afficher l'heure à laquelle a été publié le post

Appliquer

📄 Version PDF

Styler nos composants (CSS)

Objectifs : Nous allons enfin rendre notre application un peu plus jolie en y ajoutant des styles CSS.

Comprendre

Appliquer

Pour aller plus loin

📄 Version PDF

Projet avec CSS

Le hook useEffect

Objectifs : Dans ce chapitre, nous allons apprendre à utiliser le hook useEffect qui va permettre à nos composants de déclencher des effets de bords, nécessaires à l'exécution de morceaux de code ne répondant pas aux lois de la programmation déclarative.

Comprendre

Appliquer

Evaluer

📄 Version PDF

Les composants basés sur des classes

Comprendre

Appliquer

📄 Version PDF

Faut-il savoir coder avant de commencer cette formation ?

Pourrais-je devenir développeur avec cette formation ?

React.js : c'est quoi ? et pourquoi ?

Avant de commencer...

Création du squelette de notre application React

La structure de fichiers d'un projet React

Nettoyage du projet pour partir de zéro

Analyse du code react

JSX (Javascript Syntax eXtension)

Créer notre premier composant

Les props

Aide-nous à améliorer cette formation 💡

Les props sous toutes les coutures

Les props - attributs vs enfants

React Dev Tools

Générer une liste de composants

Les événements

Le state et le hook useState

Supprimer un post (depuis le composant de plus haut niveau)

Modifier le state depuis un composant enfant

Le "props drilling" et le flux d'information

Implémenter un "empty state"

Ajouter un post : Créer le composant

Ajouter un post : Champs contrôlés VS non contrôlés

Ajouter un post : State Lifting

Ajouter un post : Finalisation

Le pattern &&

Posts avec images, photos de profils et heure du post

Styler nos composants (CSS)

Le hook useEffect

Les composants basés sur des classes

Les hooks

Custom hooks

Ajouter d'autres pages avec react router

Passage de paramètres dans une URL

Mise en place d'une layout commune entre les différentes pages

Global State Management (redux, Context API)

Les hooks useMemo et useCallback

Récupérer des données backend depuis une API

Déployer notre appli react en production

Conclusion