Formation Zustand & React Query : La gestion d'état moderne

Programme de la formation
Zustand & React Query : La gestion d'état moderne

• Introduction à Zustand : Création et utilisation d'un store simple

  - Créer un store Zustand pour gérer un état global.
  - Accéder aux données du store via des sélecteurs.
  - Mettre à jour l'état du store de manière immuable.

• Zustand avancé : Persistance, middlewares et hooks personnalisés

  - Persister l'état d'un store Zustand localement.
  - Intégrer des middlewares pour des actions asynchrones.
  - Développer des Hooks personnalisés pour encapsuler la logique d'état.

• Introduction à React Query : Requêtes de données et mise en cache

  - Configurer React Query dans une application React.
  - Effectuer des requêtes asynchrones avec `useQuery`.
  - Comprendre le mécanisme de mise en cache des données.

• Optimisation des requêtes avec React Query : Invalidation et revalidation

  - Invalider le cache de requêtes spécifiques.
  - Configurer la revalidation automatique des données.
  - Gérer les états de chargement et d'erreur des requêtes.

• Mutations de données avec React Query : Création, mise à jour, suppression

  - Implémenter des mutations pour modifier des données côté serveur.
  - Gérer les réponses des mutations et les effets secondaires.
  - Optimiser l'interface utilisateur après une mutation réussie.

• Synchronisation UI/Serveur : Hydratation et gestion des données optimistes

  - Hydrater le cache de React Query depuis le serveur.
  - Implémenter des mises à jour optimistes de l'interface utilisateur.
  - Gérer les annulations de mutations en cas d'échec.

• Cas d'usage combinés : Panier d'achat persistant et profil utilisateur

  - Synchroniser un panier d'achat persistant avec Zustand.
  - Gérer les données utilisateur (profil) avec React Query.
  - Appliquer les sélecteurs pour optimiser les rendus.

• Stratégies avancées : Pagination, Infinite Scroll et gestion des dépendances

  - Implémenter la pagination et l'infinite scroll avec React Query.
  - Gérer les dépendances entre différentes requêtes.
  - Réduire le boilerplate lié à la gestion d'état et des données.