ReactJS

Développer une application web avec ReactJS

  • Filière :

    Développement logiciel

  • Sous-filière :

    Technos Web (PHP, JS...)

  • Référence

    DW-REA

  • Durée

    3 jours (21 h)

  • Prix par personne HT

    2 051 € HT

Objectifs pédagogiques

  • Maîtriser les spécificités de ReactJS
  • Développer des applications web performantes avec ReactJS
  • Conception de SPA avec ReactJS et architecture Flux
  • Compréhension approfondie de JSX
  • Optimisation des performances des applications riches (RIA)
  • Compréhension des implications du choix d’architecture pour ce type d’application

Public cible

  • Développeurs
  • Architectes logiciels
  • Chefs de projet informatique

Pré-requis

  • Avoir une expérience pratique en développement Web
  • Connaissance et pratique de JavaScript (au moins ES5)

Programme de la formation

Introduction à ES6 et révisions

  • Environnement de développement et IDE
  • Outil React developer tools pour navigateurs
  • Gestion de paquets avec npm
  • Transpilation d’EcmaScript
  • Utilisation de « let » pour les variables, constantes
  • Typage et types de données natifs
  • Paramètres optionnels et valeurs par défaut
  • Définition de classes et interfaces
  • Gestion des modules JavaScript
  • Fonctions fléchées (Arrow functions)

Introduction à React.js

  • Fondamentaux : avantages de React face à ses concurrents
  • Philosophie orientée composant
  • Méthodologies de développement avec React
  • Le DOM Virtuel et son processus de réconciliation

JSX et composants dans React

  • Création d’éléments React : types, attributs, enfants
  • Intégration avec le DOM via ReactDOM.render()
  • Introduction à la syntaxe JSX
  • Sécurité XSS et règles JSX
  • Création et utilité des composants, leur réutilisabilité
  • Composants sous forme de classes et fonctionnels
  • Imbrication de composants

Les Props dans React

  • Concept et utilisation
  • Passage et accès aux props
  • La propriété « children »

Gestion de l’état (State) et cycles de vie des composants

  • Définition et initialisation du state
  • La méthode setState
  • Cycles de vie : montage, mise à jour, démontage
  • Bonnes pratiques

Introduction aux Hooks dans React

  • Comparaison Hooks et composants de classe
  • Utilisation des hooks d’état et d’effet

Gestion des événements dans React

  • Syntaxe et gestion des événements
  • Liaison des événements et passage de paramètres

Rendu conditionnel et gestion des listes

  • Techniques de rendu conditionnel
  • Manipulation de listes avec les fonctions map, filter, etc.

Les formulaires dans React

  • Gestion de l’état du formulaire
  • Composants contrôlés et non contrôlés

Routing et navigation

  • Création de Single Page Applications (SPA)
  • Utilisation de react-router-dom

Introduction à Redux et l’architecture Flux

  • Concepts d’immutabilité et de gestion d’état
  • Configuration et utilisation de Redux avec React

Les tests dans React

  • Utilisation du framework Jest
  • React testing library pour les tests d’interface

Qualité

Cette formation est accessible aux personnes en situation de handicap, nous contacter en cas de besoin d’informations complémentaires.

Programme mis à jour le