React | Développement front-end en JavaScript Mixte : présentiel / à distance

Dernière mise à jour : 09/10/2024

Bannière visuelle de présentation de la formation

Pré-inscription

Valider la pré-inscription

Présentation

Cette formation React vous permettra d'apprendre à industrialiser, structurer et optimiser vos développements d'applications Web JavaScript en utilisant la bibliothèque React créée par Facebook. Vous découvrirez également Redux, une bibliothèque de gestion d'états.

Objectifs

  • Créer une application React
  • Mettre en œuvre les concepts de la programmation fonctionnelle et déclarative
  • Développer des interfaces utilisateurs à base de composants
  • Gérer la navigation au sein de l'application
  • Mettre en place une architecture de gestion d'état de l'application avec Redux
  • Tester le code et les composants

Programme

JavaScript et EcmaScript 6+

  • Rappels élémentaires sur le langage
  • Maîtriser les closures
  • Les bonnes pratiques en JavaScript
  • Nouvelle gestion des classes
  • Les arrow functions
  • Les template strings
  • L'héritage de classe
  • Spread & Rest
  • Comprendre la déstructuration d'objets et de tableaux
  • Modulariser les applications web

Travaux pratiques : Installation de l'environnement de développement, manipulation du langage JavaScript

 

React et les Composants

  • La philosophie des composants
  • Découverte du langage « JSX » et de la transpilation
  • Créer une hiérarchie de composants
  • Transfert d'informations avec les props
  • Architecturer notre projet, Smart & Dump components
  • Contrôler le réaffichage d'un composant
  • Gestion dynamique et statique du state
  • Comprendre le « VirtualDOM »
  • Optimiser les performances de son application
  • Cycle de vie d'un composant
  • Créer un composant « fonctionnel »
  • Rendez votre code pérenne avec les « propTypes »
  • Mise en place de la projection avec les composants

Travaux pratiques : Réalisation d'une application permettant de manipuler les composants et leur cycle de vie ainsi que la mise en page

 

Les formulaires

  • Dynamiser la validation des formulaires
  • Composants contrôlés
  • Composants non contrôlés
  • Marquer les éléments du DOM avec les références
  • Bien penser ses formulaires

 

Le routing

  • Mise en place de routes complexes
  • Configuration du système de routing
  • Manipuler la navigation des pages
  • Ajouter des paramètres dans nos routes
  • Cycle de vie des routes

Travaux pratiques : Réalisation d'une application permettant de mettre en place plusieurs pages et de naviguer entre elles.

 

Redux

  • Flux et Redux : présentation
  • Propagation de données
  • Comparaison des architectures
  • Création de vues et contrôleurs dans Flux
  • Rôle du dispacther dans Flux pour les actions
  • Les « Stores », gestionnaire d'états logique dans Flux
  • Approche avec Redux
  • Le « Reducer »

Travaux pratiques : Réalisation d'une application permettant de mettre en place la gestion d'état de l'application basée sur Redux

 

Tests unitaires

  • Introduction à Jest, le JUnit de Javascript
  • Tester un composant
  • Tester le DOM avec « dom-testing-library »
  • Le principe F.I.R.S.T.

Travaux pratiques : En s'appuyant sur une application réalisée précédemment, ajout des outils Esllint, Jest et Enzime

 

Server Side Rendering

  • Les avantages du server side rendering (SSR)
  • Intégration dans Redux
  • Principe et bénéfices du développement isomorphique
  • Ecosystème du JavaScript côté serveur
  • Initiation à NodeJS
  • Configuration de NodeJs pour React
  • Mise en place du SSR

 

Internationalization (i18n)

  • Stratégie de mise en place avec les fichiers JSON
  • Les principales librairies d'internationalisation
  • Intégration dans React et Redux

 

Librairies populaires de React

  • ReactNative
  • NextJS
  • Material UI / React Bootstrap

Public visé

La formation React | Développement front-end en JavaScript peut être réalisée par des :

  • Développeurs,
  • Architectes techniques,
  • Chefs de projet.

Prérequis

  • Maîtriser les langages HTML et CSS
  • Maîtriser le langage JavaScript

Modalités pédagogiques

Docaposte Institute propose plusieurs dispositifs pédagogiques adaptés aux apprenants :

  • Formation en présentiel
    • En groupe (inter-entreprises ou intra-entreprise)
    • En individuel (monitorat)
    • En journée ou en cours du soir (sur demande spécifique)
  • Formation en distanciel
    • Distanciel synchrone
    • Distanciel asynchrone

Moyens et supports pédagogiques

  • Apports des connaissances communes.
  • Mises en situation sur le thème de la formation et des cas concrets.
  • Méthodologie d'apprentissage attractive, interactive et participative.
  • Equilibre théorie / pratique : 60 % / 40 %.
  • Supports de cours fournis au format papier et/ou numérique.
  • Ressources documentaires en ligne et références mises à disposition par le formateur.
  • Pour les formations en présentiel dans les locaux mis à disposition, les apprenants sont accueillis dans une salle de cours équipée d'un réseau Wi-Fi, d'un tableau blanc ou paperboard. Un ordinateur avec les logiciels appropriés est mis à disposition (le cas échéant).

Modalités d'évaluation et de suivi

En amont de la formation

  • Recueil des besoins des apprenants afin de disposer des informations essentielles au bon déroulé de la formation (profil, niveau, attentes particulières...).
  • Auto-positionnement des apprenants afin de mesurer le niveau de départ.

 

Tout au long de la formation

  • Évaluation continue des acquis avec des questions orales, des exercices, des QCM, des cas pratiques ou mises en situation...

 

A la fin de la formation

  • Auto-positionnement des apprenants afin de mesurer l'acquisition des compétences.
  • Evaluation par le formateur des compétences acquises par les apprenants.
  • Questionnaire de satisfaction à chaud afin de recueillir la satisfaction des apprenants à l'issue de la formation.
  • Questionnaire de satisfaction à froid afin d'évaluer les apports ancrés de la formation et leurs mises en application au quotidien.

Accessibilité

Nos formations peuvent être adaptées à certaines conditions de handicap. Nous contacter pour toute information et demande spécifique.

Accessibilité à nos formations

Si vous êtes en situation de handicap, contactez-nous avant le début de votre formation pour que nous puissions vous orienter efficacement et vous accueillir dans les meilleures conditions.

Inscription possible jusqu'à 10 jours avant le démarrage de la formation

Prochaines Sessions

  • Désolé, cette formation n'est pas programmée pour le moment.

    Si vous êtes responsable formation, vous pouvez faire une requête pour l'organiser en INTRA dans votre entreprise.

Dans la même catégorie

Catalogue de formation propulsé par Dendreo,
Plateforme dédiée pour les OF