Accueil › Formations › Informatique › Langages et développement › Développeur Web HTML 5, CSS 3 et JavaScript › ReactJS - Maîtriser le framework
Objectifs pédagogiques
- Connaître ReactJS et son fonctionnement
- Ecrire des composants en ES2015
- Développer une application à l'aide d'un environnement de développement.
Niveau requis
Avoir une très bonne connaissance de JavaScript et de ses aspects avancés.
Public concerné
Développeurs ayant à réaliser des applications Web responsives.
Programme
Jour 1
Introduction
- Rappels sur les aspects avancés de JavaScript
- Rappels sur HTML 5, CSS 3, le DOM
- Rappels du pattern MVC
- Positionnement de ReactJS
- Virtual DOM avec ReactJS
- Mise en place des outils de développement
- Plug-ins nécessaires aux outils
- Synthèse des apports de ES2015
- Compatibilité actuelle des browsers
- Routage
- Tour d'horizon des outils de développement et d'intégration actuelle
- Compilateurs disponibles
Exemple de travaux pratiques (à titre indicatif)
- Mise en oeuvre de l'outillage nécessaire au développement d'une application React
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 (à titres indicatifs)
- 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
Communication inter-composants avec ReactJS
- Communication inter-composants
- Gestion des évènements
- Auto-binding
- 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 3
Modularisation
- Présentation
- De CommonJS
- Des modules ES6
- De Webpack
- Création d'un bundle modularisé client
Exemples de travaux pratiques (à titres indicatifs)
- Découpage d'une application en modules
- Création d'un bundle
Echanges avec le serveur
- Présentation de l'architecture REST
- Echanges entre l'application React et un serveur via REST
Exemple de tarvaux pratiques (à titre indicatif)
- Appel de services REST et exploitation des données en JSON dans l'application React
Redux
- Présentation du workflow
- Présentation de Flux
- Eléments composants Redux
- Intégration de Redux dans React
Exemple de travaux pratiques (à titre indicatif)
- Mise en oeuvre de Redux
Applications isomorphiques avec ReactJS
- Faire fonctionner l'application ReactJS aussi bien du côté serveur que client
- JavaScript du côté serveur
- Présentation de Node.js
Exemple de travaux pratiques (à titre indicatif)
- Passage d'une application React en équivalent isomorphique
ReactJS et mobilité
- Construction d'applications natives IOS et Android avec React Native
Certification (en option)
- Nos tests de validation des compétences font partie intégrante du processus d'apprentissage car ils permettent de développer différents niveaux d'abstractions.
- Solliciter l'apprenant à l'aide de nos QCM, c'est lui permettre d'étayer sa réflexion en mobilisant sa mémoire pour choisir la bonne réponse. Nous sommes bien dans une technique d'ancrage mémoriel.
- L'examen sera passé à la fin de la formation.
