Logo React / Redux Avancé

Formation React / Redux Avancé

Ce programme de formation en React / Redux avancé vise à fournir aux développeurs une formation complète sur l'utilisation de ces technologies pour la création d'applications Web modernes. Le premier jour de la formation est consacré à un rappel sur les concepts de base de React, tels que le Virtual DOM, JSX et la réconciliation, ainsi qu'à l'examen de techniques avancées de mise en forme de composants et de rendu de code côté serveur. Les participants apprendront également à utiliser les Hooks de React pour ajouter des fonctionnalités à leurs composants sans passer par les classes. Le deuxième jour de la formation est consacré à l'optimisation des performances de l'application React, ainsi qu'à l'amélioration de la qualité du code en utilisant des outils tels que PropTypes et Flow ou TypeScript. La formation inclut également un rappel sur les concepts de base de Redux, y compris les actions, les dispatchs et les reducers, ainsi que sur l'intégration de Redux avec React grâce à react-redux. Le troisième jour de la formation est consacré à la mise en œuvre avancée de Redux, notamment en utilisant des outils tels que redux-actions et reselect pour améliorer les performances et la gestion des actions asynchrones avec redux-thunk et redux-saga. Enfin nous verrons également comment automatiser les tests avec Jest.

Objectifs pédagogiques / Compétences visées

  • Valider ses acquis sur React et Redux
  • Connaitre les concepts avancés de React et Redux
  • Utiliser des bibliothèques externes pour accélérer le développement
  • Automatiser ses tests avec Jest

Pré-requis

  • JavaScript
  • React
  • Redux

Public

  • Développeurs
  • Chefs de projets

Programme

Jour 1

Rappels sur React

  • Le Virtual DOM, JSX et la réconciliation
  • State vs Props
  • Les méthodes du Lifecycle
  • Controlled vs Uncontrolled components
  • Mettre en forme ses composants : CSS in JS, Modules CSS, Préprocesseurs CSS

React : Concept Avancés

  • Les Fragments de React 16.2
  • Rendu d’un composant depuis son parent avec les Render Props
  • Injecter un objet dans une arborescence de composant avec le Context
  • Ajout de fonctionnalité générique avec les Higher-Order Components
  • Rendu dans un autre élément du DOM avec les Portals
  • Rendu côté serveur avec ReactDOMServer
  • Les Hooks de React 16.8
  • Configuration avancé de Create React App

Jour 2

Optimiser les performances d’une application React

  • Utilisation de l’outil Performance des DevTools
  • Attention aux listes, keys, react-window
  • Limiter la création d’objets par la méthode render
  • shouldComponentUpdate, PureComponent et memo
  • useMemo et useCallback
  • Modules ECMAScript et Tree-Shaking
  • Lazy Loading : React.lazy et Suspense

Qualité de code

  • Rédiger ses propres conventions
  • Le Strict Mode de React
  • Mettre à jour son application serainement avec Yarn ou npm
  • Vérifier les types des Props avec PropTypes
  • Typage statique avec Flow ou TypeScript

Rappels sur Redux

  • Actions et dispatch
  • Reducer et mise à jour du State
  • Actions Creators et Constants
  • Selectors pour retrouver les valeurs du state
  • React-redux pour l’intégration avec React
  • Redux Devtools

Jour 3

Redux Avancé

  • Actions FSA et redux-actions
  • Des sélecteurs plus performants avec reselect
  • Créer ses propres Middlewares pour Redux
  • Persister le store avec redux-persist
  • Séparer les actions asynchrone avec redux-thunk
  • Scénario avancés avec les effets de redux-saga
  • Manipuler les formulaires avec Redux Form

Automatisation des tests

  • Tests Unitaires vs Intégrations vs End-to-End
  • Tests Unitaires avec Jest
  • Créer des mocks pour isoler un test
  • Tester du code Asynchrone
  • Tests de composants avec Enzyme

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

Azzedine A.

le 13 juillet 2023

Benoit W.

le 13 juillet 2023

Les +
Clarté des explications, variété des exemples et bonne couverture de ce que l'on peut faire avec React et Redux

Andrejs Z.

le 13 juillet 2023

La formation
Merci, cela s'est très bien passé et je pense que cela sera très utile pour le développement futur.

Le formateur
Merci à Romain !

Vincent G.

le 13 juillet 2023

La formation
Très bonne formation.
Mérite peut-être une journée de plus.

Leo C.

le 13 juillet 2023

Les +
La formation s'est bien adaptée au contexte de notre équipe

Christophe B.

le 13 juillet 2023

La formation
Il serait intéressant d'intégrer plus de petits exercices quand cela est possible pour mettre en pratique et donc assimiler plus facilement les points théoriques.

Enis K.

le 27 janvier 2023

Thomas M.

le 27 janvier 2023

Sébastien L.

le 27 janvier 2023

La formation
Un peu trop de théorie pour pas assez de pratique

Matthieu B.

le 27 janvier 2023

La formation
Bien niveau equilibre exercices / theorie.

Le formateur
Bonne connaissance du contexte de notre entreprise (proxy, framework Theia etc)

Les +
Pédagogie super
Partie pratique avec explication

Stéphane F.

le 01 avril 2022

Nabil S.

le 01 avril 2022

Cédric C.

le 01 avril 2022

Matthieu N.

le 01 avril 2022

La formation
Formation globallement de très bonne qualité.
Pas du support de cours autre que le site de React. Mais finalement suffisant.
Ce sera peut etre un peu difficile de de s'y retrouver dans les sources des repos après coup si recherche d'un exemple précis.

Frédéric C.

le 01 avril 2022

La formation
Le contenu, je pense avoir compris l'esprit et les sujets couverts globalement.
Mais moins que les precedentes formations avec Romain.

Le formateur
J'ai un peu ete largué à certains moments "live": sur certains aspects creusés ou explorés "live", je ne suivais pas trop, j'ai un peu decroché, trop d'infos, trop rapidement.
Perso, je prefererais avoir moins de choix possibles mais comprendre au final, celui qui est preconise/preferable dans notre contexte (celui de theia de notre projet).
Là, je ne me sens pas trop capable de dire cela.

Les +
RAS

Commentaire général
Pour moi, c'est quelque part, trop avancé, maintenant, car je ne maitrise pas assez bien, les principes de base.
Je ne recommanderai pas à quelqu'un comme moi qui n'a pas trop pratique React avant, car cela ne sera pas tres efficace.
Le rappel du debut fut fort utile, mais, pour la suite, il me manquait de la pratique, clairement.

Julien D.

le 01 avril 2022

Stéphane G.

le 01 avril 2022

Eric A.

le 01 avril 2022

La formation
J'etais trop peu prepare donc ne pas trop tenir compte

Les +
Beaucoup de choses interessantes

Maxime D.

le 01 avril 2022

Anthony F.

le 01 avril 2022

Emil H.

le 06 avril 2022

Erik L.

le 06 avril 2022

Kostianty K.

le 06 avril 2022

Niklas D.

le 06 avril 2022

Samuel H.

le 06 avril 2022

Samuel B.

le 06 avril 2022

Nacera B.

le 17 septembre 2021

Andy C.

le 17 septembre 2021

Yassine Z.

le 17 septembre 2021

Commentaire général
Tout d'abord, je tiens à te remercier pour cette formation.
Nous avons vu le lazy loading de composant lors du jour 2 je crois bien et sur mon projet nous comptons prochainement mettre en place un lazy loading sur une liste de photographies. Aurais-tu une librairie à me conseiller sur ce sujet ?
Merci par avance :)

Salim S.

le 17 septembre 2021

Camille B.

le 17 septembre 2021

Anthony R.

le 17 septembre 2021

La formation
Pour plus d'interactivité, il faudrait faire des quizz ou interroger les participants pour voir si les notions sont acquises

Les +
L'intervenant à une très bonnes connaissances de JS ainsi que d'autre techno Web et de son environnement

Thierno D.

le 17 septembre 2021

Loïc D.

le 17 septembre 2021

Ines K.

le 17 septembre 2021

Marjorie J.

le 17 septembre 2021

La formation
Peut être trop de temps passé à revoir les basiques

Le formateur
Les récap du contenu de la veille sont appréciables, et permettent de revoir les choses avec plus de distance

Yann R.

le 17 septembre 2021

Le formateur
Super formateur ! Merci Romain !! 👌🏻✌🏻

Les +
La pédagogie du formateur et ses explications.

Commentaire général
J'ai bien compris les concepts théoriques, malheureusement je n'ai pas assez pratiqué pour être opérationnel tout de suite mais cela viendra relativement vite. Merci encore !

Angélique C.

le 02 décembre 2020

La formation
Formation complète et explication claire

Commentaire général
Formation complète et techniquement un peu trop avancée par rapport à mon niveau. Mais c'est une bonne base pour pratiquer et me permettre de monter en compétences sur react/redux

Clément G.

le 02 décembre 2020

Le formateur
Très compétent et à l'écoute des développeurs

Les +
Les explications de redux SANS les bonnes pratiques !

Commentaire général
Je recommande la formation et le formateur, exercices complets, mais je rajouterai éventuellement un petit exo de 1 ou 2h retraçant les concepts vus au cours de la forma, from scratch.
En dehors de ça thumbs-up. Merci à Romain

Mohammed Amine B.

le 02 décembre 2020

La formation
Une partie SSR completerait assez bien la formation

Le formateur
Au delà de l'aspect pédagogique, la formation n'était pas que théorique, et on a eu le retour sur experience sur pas mal de choses.

Samir K.

le 02 décembre 2020

La formation
Comme le niveau du group était différent on s’attardais sur des sujet basic si je peux dire ça ce qui nous a fait perdre du temps et donc passer moins du temps sur les concepts avancés

Le formateur
Une bonne présence , des explications très claires appuyées souvent par des exemples.

Dernière modification le 24/03/2023