Description de la formation React JS
Au cours de cette formation Angular, vous allez apprendre à modéliser , concevoir et à réaliser des applications pour le web en utilisant le framework Front end ReactJS.
Objectifs
Concrètement, à l’issue de cette formation ReactJS , les participants auront acquis les compétences nécessaires pour:
- Concevoir une application ReactJS et Redux
- Utiliser JSX et ES2015
- Comprendre l’immutabilité pour optimiser les performances des composants React
- Utiliser Redux pour organiser le code de façon très productive
- Utiliser React côté serveur pour le SEO et la vitesse sur mobile
Introduction à React
Philosophie de React
Les autres Frameworks JavaScript
Environnement de développement
Outils de debug
Les nouveautés ECMAScript
Présentation d’ECMAScript
Les nouveautés ES6/ES2015
ES2017 : les fonctions « async »
Premiers développements avec ReactJS
Le composant
Principe et conséquences du Virtual Dom
La fonction render()
‘props’ et ‘state’
Le langage JSX
Les possibilités de build
Build complet avec webpack
Build managé avec la cli create-react-app
Les différents packages de bootstraping React
Les Composants React
Les composants fonctionnels et de classe
Composition de multiple composants
Cycle de vie d’un Composant de classe
Les Hooks des composants fonctionnels
Gestion des événements click, mouseover…
Styliser ces composants
Les différentes approches pour styliser un composant
La bibliothèque de « styled-components » Emotion
Interaction de l’utilisateur avec les composants
Gestion d’Ajax
Gestion des formulaires
Manipulation du DOM, DOM virtuel
Gestion centralisée des données
Présentation des différentes technologies de gestion (Redux, MobX, etc.)
Présentation de Redux
Le Store et les Actions
Création de Reducteurs pour les Actions
Utilisation avec React
Le Router
Les différents Routers
HashRouter ou PushState
Conséquences sur le déploiement
Application isomorphique
Présentation de NodeJS
Principe et bénéfices du développement isomorphique
Découverte du Framework NextJs
Bonnes pratiques de développement
Rappels prop-types et defaultProps
Passer de flow à TypeScript
Mettre en place des tests unitaires et fonctionnels
Techniques et design patterns avancés
Le pattern des Higher Order Components (HOC)
Le rendu dans des éléments DOM distants avec les Portals
Injection de dépendances avec les Context
Techniques avancées de la méthode render : Fragments et render props
Redux avancé
Rappels Redux : les entités, la syntaxe et l’intégration avec React
Simplifier et optimiser la création de formulaires avec Redux Form
Améliorer l’expérience utilisateur grâce à Redux Persist et au stockage local du state
Créer un Middleware Redux Custom
La bibliothèque Redux-Saga
La programmation réactive
Principe
RxJS