1
Rappels sur les composants des RIA
- Rappels : HTML, CSS, JavaScript et le DOM.
- Limites des architectures JavaScript classiques.
- Principes de réactivité : observable, Virtual DOM…
- Découverte de React : philosophie, atouts, performances.
- JSX : syntaxe, intérêt, transpilation.
- Environnement moderne : installation via Vite.
- Maitrise de createRoot, automatic batching, rendu concurrent.
Travaux pratiques
Installation de l’environnement et création d’un premier composant React.
2
Développer avec ReactJS
- Architecture MVC et Virtual DOM.
- Comprendre JSX en détail, bonnes pratiques.
- Présentation de TSX (TypeScript Execute).
- Composants fonctionnels versus classes.
- Recommandations et migration vers les composants fonctionnels.
- Cycle de vie et hooks de base : useState, useEffect, useRef.
- Bonnes pratiques d’utilisation des hooks.
- Création de hooks personnalisés.
- Gestion de l’état et rendu dynamique.
- Passage de données par les props.
Travaux pratiques
Création de composants fonctionnels interactifs avec hooks.
3
Interactivité des composants
- Gestion des événements et binding automatique.
- Communication parent/enfant, levée d’événements.
- Composition et hiérarchie des composants.
- Formulaires contrôlés et validation.
- Futur des optimisations avec React Compiler.
- Les hooks : useTransition, useDeferredValue pour interfaces fluides.
Travaux pratiques
Création d’une interface utilisateur réactive avec formulaires et transitions.
4
Application monopage avec React et Redux
- Principe du flux unidirectionnel : actions, dispatcher, stores, vues.
- Présentation de Redux.
- Architecture fonctionnelle et reducers.
- Simplification avec Redux Toolkit et les hooks useSelector, useDispatch.
- Alternatives de l’ecosystème : Zustand, Recoil…
- Gestion de la récupération de données : fetch, axios…
- Hooks spécialisés : useActionState, useOptimistic, TanStack Query.
Travaux pratiques
Développement d’une SPA complète gérant les données et les états.
5
Application isomorphique et rendu serveur
- Principe et intérêt du rendu isomorphique.
- Introduction à Node.js pour le rendu serveur.
- Configuration SSR : React DOM Server, hydratation, streaming SSR.
- Server Components : architecture mixte client/serveur et réduction du JavaScript chargé.
- Présentation des frameworks compatibles (Next.js, Remix).
Travaux pratiques
Mise en œuvre d’un rendu SSR (rendu côté serveur) simple et comparaison avec CSR (rendu côté client).
6
Introduction à React Native
- Présentation de React Native et différences avec Cordova ou Ionic.
- Concepts communs : JSX, composants, hooks, Virtual DOM natif.
- Nouveautés de React Native.
- Utilisation de EXPO, aperçu d’un projet multiplateforme.
Démonstration
Création d’une mini-application mobile simple avec React Native.
3j
- 21h00 
Télécharger le programme
Partager cette formation