fff

Combien de stagiaires suivront cette formation ?


Valider Annuler

Partager
Accueil    Formations    Informatique    Langages et développement    Développeur Web HTML 5, CSS 3 et JavaScript    ReactJS - Fonctionnalités avancées

Partager cette formation Télécharger au format pdf Ajouter à mes favoris

Public concerné

Dévelopeurs.

Prérequis

Avoir suivi la formation JVS-REA "ReactJS - Développement d'applications Web" ou avoir les connaissances équivalentes. Avoir une très bonne connaissance de JavaScript et de ses aspects avancés.

Objectifs de formation

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.

Programme de votre formation

  1. #

    M2i START AVANT VOTRE FORMATION

    Contextualisation du projet de formation et prise en compte des besoins de chacun

    • Positionnement initial de l’apprenant par rapport aux objectifs
    • Définition des priorités et des objectifs personnels de l’apprenant
    • Vidéos de mise en situation
    • Accès au Chat interactif myM2i pour interagir avec les membres de son groupe
    m2i_start_logo
  2. #

    M2i LIVE VOTRE FORMATION ANIMÉE PAR NOTRE EXPERT ¹

    Programme

    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

    Le contenu de ce programme peut faire l'objet d'adaptation selon les niveaux, prérequis et besoins des apprenants.

    m2i_live_logo
  3. #

    M2i BOOST APRÈS VOTRE FORMATION

    Réactivation et consolidation des acquis en situation de travail

    • 30 jours d’accompagnement personnalisé sur myM2i inclus ²
    • Ressources Boosters (Abonnement au M2i’Mag Soft Skills, formations offertes, invitations aux conférences d’actualité…)
    m2i_boost_logo
  1. ¹ Les actions et les outils présentés dans ce programme le sont à titre indicatif et peuvent faire l’objet d'adaptation selon les niveaux, prérequis et besoins des apprenants. Les compétences clés de ce programme sont traitées à raison d'une compétence par demi-journée de formation.
  2. ² Sur myM2i, pendant 30 jours post-fin de formation, les apprenants disposent d’une messagerie sécurisée pour échanger, dans la limite de 4 sollicitations, avec leur formateur.

Modalités, méthodes et moyens pédagogiques

Formation délivrée en présentiel ou distanciel* (blended-learning, e-learning, classe virtuelle, présentiel à distance).

Le formateur alterne entre méthode** démonstrative, interrogative et active (via des travaux pratiques et/ou des mises en situation).

Variables suivant les formations, les moyens pédagogiques mis en oeuvre sont :

  • Ordinateurs Mac ou PC (sauf pour certains cours de l'offre Management), connexion internet fibre, tableau blanc ou paperboard, vidéoprojecteur ou écran tactile interactif (pour le distanciel)
  • Environnements de formation installés sur les postes de travail ou en ligne
  • Supports de cours et exercices

En cas de formation intra sur site externe à M2i, le client s'assure et s'engage également à avoir toutes les ressources matérielles pédagogiques nécessaires (équipements informatiques...) au bon déroulement de l'action de formation visée conformément aux prérequis indiqués dans le programme de formation communiqué.

* nous consulter pour la faisabilité en distanciel

** ratio variable selon le cours suivi

Modalités d’évaluation des acquis

  • En cours de formation, par des études de cas ou des travaux pratiques
  • Et, en fin de formation, par un questionnaire d'auto-évaluation et/ou un examen M2i

Accessibilité de la formation

Le groupe M2i s'engage pour faciliter l'accessibilité de ses formations. Toutes nos formations sont accessibles aux personnes en situation de handicap : les détails de l'accueil des personnes sont consultables sur la page Accueil PSH.

Modalités et délais d’accès à la formation

Les formations M2i sont disponibles selon les modalités proposées sur la page programme. Les inscriptions sont possibles jusqu'à 48 heures ouvrées avant le début de la formation. Dans le cas d'une formation financée par le CPF, ce délai est porté à 11 jours ouvrés.

Partager cette formation Télécharger au format pdf Ajouter à mes favoris

Vous souhaitez suivre cette formation ?

Cette formation est disponible en présentiel ou en classe à distance, avec un programme et une qualité pédagogique identiques.

Tarif : à partir de 1 340 € HT.

Choisissez la modalité souhaitée pour vous inscrire :

Formation disponible en intra-entreprise

Votre société a besoin d'une offre personnalisée ? Contactez-nous

string(21) ""
string(21) ""
string(21) ""
string(21) ""

Découvrez les autres formations susceptibles de vous intéresser :

Next.js
New

9 4,6/5


2 jours
Perfectionnement / Avancé

Présentiel Classe à distance

Faites-nous part de votre projet de formation, nous sommes là pour vous guider.