Vous souhaitez discuter avec nous à propos de votre projet de formation ?
Vous voulez plus d'information sur une formation ou notre fonctionnement ?
Rappel Email
Dates
Nous pouvons organiser des sessions à d'autres dates ou dans d'autres villes (Bordeaux, Lille, Lyon, Marseille, Montpellier, Nantes, Nice, Paris, Strasbourg, Toulouse...)
Cette formation React Avancé vous permettra de maîtriser les concepts avancés de React pour développer des applications performantes, testables et évolutives.
Vous apprendrez à optimiser vos composants, déboguer efficacement, et implémenter des stratégies de tests robustes grâce à Jest et React Testing Library et vous explorerez 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.
Enfin, vous découvrirez comment choisir une gestion d’état adaptée (Context API, React Query).
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.
Elle est disponible en TypeScript ou JavaScript.
Vous débutez avec React ?
Notre formation React est faite pour vous !
Enfin, pour découvrir d'autres frameworks front-end, jetez un œil à l'une de nos formations dédiées : Vue.js, Svelte, Angular !
Les objectifs
- Comprendre les concepts avancés de React (Réconciliation, Hooks, Références, Contexts)
- Être capable de tester un composant React avec jest et react-testing-library
- Choisir une gestion d’état adéquate en fonction des situations
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 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
- Rappels sur React
JSXstatepropshooks
- Environnement :
-
Concepts avancés et patterns
- Hooks avancés et fonctionnement interne (modèle mental)
- Introduction aux Contextes React
- Références (
refs)
Mise en pratique :
- Création et utilisation d’un contexte
- Utilisation de useRef pour accéder aux fonctionnalités DOM
Jour 2 : Performance et Tests
-
Performance
- Fonctionnement du mécanisme de réconciliation
- Virtual DOM et implications sur les performances applicatives
- Mémoization des composants, hooks et composants purs
- Splitter son code
- Lazy Loading
- Suspense API
-
Tests
- Stratégie de tests et état de l’art
- enzyme
- react-testing-library
- snapshots
- cypress
- Jest, React-testing-library et mocking
- Introduction à Cypress
- Stratégie de tests et état de l’art
Mise 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
- Test 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 à react-query
- Queries et Mutations
- État de l’art sur la gestion d'état
Mise en pratique :
- Récupérer des données API avec react-query
- Modifier des données API avec react-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
- CSS Modules
- styled-components
- Patterns & Composition
- Utilisation de MobX/MobX-state-tree
- Utilisation d'une librairie de gestion de formulaires
- react-hook-form
- formik
- Introduction à NextJS (JamStack)
- Class Components (les class components n'étant pas abordés dans cette formation)
- Internationalisation avec react-i18next
Le(s) formateur(s)
Gabriel PICHOT
Gabriel accompagne des grands groupes et des start-ups dans l’élaboration et la réalisation de leurs projets digitaux avec des technologies qu’il affectionne particulièrement : ReactJS et TypeScript pour ne citer qu’elles.
Au travers de ses formations, il vous partage l’expérience acquise sur le terrain au gré des différents projets auxquels il a pu contribuer. Il se donne pour objectif de transmettre les bonnes pratiques des outils et technologies discutées afin d’améliorer l’impact du travail de développeur : en bref, vous communiquer un véritable artisanat et savoir-faire.
Florent BERTHELOT
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).
Vive le web, Vive le JS et Vive l'artisanat!
Wilfried BOUKHERS
Wilfried est un développeur passionné spécialisé dans l'écosystème React depuis plus de 8 ans. Co-organisateur des meetups React à Paris, Wilfried se distingue par son approche collaborative et son désir de transmettre ses connaissances aux développeurs juniors.
En tant que formateur, Wilfried a déjà encadré de nombreux développeurs débutants, leur offrant une base solide pour maîtriser React et intégrer rapidement de bonnes pratiques de développement. Il est également très attentif aux besoins des utilisateurs, ce qui lui permet d'apporter une dimension humaine à son approche technique.
Si vous cherchez à apprendre React avec un formateur expérimenté et passionné, capable de rendre les concepts techniques accessibles, Wilfried est le mentor qu’il vous faut !
A propos de Human Coders
Human Coders c'est un centre de formation pour développeurs avec :
- une certification Qualiopi, indispensable pour que vous puissiez obtenir des aides au financement via votre OPCO
- de nombreux clients qui nous font confiance depuis des années
- un manifeste pour garantir des formations à taille humaine, des formateurs passionnés, de véritables workshops...
- 151 formations au catalogue, 1628 sessions depuis nos débuts en 2012 avec une moyenne de satisfaction de 4,6/5
- la possibilité de vous proposer un accompagnement personnalisé ou du conseil après la formation
11 témoignages
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 afi...
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.
Voir plus
Benjamin NABET - Safran.AI - 25.11.2024
Super formateur, très pédagogue.
Super formateur, très pédagogue.
Zakaria DJELLALI - FIOULMARKET - 05.06.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 tech...
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 !
Voir plus
Mohamed Iheb Faiza - IVALUA - 15.01.2024
Excellente formation qui permet de comprendre en profondeur les mécanismes de React, pas uniquement comment utiliser tel ou tel hook. Il y a e...
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.
Voir plus
Marie BAUDLOT - Marie BAUDLOT
très bonne formation, un bon niveau javascript ES6+ est requis ainsi que les bases de React
très bonne formation, un bon niveau javascript ES6+ est requis ainsi que les bases de React
Matthieu Marrast - Méteo France
C'est une formation intéressante, de qualité et avec un rythme soutenu
C'est une formation intéressante, de qualité et avec un rythme soutenu
Nicolas Broders - Méteo France
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 proporti...
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.
Voir plus
Jérémy Carol - 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.
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.
Jordan La Mantia - Hubvisory Source
Une formation éclairante sur l'univers React, qui aborde tous les concepts essentiels pour tout développeur utilisant la librairie afin de con...
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.
Voir plus
Yannick Lacroix - 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 l...
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é.
Voir plus
Teddy Rogers - Hubvisory Source
Super formation ! J'ai pu approfondir mes connaissances en React et appris de nouveaux concepts que je n'utilisais pas jusqu'ici.
Super formation ! J'ai pu approfondir mes connaissances en React et appris de nouveaux concepts que je n'utilisais pas jusqu'ici.
Antoine POIVEY - Preligens
Besoin d'aide ?
Nos forces
- Des formations à taille humaine
- Des formateurs passionnés
- Des véritables workshop
Nos clients
Cette formation React Avancé vous permettra de maîtriser les concepts avancés de React pour développer des applications performantes, testables et évolutives.
Vous apprendrez à optimiser vos composants, déboguer efficacement, et implémenter des stratégies de tests robustes grâce à Jest et React Testing Library et vous explorerez 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.
Enfin, vous découvrirez comment choisir une gestion d’état adaptée (Context API, React Query).
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.
Elle est disponible en TypeScript ou JavaScript.
Vous débutez avec React ?
Notre formation React est faite pour vous !
Enfin, pour découvrir d'autres frameworks front-end, jetez un œil à l'une de nos formations dédiées : Vue.js, Svelte, Angular !
Les objectifs
- Comprendre les concepts avancés de React (Réconciliation, Hooks, Références, Contexts)
- Être capable de tester un composant React avec jest et react-testing-library
- Choisir une gestion d’état adéquate en fonction des situations
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 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
- Rappels sur React
JSXstatepropshooks
- Environnement :
-
Concepts avancés et patterns
- Hooks avancés et fonctionnement interne (modèle mental)
- Introduction aux Contextes React
- Références (
refs)
Mise en pratique :
- Création et utilisation d’un contexte
- Utilisation de useRef pour accéder aux fonctionnalités DOM
Jour 2 : Performance et Tests
-
Performance
- Fonctionnement du mécanisme de réconciliation
- Virtual DOM et implications sur les performances applicatives
- Mémoization des composants, hooks et composants purs
- Splitter son code
- Lazy Loading
- Suspense API
-
Tests
- Stratégie de tests et état de l’art
- enzyme
- react-testing-library
- snapshots
- cypress
- Jest, React-testing-library et mocking
- Introduction à Cypress
- Stratégie de tests et état de l’art
Mise 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
- Test 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 à react-query
- Queries et Mutations
- État de l’art sur la gestion d'état
Mise en pratique :
- Récupérer des données API avec react-query
- Modifier des données API avec react-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
- CSS Modules
- styled-components
- Patterns & Composition
- Utilisation de MobX/MobX-state-tree
- Utilisation d'une librairie de gestion de formulaires
- react-hook-form
- formik
- Introduction à NextJS (JamStack)
- Class Components (les class components n'étant pas abordés dans cette formation)
- Internationalisation avec react-i18next
Le(s) formateur(s)
Gabriel PICHOT
Gabriel accompagne des grands groupes et des start-ups dans l’élaboration et la réalisation de leurs projets digitaux avec des technologies qu’il affectionne particulièrement : ReactJS et TypeScript pour ne citer qu’elles.
Au travers de ses formations, il vous partage l’expérience acquise sur le terrain au gré des différents projets auxquels il a pu contribuer. Il se donne pour objectif de transmettre les bonnes pratiques des outils et technologies discutées afin d’améliorer l’impact du travail de développeur : en bref, vous communiquer un véritable artisanat et savoir-faire.
Florent BERTHELOT
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).
Vive le web, Vive le JS et Vive l'artisanat!
Wilfried BOUKHERS
Wilfried est un développeur passionné spécialisé dans l'écosystème React depuis plus de 8 ans. Co-organisateur des meetups React à Paris, Wilfried se distingue par son approche collaborative et son désir de transmettre ses connaissances aux développeurs juniors.
En tant que formateur, Wilfried a déjà encadré de nombreux développeurs débutants, leur offrant une base solide pour maîtriser React et intégrer rapidement de bonnes pratiques de développement. Il est également très attentif aux besoins des utilisateurs, ce qui lui permet d'apporter une dimension humaine à son approche technique.
Si vous cherchez à apprendre React avec un formateur expérimenté et passionné, capable de rendre les concepts techniques accessibles, Wilfried est le mentor qu’il vous faut !
A propos de Human Coders
Human Coders c'est un centre de formation pour développeurs avec :
- une certification Qualiopi, indispensable pour que vous puissiez obtenir des aides au financement via votre OPCO
- de nombreux clients qui nous font confiance depuis des années
- un manifeste pour garantir des formations à taille humaine, des formateurs passionnés, de véritables workshops...
- 151 formations au catalogue, 1628 sessions depuis nos débuts en 2012 avec une moyenne de satisfaction de 4,6/5
- la possibilité de vous proposer un accompagnement personnalisé ou du conseil après la formation
11 témoignages
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 afi...
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.
Voir plus
Benjamin NABET - Safran.AI - 25.11.2024
Super formateur, très pédagogue.
Super formateur, très pédagogue.
Zakaria DJELLALI - FIOULMARKET - 05.06.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 tech...
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 !
Voir plus
Mohamed Iheb Faiza - IVALUA - 15.01.2024
Excellente formation qui permet de comprendre en profondeur les mécanismes de React, pas uniquement comment utiliser tel ou tel hook. Il y a e...
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.
Voir plus
Marie BAUDLOT - Marie BAUDLOT
très bonne formation, un bon niveau javascript ES6+ est requis ainsi que les bases de React
très bonne formation, un bon niveau javascript ES6+ est requis ainsi que les bases de React
Matthieu Marrast - Méteo France
C'est une formation intéressante, de qualité et avec un rythme soutenu
C'est une formation intéressante, de qualité et avec un rythme soutenu
Nicolas Broders - Méteo France
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 proporti...
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.
Voir plus
Jérémy Carol - 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.
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.
Jordan La Mantia - Hubvisory Source
Une formation éclairante sur l'univers React, qui aborde tous les concepts essentiels pour tout développeur utilisant la librairie afin de con...
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.
Voir plus
Yannick Lacroix - 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 l...
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é.
Voir plus
Teddy Rogers - Hubvisory Source
Super formation ! J'ai pu approfondir mes connaissances en React et appris de nouveaux concepts que je n'utilisais pas jusqu'ici.
Super formation ! J'ai pu approfondir mes connaissances en React et appris de nouveaux concepts que je n'utilisais pas jusqu'ici.
Antoine POIVEY - Preligens
Nos clients
* Nombre de personnes ayant répondu au questionnaire de satisfaction sur cette formation depuis 2012