Développer des applications web avec ReactJS

Objectifs pédagogiques

À l’issue de la formation, le participant sera en mesure de :

• Créer une application React.js
• Savoir utiliser les outils de développements
• Développer des interfaces utilisateurs
• Tester les composants
• Mettre en place une architecture avec Redux

PROGRAMME

1. Javascript

• Historique
• ES5 / ES2024 / ES2025
• Callback vs Promise vs Async/Await
• Mise en pratique: Installation de l'environnement de développement et Manipulation langage JavaScript

Objectif opérationnel : Rafraichir les connaissances de la prochaine génération de Javascript (ES)
Moyen d’évaluation : QCM
 

2. Présentation de React.js

• Historique du framework
• Utilisation de Vite
• Comprendre la structure du projet React
• Syntaxe JSX/TSX
• Premiers composants ( Render, Props, State, … )
• Introduction au React Compiler - optimisations automatiques
• Mise en pratique : Dans un projet initialisé, manipulation simple de composants

Objectif opérationnel : Découvrir la syntaxe du JSX et avoir une idée sur ce que c’est un composant React 
Moyen d’évaluation : QCM
 

3. Composants

• Class Components
• Functional Components
• Lifecycle and states
• Conditional rendering et listes
• Composition
• Context API
• Composants typés avec TypeScript
• Atelier : Manipuler les composants et leur cycle de vie et que la mise en page.

Objectif opérationnel : Plonger profondément dans les composants React et comprendre leurs différents types.
Moyen d’évaluation : QCM
 

4.React Hooks

• Présentation des Hooks
• Utiliser les hooks essentiels
• Impact du React
• Compiler sur l'utilisation des hooks
• D’autres hooks
   

Objectif opérationnel : Pouvoir utiliser les Hooks pour se servir des fonctionnalités de React (state, lifecycle, context...) dans des Composants fonctionnels
Moyen d’évaluation : QCM
 

5. Requêtes HTTP en React.js

• Comprendre les requêtes HTTP en React
• Axios vs Fetch
• Gestion des requêtes avec Async/Await
• React Query (TanStack)
• Gestion du cache, mutations, synchronisation
• Types TypeScript pour les APIs et les réponses HTTP

Objectif opérationnel : Pourvoir échanger avec un service HTTP externe pour récupérer et transmettre des données
Moyen d’évaluation : QCM
 

6. Router

• Pourquoi avons besoin d’un outil pour le routing entre les pages ?
• Présentation de react-router
• Atelier : Réalisation d'une application permettant de mettre en place plusieurs pages et de naviguer entre elles.

Objectif opérationnel : Pouvoir gérer des pages multiples et les lier en utilisant react-router
Moyen d’évaluation : QCM
 

7. Code quality

• Présentation des outils permettant de garantir la qualité d’une application React.js
• ESLint pour TypeScript et React
• Jest et React Testing Library
• Atelier : En s’appuyant sur une application réalisée précédemment, ajout des outils Esllint, Jest et Enzime

Objectif opérationnel : Écrire un code clean et valide et bien tester.
Moyen d’évaluation : QCM

Informations pratiques

• ‍Théorie 40%
• Pratique 60%
• Lieu au choix : Centre de formation bewizyu (Nantes) / Dans vos locaux / Classe à distance

Formateur

Consultant JavaScript Web et Mobile, avec une vision très opérationnelle, en tant que développeur expérimenté d'applications mobiles Cross-Platforms.

Personnes en situation de handicap‍

Nos formations sont accessibles aux personnes en situation de handicap. Afin de nous permettre d’organiser le déroulement de la formation dans les meilleures conditions possibles, contactez-nous. Un entretien avec notre référent.e handicap pourra être programmé afin d’identifier les besoins et aménagements nécessaires.

Programme et catalogue peuvent être envoyés sur simple demande