Formation Développer des applications avec React.js, Redux et Zustand (individualisée et personnalisée)

Module 1 Introduction et rappels ES6
• Outils et IDE (Integrated Development Environment)
• L’extension du navigateur React Developer Tools
• Packaging, npm
• Rappels ES6 : let, const, classes, interfaces, modules, fonctions arrow

Module 2 Le framework ReactJS
• Principes de base et comparaison avec les autres frameworks
• Philosophie “composant”
• Workflows de développement : from scratch, intégration à une application Web existant
• Le DOM virtuel

Module 3 Le JSX et les composants
• Définition d’un élément React
• Liaison avec le DOM (ReactDOM.render())
• Syntaxe JSX
• Les composants : définition et intérêt
• Composants en mode classe et composants fonctionnels
• Imbrication de composants

Module 4 Les props
• Définition des props et transmission de données
• Accéder aux props
• La props.children

Module 5 Le routing et la navigation
• Construire une SPA (Single Page Application) avec react-router-dom (version 6)
• Le router, les liens, les routes, le switch
• Les paramètres d’URL et les navigations imbriquées

Module 6 Les Hooks
• Définition et comparaison avec les composants en mode “classe”
• Hooks d’état (useState) et d’effet (useEffect)
• Règles des Hooks et custom Hooks

Module 7 Syntaxe des évènements dans le JSX
• Gestion des méthodes d’évènement (handlers)
• Contenu conditionnel et raccourcis (opérateur &&, opérateur ternaire)

Module 8 Listes et raccourcis (map, filter)
• Les clés (key) et le DOM virtuel
• Les fragments
• Etat du composant et composants contrôlés
• Gestion des formulaires et refs

Module 9 Gestion des formulaires avancés
• Utilisation de bibliothèques comme Formik ou React Hook Form
• Validation des formulaires avec Yup ou autres bibliothèques

Module 10 Stylisation et CSS en React
• CSS-in-JS avec Styled Components ou Emotion
• Frameworks CSS comme Material UI ou Prime en React
• CSS Modules et préprocesseurs comme SASS/SCSS

Module 11 Partage de la donnée dans une application React
• Problème de la gestion d’état
• Contexts
• Introduction à Redux
• Les actions, les reducers et le store
• Utilisation de Zustand
• Création de stores globaux pour la gestion d’état
• Gestion de l’état partagé entre composants

Module 12 Introduction aux tests unitaires
• Le framework Jest (setup, teardown, describe, it)
• La React Testing Library (cleanup, render, fireEvent)
• Tests d’intégration et tests end-to-end
• Utilisation de Cypress pour les tests E2E
• Mocking et tests avec des API

Module 13 React Query (équivalent SWR)
• Principes de Base de React Query :
• Fetching de Données
• Mutations et Invalidations
• Gestion du Cache et Synchronisation
• Optimisations et Configurations Avancées

Module 14 Introduction à Next.js
• Routing et Pages :
• Data Fetching
• Optimisations de Performances :
• API Routes et Middleware :
• Déploiement et Scalabilité :
• Intégration avec d’autres outils et bibliothèques

Module 15 Optimisation des performances
• Techniques pour optimiser les performances des applications React
• Utilisation de React.memo, useCallback, et useMemo
• Lazy loading avec React.lazy et Suspense