Cette formation React Avancé vous permettra de maîtriser les concepts avancés de React pour développer des applications performantes, testables et évolutives.
Pendant 3 jours, vous apprendrez à :
optimiser vos composants
déboguer efficacement et implémenter des stratégies de tests robustes grâce à Vitest et React Testing Library
maîtriser les mécanismes internes de React, notamment la réconciliation et la mémoization, afin d'améliorer la réactivité et la fluidité de vos interfaces
choisir une gestion d'état adaptée (Context API, TanStack Query)
Elle est dispensée en TypeScript, une bonne pratique recommandée pour du développement React avancé.
Public
Cette formation s’adresse aux développeur·euse·s ayant une première expérience avec React et souhaitant élever leurs compétences pour concevoir des applications professionnelles et scalables.
Formation IA-friendly
Cette formation étant
IA friendly,
certaines sessions sont adaptées
aux développeur·se·s qui souhaitent utiliser de l'IA pour coder. Les exercices sont conçus pour tirer parti des IDEs agentiques. Le·a formateur·rice vous accompagnera sur les bonnes pratiques du développement assisté par IA.
Ils témoignent
AD
Aurore D.Hermès Sellier – Hermès Digital Ventes et Services02.06.2025
Une bonne formation qui a servi, le formateur a pris le temps de répondre à toutes les questions et on a eu le temps de voir tous les sujets abordés dans la formation ! Merci Wilfried !
Les objectifs
Comprendre les concepts avancés de React (Réconciliation, Hooks, Références, Contexts)
Être capable de tester un composant React avec Vitest et React Testing Library
Choisir une gestion d'état adéquate en fonction des situations
Diagnostiquer et corriger un problème de performance grâce à la réconciliation et la mémoization
Typer un composant et une application React avec TypeScript
Pré-requis
Avoir eu une première expérience avec React (> 1 an et plus sur un projet)
Avoir une bonne maîtrise des fonctionnalités ES6 et JavaScript (valeur primitives et valeurs par références, import et export nommés et défaut, closures, mémoization, etc.)
Avoir des notions de base de TypeScript (types simples, interfaces), la formation étant dispensée en TypeScript
Avoir un environnement NodeJS et npm/yarn configuré et utilisable. Linux/Mac est à privilégier, mais pas obligatoire.
Ordinateur portable à apporter
Le programme de la formation React Avancé
Jour 1 : Rappels et concepts avancés
Révisions et rappels
Environnement : npm, yarn, npx, NodeJS, V8, React
ES6 (Promesses, async/await, closures, valeurs primitives et par référence, mémoization)
Bases TypeScript (types, interfaces) et rappels sur React (JSX, state, props, hooks)
Concepts avancés et patterns
Hooks avancés et fonctionnement interne (modèle mental), y compris useEffectEvent et le hook use()
Contextes React
Références (refs)
Mises en pratique :
- Création et utilisation d'un contexte
- Utilisation de useRef pour accéder aux fonctionnalités DOM
- Typage d'un composant React
Jour 2 : Performance et Tests
Performance
Fonctionnement du mécanisme de réconciliation
Virtual DOM et implications sur les performances applicatives
Le React Compiler et la mémoization automatique
Mémoization manuelle des composants, hooks et composants purs (React.memo, useMemo, useCallback)
Splitter son code (Lazy Loading, Suspense API)
Tests
Stratégie de tests et état de l'art (React Testing Library, Vitest, Playwright)
Vitest, React Testing Library et mocking
Introduction aux tests end-to-end avec Playwright
Mises en pratique :
- Optimiser le chargement d'une page via le code splitting
- Utilisation de Chrome DevTools pour débugger un problème de performance
- Test d'un composant et d'un hook React
Jour 3 : Gestion de l'état et écosystème React
Gestion d'état au sein d'une application React
État de l'art sur la gestion d'état (Hooks, Context, State Management Libraries, API Fetching)
Introduction à TanStack Query (Queries et Mutations)
Mises en pratique :
- Récupérer et modifier des données API avec TanStack Query
Bonus & Options
En fonction des besoins, du temps disponible et du profil des participants, les modules ci-dessous peuvent être abordés :
CSS et React
Tailwind CSS
CSS Modules
styled-components
Patterns & Composition
Gestion d'état globale
Zustand
Jotai
MobX/MobX-state-tree
Utilisation d'une librairie de gestion de formulaires
react-hook-form
TanStack Form
Introduction à Next.js (App Router, Server Components)
Class Components (les class components n'étant pas abordés dans cette formation)
Florent est passionné du Web et des technologies qui gravitent autour. Il aime le W3C, le TC39 (quand il ne smoosh pas devant lui), le WhatWG, les frameworks JS (React, Vue.js, Node.js, Angular, ...) et la vanille.
Transmettre sa passion pour l'artisanat web occupe une part importante de son travail de développeur (meetups, formations, conférences, encadrement de stagiaires).
Alain Chautard est un formateur et consultant front-end au parcours résolument international. Développeur full-stack au début de sa carrière, il se spécialise progressivement sur les technos front (Angular, React, JavaScript/TypeScript).
Alain a formé et animé des conférences sur tous les continents (Inde, Afrique du Sud, Australie, Europe, Canada, États-Unis…), auprès de publics très variés : bootcamps de juniors, équipes seniors, reconversions complètes — avec un cas fréquent qu’il maîtrise particulièrement bien : des équipes full-stack qui veulent se spécialiser en front-end.
Sa spécificité : une expertise Angular au plus près de l’écosystème. Google Developer Expert depuis 2017, il reçoit les nouveautés en amont, contribue au feedback produit et participe régulièrement aux échanges avec les équipes Google. Il partage cette veille via une newsletter Angular hebdomadaire et des articles techniques.
En formation, Alain crée un cadre très sécurisant et interactif : beaucoup d’exemples concrets, une place centrale aux questions, et une progression qui “attise la curiosité” pour installer durablement les bonnes pratiques.
Romain est développeur depuis 2018, après une reconversion depuis les espaces verts. Il a forgé son expertise sur le terrain au sein de startups comme Geev, Shadline et Leocare.
Son parcours technique couvre Angular, React, Node.js, TypeScript, Electron et Python. Convaincu que le software craftsmanship doit rester pragmatique, il adapte les pratiques au contexte métier plutôt que d’appliquer des règles rigides.
En tant que formateur, Romain privilégie un format très pratique : 30 % de théorie, 70 % d’ateliers et de code reviews croisées. Il transmet d’abord les fondamentaux avant d’introduire l’IA, afin que ses apprenants développent un regard critique.
Témoignages
4.7/5Basé sur 43 avis*
LD
Lucas D.
JES30.03.2026
Beaucoup de sujets abordés ce qui permet d’avoir une bonne vision globale du fonctionnement et concepts clés.
Cependant j'ai trouvé que certains sujets ont été abordés rapidement. Cela a parfois rendu leur compréhension plus difficile et a limité leur pertinence dans un contexte concret. Mais peut-être aussi n'avais-je pas suffisamment de bonnes bases React pour assimiler comme souhaité ces sujets
FP
Florent P.
JES30.03.2026
bonne formation, adaptée aux besoins
AD
Aurore D.
Hermès Sellier – Hermès Digital Ventes et Services02.06.2025
Une bonne formation qui a servi, le formateur a pris le temps de répondre à toutes les questions et on a eu le temps de voir tous les sujets abordés dans la formation ! Merci Wilfried !
BN
Benjamin N.
Preligens25.11.2024
Pour son premier coup d'essai, Wilfried a été un super formateur ! On a pu mettre de côté les bases déjà acquises par moi et l'autre élève afin de prendre plus de temps pour se concentrer sur les notions réellement avancées. À partir de là, Wilfried a su mettre des travaux pratiques pour chaque notion, nous laissant le temps d'assimiler les nouvelles connaissances. Il a su prendre le temps avec chacun de nous lorsque nous étions bloqués et n'hésitait pas à répondre à nos questions.
ZD
Zakaria D.
FIOULMARKET05.06.2024
Super formateur, très pédagogue.
Mohamed Iheb F.
IVALUA15.01.2024
La formation avec Gabriel sur React + Redux a été très enrichissante. Il nous a aidé à avoir une vision beaucoup plus claire sur les deux technologies. Les exercices pratiques étaient bien adaptés et j'ai bien intégré les concepts. Gabriel a même poussé plus loin avec des concepts avancés, élargissant vraiment notre façon de voir ces technologies. Il est très passionné, et ça se ressent. Une excellente formation, je la recommande !
MB
Marie B.
Marie BAUDLOT
Excellente formation qui permet de comprendre en profondeur les mécanismes de React, pas uniquement comment utiliser tel ou tel hook. Il y a eu de vraies « révélations » pour ma part, qui débloquent une chaîne entière d’incompréhensions et simplifient ensuite le développement. Le support de formation est très bien fait, les schémas aident vraiment à l’assimilation, c’est d’un grand professionnalisme. Un grand merci à Gabriel qui, en plus d’être très sympathique, est vraiment à l’écoute.
MM
Matthieu M.
Méteo France
très bonne formation, un bon niveau javascript ES6+ est requis ainsi que les bases de React
NB
Nicolas B.
Méteo France
C'est une formation intéressante, de qualité et avec un rythme soutenu
JC
Jérémy C.
Hubvisory Source
très bon format à mon sens, super formateur pédagogue et disponible. Seul bémol à mon étant peut être la quantité de concepts abordés proportionnellement au temps qu'on a pour les approfondir.
JL
Jordan L.
Hubvisory Source
Très bonne formation, le formateur a été très pédagogue, j'ai approfondi des notions que je connaissais déjà et découverte d'autres.
YL
Yannick L.
Hubvisory Source
Une formation éclairante sur l'univers React, qui aborde tous les concepts essentiels pour tout développeur utilisant la librairie afin de concevoir des interfaces plus performantes et robustes. Des ouvertures sur d'autres aspects liés (react-query, Testing Library, ViteJS) pour moi cruciaux. Bon ratio théorie/pratique.
Gabriel est pédagogue, patient et répondait à toutes nos questions. C'était réellement un moment d'échange et l'atmosphère était bienveillante et plaisante.
Teddy R.
Hubvisory Source
Grâce à Gabriel et à Human Coders j'ai pu me perfectionner et découvrir de nouvelles façons de travailler avec React et j'ai hâte de pouvoir les appliquer dans les projets sur lesquels je serai impliqué.
AP
Antoine P.
Preligens
Super formation ! J'ai pu approfondir mes connaissances en React et appris de nouveaux concepts que je n'utilisais pas jusqu'ici.
FAQ
Nos formations sont éligibles à plusieurs dispositifs de financement, selon votre situation. Human Coders est certifié Qualiopi, ce qui permet la prise en charge par des organismes comme Pôle emploi, votre OPCO ou encore le CPF (Compte Personnel de Formation) pour certaines formations.
Oui, la formation peut être proposée en présentiel ou en distanciel. Pour les inter-entreprises, les modalités (présentiel ou à distance) sont fonction de la session.
Nous pouvons organiser des sessions à d'autres dates ou dans d'autres villes (Bordeaux, Lille, Lyon, Marseille, Montpellier, Nantes, Nice, Paris, Strasbourg, Toulouse...)
Les formations se déroulent toujours en petit groupe de 3 à 6 stagiaires. Nous souhaitons que les formateurs et formatrices puissent passer un maximum de temps avec chacun·e.
Voici une journée type :
9h : vous êtes accueillis par votre formateur·rice autour d'un petit déjeuner (croissants, pains au chocolat, jus de fruit, thé ou café...)
9h30 : la formation commence
12h30 : pause de midi. Le·a formateur·rice mangera avec vous. C'est l'occasion d'avoir des discussions plus informelles.
14h : reprise de la formation
18h : fin de la journée
8 raisons de participer à une formation Human Coders
Satisfaction client élevée : Un taux de statisfaction de 4,6/5 depuis 2012 (sur 1921 sessions réalisées). 99% des participants se disent satisfaits de nos formations
Approche pédagogique unique : Des formations en petit groupe, des formateurs passionnés et expérimentés, de véritables workshops... (Plus d'infos sur notre manifeste)
Catalogue de formations complet : 271 formations au catalogue, de quoi vous accompagner sur tout vos projets
Écosystème dynamique : Nous accompagnons les dev depuis 14 ans avec des initiatives comme Human Coders News, les Human Talks, le podcast ou encore notre serveur Discord
Financement facilité : Organisme certifié Qualiopi, indispensable pour que vous puissiez obtenir des aides au financement via votre OPCO
Références clients prestigieuses : De nombreux clients qui nous font confiance depuis des années
Accompagnement sur mesure : Nous vous proposons un accompagnement personnalisé par nos consultants pour vous aider dans vos projets au-delà de la formation
Valorisation professionnelle : Remise d'un diplôme, d'une attestation et d'une certification, suivant les formations effectuées, que vous pourrez afficher sur vos CV et réseaux sociaux