React.js + Redux

Bonnes maîtrises de l'environnement JavaScript

Découvrir React.js et Redux

Introduction

Développement d'applications web
Panorama des librairies disponibles
React.js: présentation, composantes
Rappels HTML5, JavaScript, JSX, le DOM

Atelier: Mise en place d'un projet REACT JS

ECMASCRIPT 2015 (ES6)

Spécification ECMAScript et implémentations (JavaScript, JScript)
Transpilation ES6 => ES5 avec Babel
Programmation Orientée Objet:
Evolution de la programmation orientée prototype
Classes: membres d'instances et membres de classe
Agrégation d'objets (mixins)
Héritage
Arrow functions
Design patterns
Définition de modules
Système natif de gestion des modules, chargement
Gestion des dépendances

Approche MVC et Virtual DOM

Architecture de REACT
Vues (V): fonctionnement, implémentation
Implémentation des vues: affichages, saisies, actions, binding et filtres

Composants REACT JS

Définir un composant
Créer un premier composant

Utiliser les propriétés

Etats des composants

Style CSS pour un composant

Gestion des évènements

Relation entre composants: créer et appliquer les références, ajouter
des enfants aux éléments, interaction avec les propriétés.

Cycle de vie d’un composant

Comprendre les cycles

Monter un composant

Ajouter des méthodes à un composant et des propriétés par défaut

Fixer des types de propriété

Navigation REACT JS

Mise en place du Routing (React-router)

Rendu d’une route

Liens via les Router

Organiser les routes

Passage de paramètres liens, redirections

Redux

Présentation de redux
Combiner React Router et Redux
Les avantages apportés par les Store
Créer et configurer un Store
Les Actions et Les Reducers
Utiliser les Action Creators
La fonction connect()
Redux Form
Les validateurs de formulaire

Conclusion

Bonnes pratiques REACT JS (state, prop types, render, composition, hoc)
Astuces

Méthodologie basée sur l'Active Learning : 75% de pratique minimum. Chaque point théorique est systématiquement suivi d'exemples et exercices.

Contrôle continu

Attestation de fin de stage mentionnant le résultat des acquis