Formation - Formation React

Référence : ReAmXThKjR79

Durée : 28 h sur 4 j

React (aussi appelé React.js ou ReactJS) est une bibliothèque JavaScript libre développée par Facebook depuis 2013. Le but principal de cette bibliothèque est de faciliter la création d'application web monopage, via la création de composants dépendant d'un état et générant une page (ou portion) HTML à chaque changement d'état.

Détails de la formation

Méthodes et outils pédagogiques

Noot : propre plateforme de visioconférence
Explication avec des exemples concrets à l'aide de schémas (live coding)

Objectifs de la formation

Développer et Maîtriser les fonctionnalités dans la dernière version 16 de React la technologie JavaScript de Facebook
Créer des composants web complexes rapidement
Application SinglePage avec React.JS, Flux et isomorphisme
Mettre en place une application web performante

Méthodes d'évaluation

Quiz
Travaux pratiques

Les plus

Des formateurs certifiés et reconnus dans leurs domaines
Dynamiser sa page web
Développer une application permanente

Pré-requis

Bonne connaissance de JavaScript
Pratique du développement web

Modalités d'enseignement

En présentiel
En distanciel

Public cible

Tous publics

Programme

Javascript & EcmaScript 6/7

- Rappels élémentaires sur le langage
- Maîtriser les closures
- Les bonnes pratiques en JavaScript
- Nouvelle gestion des classes
- Les arrow functions, une alternative efficace
- Construire nos chaines avec les « template string »
- L’héritage de classe
- Spread & Rest
- Comprendre la déstructuration d’Objets / d’Array
- Modulariser nos application web

Comprendre React et les composants

- La philosophie des composants
- Découverte du langage « JSX » et de la transpilation
- Créer une hiérarchie de composants
- Transfert d’informations avec les props
- Architecturer notre projet, Smart & Dump components

Manipuler les formulaires

- Dynamiser la validation de nos formulaires
- Composants contrôlés
- Composants non contrôlés
- Marquer les éléments du DOM avec les références
- Bien penser ses formulaires

Routing

- Mise en place de routes complexes
- Configuration du système de routing
- Manipuler la navigation des pages
- Ajouter des paramètres dans nos routes
- Cycle de vie des routes

Redux & React

- Flux/Redux : présentation
- Propagation de données
- Comparaison des architectures
- Création de vues et contrôleurs dans Flux
- Rôle du "Dispacther" dans Flux pour les actions
- Les « Stores », gestionnaire d'états logique dans Flux
- Approche avec Redux
- Le « Reducer »

Tests unitaires

- Introduction à Jest, le JUnit de Javascript
- Tester un composant
- Tester le DOM avec « dom-testing-library »
- Le principe F.I.R.S.T.

Server Side Rendering

- Les avantages du server side rendering (SSR)
- Intégration dans Redux
- Principe et bénéfices du développement isomorphique
- Ecosystème du JavaScript côté serveur
- Initiation à NodeJS
- Configuration de NodeJs pour ReactJS
- Mise en place du SSR

Internationalization (i18n) avec React

- Stratégie de mise en place avec les fichiers « .json »
- Les principales librairies d'internationalisation
- Intégration dans React et Redux

Introduction aux librairies populaires de React

- ReactNative
- NextJS
- Material UI / React Bootstrap