A l'issue de cette formation, vous serez capable de :

• Mettre en oeuvre Redux Toolkit et refondre une application Redux existante en utilisant Redux Toolkit
• Utiliser React Query et l'intégrer dans une application pour récupérer et gérer les données d'une API
• Gérer des PWA (Progressive Web Apps) avec React
• Mémoïser et optimiser des performances avec React
• Ecrire des tests avancés pour une application React
• Migrer une application React utilisant REST vers GraphQL
• Reconnaître les notions avancées telles que la gestion des contextes et des providers
• Utiliser Portals pour le rendu de modales et tooltips
• Gérer les erreurs avec les composants "Error Boundary"
• Mettre en oeuvre les notions avancées dans une application React.

Jour 1 - Matin

Redux Toolkit

• Présentation de Redux Toolkit et ses avantages
• CreateStore et configureStore
• CreateAction et createSlice
• CreateAsyncThunk pour la gestion des actions asynchrones
• UseSelector et useDispatch

Exemple de travaux pratiques (à titre indicatif)

• Refonte d'une application Redux existante en utilisant Redux Toolkit

React Query

• Introduction à React Query et ses avantages
• Installation et configuration de base
• Fetching, caching et synchronisation automatique des données
• Pagination et chargement infini
• Mutation et gestion des erreurs

Exemple de travaux pratiques (à titre indicatif)

• Intégration de React Query dans une application pour récupérer et gérer les données d'une API

Jour 1 - Après-midi

PWA avec React

• Comprendre les PWA et leurs avantages
• Créer une PWA avec Create React App
• Utilisation des Services Workers
• Ajout d'un manifeste d'application Web
• Mise en cache des ressources et stratégies de mise en cache

Exemple de travaux pratiques (à titre indicatif)

• Transformation d'une application React en PWA

Mémoïsation et optimisation des performances

• Comprendre la mémoïsation et son importance
• Utilisation de React.memo pour les composants fonctionnels
• UseMemo et useCallback pour les hooks
• Analyse des performances avec les outils de développement
• Code Splitting et lazy loading avec React.lazy et Suspense

Exemple de travaux pratiques (à titre indicatif)

• Optimisation des performances d'une application React en utilisant la mémoïsation et le Code Splitting

Jour 2 - Matin

Tests avancés

• Tests des composants utilisant Redux et React Query
• Mocking des API et des stores
• Tests des hooks personnalisés
• Tests d'intégration

Exemple de travaux pratiques (à titre indicatif)

• Ecriture de tests avancés pour une application React

Passer de REST à GraphQL

• Introduction à GraphQL et ses avantages
• Installation et configuration d'Apollo Client
• Requêtes et mutations avec GraphQL
• Gestion du cache avec Apollo Client
• Pagination et chargement infini

Exemple de travaux pratiques (à titre indicatif)

• Migration d'une application React utilisant REST vers GraphQL

Jour 2 - Après-midi

Notions avancées supplémentaires

• Gestion des contextes et des providers
• Utilisation de Portals pour le rendu de modales et tooltips
• Gérer les erreurs avec les composants "Error Boundary"

Exemple de travaux pratiques (à titre indicatif)

• Mise en oeuvre des notions avancées dans une application React