Aller au contenu principal

M2I : 06. React JS - Développement d'applications web

Durée

21 heures

Modalités

Formation
  • Classe virtuelle
  • Présentiel
Évaluation

L’évaluation des acquis se fait en cours de formation, par des études de cas ou des travaux pratiques et, en fin de formation, par un questionnaire

Prix

Inter
La formation en Inter est dispensée pour un groupe de salariés d’entreprises différentes.
882€ HT / personne
Intra
La formation en Intra est dispensée pour un groupe de salariés d’une seule et même entreprise.
3937.5€ HT / groupe
4 stagiaires minimum

Public

Développeurs, architectes, chefs de projets…

Pré-requis

Avoir des connaissances pratique du développement Web, maîtrise et pratique de JavaScript (ES5 minimum).

Objectifs pédagogiques

- Connaître les spécificités de ReactJS 

- Savoir développer des applications web performantes avec ReactJS 

- Concevoir une SPA avec ReactJS et Flux 

- Comprendre le subset JavaScript JSX 

- Optimiser les performances des RIA 

- Être en mesure de comprendre les impacts du choix d'une architecture incluant ce type d'application

Programme détaillé

JOUR 1 Matin

§ Présentation de ReactJS

Positionnement de ReactJS

Virtual DOM avec ReactJS

Mise en place des outils de développement

Tour d'horizon des outils de développement et d'intégration actuelle

Création d'une application React avec le script "create-react-app"

Exemple de travaux pratiques (à titre indicatif)

Mise en œuvre de l'outillage nécessaire au développement d'une application React

JOUR 1 Après-midi

§ Composants ReactJS

Création d'un composant ReactJS

Amélioration des fonctionnalités du composant développé

Etats d'un composant et cycle de vie

Gestion de l'état d'un composant

Propriétés d'un composant

Présentation de JSX et ES2015, que choisir ?

Présentation approfondie du Virtual DOM

Exemples de travaux pratiques (à titre indicatif)

Création pas à pas d'une application à base de composants React

Mise en oeuvre des propriétés et état d'un composant

JOUR 2 Matin

 

§ Communication inter-composants avec ReactJS

Communication inter-composants

Gestion des évènements

Autobinding

Composants de formulaire

Manipulation du DOM

Présentation de la propagation des données

Flux des données

Présentation des vues et contrôleurs dans ReactJS

Création d'une application Single Page Application (SPA) avec ReactJS

Exemple de travaux pratiques (à titre indicatif)

Création de plusieurs composants d'interface graphique, permettant de montrer l'interaction entre composants et l'UI

JOUR 2 Après-midi

 

§ Echanges avec le serveur

Présentation de l'architecture REST

Echanges entre l'application React et un serveur via REST

Exemple de travaux pratiques (à titre indicatif)

Appel de services REST et exploitation des données en JSON dans l'application React

§ Les Hooks

Présentation des Hooks

Utiliser la state dans une fonction

Les fonctions useState et useEffect

Exemple de travaux pratiques (à titre indicatif)

Utiliser les Hooks dans l'application ReactJS

JOUR 3 Matin

 

§ Améliorer une application ReactJS

Gestion des erreurs avec les "Error Boundaries"

Préserver la structure de l'arbre DOM avec les fragments

Utiliser le contexte pour s'affranchir de la structure de l'arbre DOM

Développer une application React avec TypeScript

§ Quelques patterns ReactJS

Faire remonter l'état : Lifting State Up

Le pattern Décorateur de ReactJS : Higher-Order Components

JOUR 3 Après-midi

§ Redux

Présentation du workflow

Présentation de flux

Eléments composants Redux

Intégration de Redux dans React

Les Hooks de Redux

Exemple de travaux pratiques (à titre indicatif)

Mise en oeuvre de Redux

§ Plus loin avec React

Les tests unitaires dans ReactJS

ReactJS côté serveur : les applications isomorphiques

Développer une application native pour Android et iOS

Sessions

Filtrer les résultats
Modalités pédagogiques
Formation synchrone se déroulant avec la présence physique du (des) formateur(s) et du (des) apprenant(s) réunis dans un même lieu de formation.
Formation combinant des séquences en présentiel et des séquences à distance synchrones ou asynchrones.
Formation à distance, asynchrone, s’appuyant sur une plateforme d’apprentissage, pouvant être complétée par d’autres modalités de formation à distance (visio-conférence…)
Formation à distance, synchrone, s’appuyant sur un dispositif de visio-conférence. La classe virtuelle recrée à distance les conditions d’une formation en salle traditionnelle.
Type de formation
La formation en Inter est dispensée pour un groupe de salariés d’entreprises différentes.
La formation en Intra est dispensée pour un groupe de salariés d’une seule et même entreprise.
Options
Les compétences professionnelles visées par la formation sont validées via un test permettant d’obtenir une certification officielle.
Ces sessions ne peuvent être ni annulées ni reportées par l’organisme de formation.