Formation React Query

React QueryReactTypeScript

Cette formation a pour vocation de vous familiariser avec  la libraire React Query renommée en Tanstack Query depuis 2022. Avec celle-ci vous  gagnerez du temps sur vos projets React  en diminuant le temps nécessaire à l'intégration d'une nouveau endpoint API et donc à l'implémentation de vos fonctionnalités.

+3hde pratique
650 € HT
/ personne
Prix inter-entreprise
1 jour7 heures

  • En présentiel ou distanciel
  • React Query v3 & v4
  • Mise à jour pour 2022 (Tanstack Query v4)
  • TypeScript par défaut (JavaScript possible)

Présentation

React Query est une librairie qui permet à partir de deux concepts  les Queries (Requêtes) et les Mutations de proposer une interface efficace afin de gérer les données serveurs utilisées au sein de vos applications frontend. D'autre part elles vous permet d' ajouter des fonctionnalités très rapidement  comme les  mises à jours optimistes  (optimistic updates), le  préchargement des données  (prefetching), la  déduplication des requêtes  ou le rechargement automatique des données lors à intervalle régulier ou lors du refocus d'une fenêtre.

Objectifs

  • Comprendre le fonctionnement de React Query, son intérêt et ses limites
  • Savoir utiliser les requêtes et les mutations pour récupérer et mettre à jour les données serveurs sur le front
  • Être capable d'utiliser des concepts plus avancés de React Query comme le prefetching ou les optimistic updates

Prérequis

  • 6 mois d'expérience sur un projet en React et avec un mécanisme de gestion d'état
  • Un ordinateur portable configuré pour le développement avec React à disposition lors de la formation

Public visé

Pour les équipes et développeurs souhaitant :

  • améliorer leur gestion de la récupération des données serveur depuis une application React
  • gagner du temps sur l'intégration des endpoints API
  • ajouter rapidement des fonctionnalités comme les mises à jour optimistes, le préchargement des données, et la déduplication des requêtes

Programme

  • Queries et Query Keys
  • Query Configuration : initialData, staleTime vs cacheTime, focus etc
  • Infinite & Paginated Queries
  • Fetching vs Loading

  • Mutations & Configuration
  • Callbacks
  • Optimistic Updates & Rollbacks

  • Debugging avec React Query Devtools
  • Testing avec Jest, React Testing Library et les mocks

  • Utilisation de React Query sur des applications conséquentes
  • Fonctionnement interne & Performance
  • Bonnes pratiques

Travaux Pratiques

Les travaux pratiques consisteront à :

  • créer et utiliser des requêtes et mutations à partir d'une API
  • utiliser les fonctionnalités avancées de React Query telles que le prefetching
  • tester le code avec Jest et React Testing Library

Nos formateurs

Gabriel Pichot

Gabriel Pichot

Founder @CraftValue

ReactDevOpsTypeScriptFirebaseAWS

Gabriel accompagne start-ups et grands groupes sur leurs projets webs et digitaux. Il partage au sein de ses projets son expérience acquise sur des technologies comme ReactJS, TypeScript, AWS ou encore l'agilité.

Ses formations sont le lieu d'échanges et de retours d'expériences, clefs pour vous transmettre, à vous ou à vos équipes les savoirs nécessaires à une utilisation efficace des outils que vous utilisez. C'est son principal objectif : transmettre un savoir-faire pratique, un véritable artisanat issu d'expérience sur de multiples projets, un ensemble de bonnes pratiques qui booste l'impact que le développeur a sur son travail et sur les projets auxquels il contribue.

Formations qui pourraient vous intéresser

React Avancé3 jours

React Avancé

Maîtrisez le développement d'applications complexes avec React

En savoir plus