Formation React.js : Développer des interfaces web modernes

Programme de la formation
React.js : Développer des interfaces web modernes

• Introduction à React.js et JSX

  - Configurer un environnement de développement React.
  - Écrire des composants fonctionnels simples en JSX.
  - Comprendre le rôle du Virtual DOM dans le rendu.

• Composants fonctionnels et Props

  - Structurer des composants React fonctionnels.
  - Transmettre des données entre composants via les Props.
  - Gérer les événements utilisateur dans les composants.

• Gestion de l'état local avec useState

  - Déclarer et mettre à jour l'état local avec le Hook useState.
  - Appliquer le State pour rendre les composants dynamiques.
  - Gérer des formulaires simples avec l'état.

• Effets de bord et cycle de vie avec useEffect

  - Utiliser le Hook useEffect pour les effets de bord.
  - Gérer le cycle de vie des composants (montage, mise à jour, démontage).
  - Nettoyer les effets pour éviter les fuites de mémoire.

• Récupération de données avec useEffect et API REST

  - Interagir avec des API RESTful depuis React.
  - Effectuer des requêtes HTTP (GET, POST) avec fetch ou Axios.
  - Afficher les données récupérées dans l'interface.

• Routage client avec React Router

  - Implémenter le routage client pour une application monopage.
  - Définir des routes et naviguer entre les vues.
  - Utiliser les paramètres de route pour des vues dynamiques.

• Gestion de l'état global avec useContext et useReducer

  - Partager l'état entre composants non liés avec useContext.
  - Gérer des états complexes avec useReducer.
  - Optimiser les mises à jour d'état complexes.

• Optimisation du rendu avec useMemo et useCallback

  - Optimiser le rendu des interfaces utilisateur avec useMemo.
  - Mémoriser des fonctions avec useCallback pour éviter les re-rendus inutiles.
  - Réduire les calculs coûteux dans les composants.

• Références et manipulation du DOM avec useRef

  - Accéder directement aux éléments du DOM avec useRef.
  - Gérer le focus et les animations avec les références.
  - Interagir avec des bibliothèques tierces nécessitant un accès direct au DOM.

• Création d'un tableau de bord interactif (Projet 1)

  - Appliquer les Hooks pour gérer l'état d'un tableau de bord.
  - Intégrer des données d'API REST dans des graphiques.
  - Structurer des composants pour un tableau de bord.

• Développement d'une application de gestion de tâches (Projet 2)

  - Utiliser les Props et le State pour une application de gestion de tâches.
  - Persister les données localement ou via une API.
  - Implémenter des fonctionnalités CRUD (Créer, Lire, Mettre à jour, Supprimer).

• Implémentation d'un formulaire de contact dynamique (Projet 3)

  - Gérer l'état d'un formulaire avec les Hooks.
  - Valider les entrées utilisateur côté client.
  - Soumettre les données du formulaire à une API REST.