ReactJS : Créer des interfaces web modernes et dynamiques

Objectifs

    À l'issue de la formation, vous serez capable de :

    

   

1. Assimiler l'Écosystème : Comprendre l'architecture de ReactJS, le fonctionnement du Virtual DOM et les spécificités qui le distinguent des autres frameworks du marché.

    

   

2. Développer en Composants : Créer des composants fonctionnels modernes, modulaires et réutilisables en exploitant pleinement la puissance des Hooks pour la logique métier.

    

   

3. Maîtriser le JSX : Manipuler avec aisance la syntaxe JSX pour lier dynamiquement la logique JavaScript à la structure graphique de l'application.

    

   

4. Gérer l'État & le Debug : Appréhender l'architecture de flux de données unidirectionnel (Flux/Redux Toolkit) et utiliser les outils dédiés pour traquer et corriger les bugs.

    

   

5. Valider la Qualité : Mettre en œuvre une stratégie de tests (unitaires et d'intégration) avec des outils modernes (Jest, React Testing Library) pour fiabiliser vos développements.

et 

 

Programme de la formation

    Programme : Ingénierie & Développement ReactJS


    Jour 1 : Révolution du Web, Syntaxe JSX & Initialisation VITE

   

Architecture : Limites du DOM natif, positionnement de React face à l'écosystème JS, apport d'ES6+ et de TypeScript.

   

Composants de base : Syntaxe JSX, structuration d'une application en composants, gestion des données via les props et l'état local (state).

   

Pratique : Conception d'une SPA "from scratch" via diagramme UML, puis initialisation d'un projet interactif moderne avec l'outil Vite.

    Jour 2 : Composants Fonctionnels, Hooks, API Context & Redux

   

Hooks & Routage : Cycle de vie, Hooks fondamentaux (useEffect, useMemo), formulaires contrôlés, navigation et optimisation via Lazy Loading.

   

Gestion d'État : Limites du modèle MVC. Comparaison de la centralisation de données entre l'API Context de React et l'écosystème Redux (Store, Actions, Reducers).

   

Pratique : Développement d'un formulaire de saisie avec validation connecté à une API REST (Axios/Fetch), puis création d'un panier d'achat géré par Store.

    Jour 3 : Outillage, Performance Client & Architectures RIA

   

Build & Optimisation : Fonctionnement des outils de build, compilation, déploiement d'une application et analyse du rendu client avec React DevTools.

   

Architectures Modernes : Concepts de Rich Internet Applications (RIA) et introduction au développement isomorphe (Fullstack JavaScript).

   

Pratique : Génération de builds de production, audit de performance des composants et session interactive de brainstorming sur les architectures modernes.

Validation et sanction

Attestation de formation

Type de formation

Non certifiante

Sortie

Sans niveau spécifique