Utilisez la librairie React dans vos applications JavaScript

Objectifs

React est une librairie JavaScript open source pour développer des interfaces utilisateurs alliant performance et facilité de maintenance.

Dans le cadre de cette formation, vous serez amenés à maitriser la notion de composant, la maîtrise de l’état de l’interface, mais vous verrez aussi en quoi React est considéré comme le point de départ d’un véritable écosystème.

Cette formation, composée de cours théoriques et d’exercices pratiques, s’adresse aux développeurs et lead-développeurs souhaitant comprendre le fonctionnement de React et maîtriser les impacts du choix d’une architecture basée sur Redux.

Public

  • Développeurs frontend
  • Développeurs fullstack
  • Chefs de projets techniques

Pré-requis

  • Connaître la syntaxe du langage JavaScript, et avoir des notions d’algorithmie ;
  • Programmer des scripts JS dans le contexte du navigateur (DOM, Événements, AJAX…).

Plan de cours

Jour 1

  • Pourquoi utiliser un framework JavaScript ?
  • Pourquoi jQuery n’est plus le bon outil ?

Utiliser React pour créer des interfaces utilisateur

  • Propriétés et architecture
    • Déterminisme / prédictabilité
    • Flux de données unidirectionel
  • Ecosystème et outillage
    • Transpilation
    • Bundling
    • Debugging
    • Code lint
  • Rappels JavaScript ES6
  • Qu’est-ce qu’un composant ?
  • La syntaxe JSX
  • Les props et leur validation
  • Données internes avec le state
  • Gestion des événements dans React
  • Cycle de vie d’un composant
  • Communication entre composants
  • Test automatisé & shallow rendering

Jour 2

Gestion d’état avec Redux

  • Architecture Flux
  • État de l’art et alternatives
  • Déterminisme & pureté des fonctions
  • Concepts de base
  • Flux de données
  • Utilisation avec React
    • Quand utiliser Redux avec React ?
    • Composant conteneur & de présentation
  • Outils de développement avec Redux
  • Test automatisé avec Redux
  • Les middlewares
  • Effets de bord & traitement asynchrone
    • Usage d’API externes HTTP
    • Écosystème & bibiothèques
  • Routeur & deep linking

Jour 3

Design patterns, bonnes pratiques & performance

  • Higher-order components
  • Functions as Child Components
  • DOM virtuel
  • Mesure et optimisation des performances

Aller plus loin

  • Internationalisation
  • Pièges à éviter
  • Les apports du typage fort
  • Mise à jour & automatisation
  • React Native
Télécharger le plan

Méthode pédagogique

Nous pouvons adapter la formation à vos besoins, en mettant l’accent sur un aspect plus particulier du développement. Avant chaque formation, nos formateurs contactent les participants afin de déterminer vos objectifs et savoir s’il faut mettre l’accent sur un sujet particulier. C’est le bon moment, pour vous, d’échanger avec le formateur pour lui permettre de mieux cerner vos objectifs et les aspects que vous aimeriez voir approfondis.

Moyens

JoliCampus met à disposition pour le bon déroulement de la formation :

  • Les compétences techniques, professionnelles, pratiques et théoriques des formateurs en rapport avec React et ayant la capacité de transmettre leurs connaissances
  • Une salle calme et lumineuse, adaptée à cet effet et avec une excellente connexion internet
  • Des supports de formation à la disposition de chaque participant