Logo React / Redux

Formation React / Redux

React est une bibliothèque JavaScript open source créée par Facebook pour la création d'interfaces utilisateur. Elle a été conçue pour faciliter la création de composants d'interface utilisateur réutilisables et performants, qui peuvent être utilisés pour construire des applications Web et mobiles. React utilise un modèle de données déclaratif, ce qui signifie que vous décrivez ce que vous voulez afficher sur l'interface utilisateur, sans avoir à vous occuper de la façon dont cela est affiché. React gère lui-même la mise à jour de l'interface utilisateur en fonction des changements dans les données. Cela rend les applications React rapides et réactives, car elles ne rechargent pas toute la page lorsque les données changent, mais mettent simplement à jour les éléments de l'interface utilisateur qui ont été modifiés. React est souvent utilisé avec d'autres bibliothèques et frameworks, tels que Redux pour la gestion de l'état de l'application et React Router pour la gestion de la navigation. Il est également couramment utilisé avec des bibliothèques de composants, comme Material-UI ou React-Bootstrap, qui fournissent des composants prédéfinis pour la création d'interfaces utilisateur.

Objectifs pédagogiques / Compétences visées

  • Créer des composants React en lien avec le State et les Props
  • Maitriser le JSX, les listes et les événements
  • Développer une application en lien avec Redux
  • Créer une Single Page Application avec React Router

Pré-requis

  • Connaître les bases d'HTML et CSS
  • Avoir déjà développé en JavaScript

Public

  • Développeurs
  • Chefs de projets

Programme

Jour 1

Les IDEs JavaScript

  • Visual Studio Code
  • WebStorm
  • EditorConfig

Une réintroduction à JavaScript

  • Closures
  • Fonctions Constructeurs et Prototype
  • De ES6/ES2015 à ESNext

Outillage d’un projet React

  • Les bundlers : webpack, Parcel, Rollup, esbuild...
  • Live Server et Hot Reloading
  • create-react-app
  • React Developer Tools

Introduction à React

  • Création d'un projet
  • Les commandes de react-scripts
  • Premier Composant React
  • Composant stateless vs statefull

Jour 2

JSX

  • Ecrire un composant sans JSX
  • Expressions et propriétés
  • Rendu conditionnel
  • Liste et clés

Composants React

  • State et Cycle de vie
  • Ecouter des événements
  • Les formulaires
  • Partager le state entre plusieurs composants
  • Mettre en forme avec les CSS Modules ou du CSS in JS

Introduction à Redux

  • Pourquoi et quand utiliser Redux ?
  • Structurer son app React autour d'un seul state
  • Redux Devtools Extension
  • Actions, Dispatch et Reducers
  • Intégrer Redux dans React avec react-redux

Jour 3

Structurer une application Redux

  • Factoriser les types avec des constantes
  • Factoriser les actions avec des actions creators
  • Les sélecteurs et la bibliothèque reselect

React Router

  • Créer une Single Page Application avec React Router
  • Créer des liens
  • Déclencher une navigation
  • Récupérer le contenu de l'URL
  • Imbriquer des Routes

Moyens pédagogiques et techniques

  • Formateur validé par nos équipes techniques et pédagogiques
  • Salle de formation informatisée
  • Support de cours numérique

Suivi et appréciation des résultats

  • Questions orales ou écrites (QCM)
  • Exercices pratiques
  • Formulaires d'évaluation

Avis

Olivier T.

le 24 novembre 2023

La formation
top

Chayma B.

le 06 novembre 2023

Saifeddin D.

le 06 novembre 2023

Jingyi L.

le 06 novembre 2023

Nicolas D.

le 06 novembre 2023

Laurent L.

le 06 novembre 2023

Ludovic R.

le 06 novembre 2023

Philippe G.

le 06 novembre 2023

Jingyi L.

le 28 avril 2023

Abdeljabar M.

le 28 avril 2023

Gerald H.

le 28 avril 2023

Ines B.

le 28 avril 2023

Thomas D.

le 28 avril 2023

Sarra S.

le 28 avril 2023

Florent V.

le 28 avril 2023

Frédéric G.

le 28 avril 2023

Florent P.

le 11 janvier 2023

Thouraya A.

le 11 janvier 2023

Thomas M.

le 11 janvier 2023

Amel T.

le 11 janvier 2023

Nizar T.

le 11 janvier 2023

Badreddine B.

le 11 janvier 2023

Asma Y.

le 11 janvier 2023

Assem M.

le 04 novembre 2022

Chaima K.

le 04 novembre 2022

Le formateur
Un grand merci pour le formateur.

Mouhcen H.

le 04 novembre 2022

Lin C.

le 04 novembre 2022

Ilias L.

le 04 novembre 2022

Le formateur
Les explications du formateur étaient très claires et bien illustrées. Très bon programme !

Tomy R.

le 04 novembre 2022

Livio C.

le 04 novembre 2022

Commentaire général
Je ne sais pas

Bilel T.

le 13 juillet 2022

Wedjen M.

le 13 juillet 2022

Marie B.

le 13 juillet 2022

La formation
J'aurais juste aimer aborder davantage les contextes natifs de react et ensuite voir ce que proposait Redux, pour bien comprendre le gap entre les deux.

Le formateur
Parfait

Florent G.

le 13 juillet 2022

Ayoub M.

le 13 juillet 2022

Mathieu C.

le 13 juillet 2022

Patricia D.

le 13 juillet 2022

Moez B.

le 13 juillet 2022

Benjamin G.

le 13 juillet 2022

Wissem A.

le 27 juin 2022

Enis K.

le 27 juin 2022

Edin K.

le 27 juin 2022

Matthieu B.

le 27 juin 2022

Claire R.

le 27 juin 2022

Sébastien L.

le 27 juin 2022

Hervé C.

le 27 juin 2022

Intissar Z.

le 27 juin 2022

Gilles C.

le 13 décembre 2021

Stéphane F.

le 13 décembre 2021

Vincent G.

le 13 décembre 2021

Michel Z.

le 13 décembre 2021

Pascal H.

le 13 décembre 2021

La formation
Contenu dense. J'ai trouvé cette partie peut être plus abordable que d'autres comme Invesify.

Les +
La mise en application dans des exercices.

Julien D.

le 13 décembre 2021

Fabrice C.

le 13 décembre 2021

Les +
Diversité des sujets abordés (CSS, bases de données, tests unitaires...)

Christophe M.

le 13 décembre 2021

Commentaire général
Toutes ces formations m ont permis de comprendre les principes et les problematiques liés aux langages comme TS et les frameworks

Stéphane G.

le 13 décembre 2021

Les +
Qualité, disponibilité, méthodologie du formateur

Quentin G.

le 13 décembre 2021

Aymen A.

le 13 janvier 2021

Yosra G.

le 13 janvier 2021

Pascale M.

le 13 janvier 2021

Nabil S.

le 13 janvier 2021

Frédéric C.

le 13 janvier 2021

La formation
Un peu particulier comme maniere de coder, probablement une question d'habitude.

Le formateur
Tres bien.

Les +
Les exemples permettent de bien comprendre l'idee generale.
Apres restent les subtilites.

Commentaire général
A voir en fonction des besoins et des taches prevues sur cube2.

Patrice M.

le 13 janvier 2021

Cédric C.

le 13 janvier 2021

Maxime D.

le 13 janvier 2021

La formation
Nécessiterait peut-être un peu plus de temps pour faires d'autres TP et mieux intégrer le "mindset" React, qui n'est franchement pas intuitif quand on n'arrive des technos non web.

Eric A.

le 13 janvier 2021

La formation
Manque parfois certains details lors des exercices

Formations associées

Dernière modification le 24/03/2023