Formation Développeur Web HTML 5, CSS 3 et JavaScript ReactJS - Maîtriser le framework

Partager cette formation Télécharger au format pdf Ajouter à mes favoris

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.

Les + de la formation

L'examen de certification (proposé en option) est en français.

Partager cette formation Télécharger au format pdf Ajouter à mes favoris