> Formations > Technologies numériques > Technologies web > Développer avec des frameworks web > Formation Campus Atlas - React JS, développer des applications web
Formation : Campus Atlas - React JS, développer des applications web
Cours pratique - 3j
- 21h00 - Réf. AJB
|
Télécharger le programme
Partager cette formation
 | Comprendre les concepts clés de ReactJS et ses spécificités |
| Créer des composants fonctionnels |
| Maîtriser la syntaxe JSX |
| Utiliser Flux et gérer les bugs |
| Tester son développement |
Public concerné
Développeurs, architectes, chefs de projet.
Prérequis
Avoir des connaissances pratiques du développement web, maîtrise et pratique de JavaScript.
Méthodes et moyens pédagogiques
Méthodes pédagogiques
Pour optimiser le parcours d’apprentissage, des modules e-learning peuvent être fournis avant et après la session présentielle ou la classe virtuelle, sur simple demande du participant.
Modalités d'évaluation
Le formateur évalue la progression pédagogique du participant tout au long de la formation au moyen de QCM, mises en situation, travaux pratiques…
Le participant complète également un test de positionnement en amont et en aval pour valider les compétences acquises.
Programme de la formation
1 JavaScript, apprendre les bases du langage – OPTION digital learning préformation
- Introduction.
- Basique du langage.
- Exécution de scripts.
- Objets JavaScript et callback.
- Manipulation du DOM.
Activités digitales
Cette formation en ligne apprend les bases essentielles de JavaScript, telles que les fonctions, les conditions et les boucles, afin de développer de premières applications en toute autonomie. Les participants mettront leurs connaissances en pratique à travers la création d’une application de gestion de tâches (ToDoList) et seront prêts à aborder des frameworks comme AngularJS ou Node.js.
2 React, fonctionnalités avancées du framework de développement front-end – OPTION digital learning préformation
- Introduction.
- Cycle de vie des composants.
- Refs, fragments et propTypes.
- React Hooks.
Activités digitales
Cette formation en ligne approfondit les connaissances sur React afin d’en exploiter tout le potentiel dans des développements front-end. Après la mise en place de l’environnement, les participants étudieront le cycle de vie des composants, les références, les fragments et les propTypes. Ils découvriront ensuite les Hooks, une fonctionnalité clé qui enrichit les composants fonctionnels. Chaque notion sera illustrée par des démonstrations concrètes.
3 Introduction à React et l’écosystème JavaScript
- Écosystème JavaScript moderne et ses outils.
- Principes fondamentaux de React et son architecture.
- JSX : syntaxe, fonctionnement et bonnes pratiques.
- Virtual DOM et mécanismes de réconciliation.
- Outils de développement React et debugging.
Travaux pratiques
Installer l’environnement, prendre React en main et maîtriser les outils.
4 Composants React fondamentaux
- Architecture et anatomie des composants React.
- Gestion des props et leur validation.
- Patterns de composition de composants.
- Approches de styling modernes.
- Système d’événements React.
Travaux pratiques
Créer des composants, utiliser le styling et les événements, valider en test.
5 État et cycle de vie
- Gestion d’état avec useState.
- Effets et cycle de vie avec useEffect.
- Context API pour l’état global.
- Création de hooks personnalisés.
- Patterns de gestion d’état.
Travaux pratiques
État local et hooks, context et état global et hooks personnalisés.
6 Communication entre composants
- Analyse des patterns de communication.
- Solutions au props drilling.
- Utilisation avancée du context.
- Patterns de composition et render props.
- Gestion des événements complexes.
Travaux pratiques
Patterns de communication, composition avancée, review et optimisation.
7 Gestion avancée de l’état
- Architecture Redux et principes fondamentaux.
- Implémentation des actions et reducers.
- Configuration et utilisation des middlewares.
- Optimisation avec Redux Toolkit.
- Sélecteurs et performances.
Travaux pratiques
Mettre en place Redux, actions et reducers, optimisation et selectors.
8 Routing et navigation
- Concepts fondamentaux de React Router.
- Architecture des routes et navigation.
- Gestion avancée des paramètres.
- Protection et authentification.
- Optimisation du routing.
Travaux pratiques
Configurer le routing, routes protégées, optimiser le routing.
9 Performance et optimisation
- Mémoisation avec React.memo et useMemo.
- Optimisation des callbacks avec useCallback.
- Techniques de code splitting.
- Implémentation du lazy loading.
- Outils de profiling et debugging.
Travaux pratiques
Mémorisation et optimisation, code splitting avancé, profilage et analyse.
10 Test et débogage
- Tests avec Jest et React Testing Library.
- Stratégies de test unitaire et d’intégration.
- Mocking et simulation de données.
- Techniques de débogage avancées.
- Gestion des erreurs avec Error Boundaries.
Travaux pratiques
Tests unitaires, tests d'intégration, débogage et Error Boundaries.
11 React Server Components
- Architecture des server components.
- Différences entre server et client components.
- Implémentation du Streaming SSR.
- Stratégies de data fetching.
- Performance et hydration.
- Intégration avec Next.js.
Travaux pratiques
Architecture RSC, data fetching et streaming, intégration et tests.
12 Intégration API et gestion des données
- Choix et configuration des clients http.
- Architecture React Query.
- Stratégies de cache et invalidation.
- Gestion avancée des erreurs.
- Patterns d’optimistic updates.
Travaux pratiques
Set-up de React Query, patterns avancés, tests et monitoring.
13 Déploiement et CI/CD
- Stratégies de build et optimisation.
- Configuration multi-environnements.
- Mise en place du CI/CD.
- Monitoring et analytics.
- Sécurité et bonnes pratiques.
Travaux pratiques
Configurer le build, pipeline CI/CD et monitoring.
14 Projet final et conclusion
- Synthèse des concepts React avancés.
- Patterns et best practices.
- Architecture et scalabilité.
- Ressources et communauté.
- Évolutions et perspectives.
Travaux pratiques
Présentation des projets, review technique, perspectives et ressources.
15 React, gérer la navigation de son application web avec react-router — OPTION digital learning post-formation
- Introduction.
- Prise en main de react-router.
- Mise en application : réalisation d'un guide de pays.
Activités digitales
Cette formation en ligne d'1h53 apprend à mettre en place un système de navigation côté client avec React grâce à la librairie react-router. Après la configuration de l’environnement, les participants découvriront les composants essentiels pour créer des liens, gérer les redirections et organiser des pages multiples. Ils appliqueront ces notions dans un projet concret en développant la navigation d’une application de consultation de pays via l’API restcountries.eu
PARTICIPANTS
Développeurs, architectes, chefs de projet.
PRÉREQUIS
Avoir des connaissances pratiques du développement web, maîtrise et pratique de JavaScript.
COMPÉTENCES DU FORMATEUR
Les experts qui animent la formation sont des spécialistes des matières abordées. Ils ont été validés par nos équipes pédagogiques tant sur le plan des connaissances métiers que sur celui de la pédagogie, et ce pour chaque cours qu’ils enseignent. Ils ont au minimum cinq à dix années d’expérience dans leur domaine et occupent ou ont occupé des postes à responsabilité en entreprise.
MODALITÉS D’ÉVALUATION
Le formateur évalue la progression pédagogique du participant tout au long de la formation au moyen de QCM, mises en situation, travaux pratiques…
Le participant complète également un test de positionnement en amont et en aval pour valider les compétences acquises.
MODALITÉS ET DÉLAIS D’ACCÈS
L’inscription doit être finalisée 24 heures avant le début de la formation.
ACCESSIBILITÉ AUX PERSONNES HANDICAPÉES
Pour toute question ou besoin relatif à l’accessibilité, vous pouvez joindre notre équipe PSH par e-mail à l’adresse psh-accueil@orsys.fr.
Développeurs, architectes, chefs de projet.
PRÉREQUIS
Avoir des connaissances pratiques du développement web, maîtrise et pratique de JavaScript.
COMPÉTENCES DU FORMATEUR
Les experts qui animent la formation sont des spécialistes des matières abordées. Ils ont été validés par nos équipes pédagogiques tant sur le plan des connaissances métiers que sur celui de la pédagogie, et ce pour chaque cours qu’ils enseignent. Ils ont au minimum cinq à dix années d’expérience dans leur domaine et occupent ou ont occupé des postes à responsabilité en entreprise.
MODALITÉS D’ÉVALUATION
Le formateur évalue la progression pédagogique du participant tout au long de la formation au moyen de QCM, mises en situation, travaux pratiques…
Le participant complète également un test de positionnement en amont et en aval pour valider les compétences acquises.
MOYENS PÉDAGOGIQUES ET TECHNIQUES
• Les moyens pédagogiques et les méthodes d’enseignement utilisés sont principalement : aides audiovisuelles, documentation et support de cours, exercices pratiques d’application et corrigés des exercices pour les formations pratiques, études de cas ou présentation de cas réels pour les séminaires de formation.
• À l’issue de chaque formation ou séminaire, ORSYS fournit aux participants un questionnaire d’évaluation du cours qui est ensuite analysé par nos équipes pédagogiques.
• Une feuille d’émargement par demi-journée de présence est fournie en fin de formation ainsi qu’une attestation de fin de formation si le participant a bien assisté à la totalité de la session.
• Les moyens pédagogiques et les méthodes d’enseignement utilisés sont principalement : aides audiovisuelles, documentation et support de cours, exercices pratiques d’application et corrigés des exercices pour les formations pratiques, études de cas ou présentation de cas réels pour les séminaires de formation.
• À l’issue de chaque formation ou séminaire, ORSYS fournit aux participants un questionnaire d’évaluation du cours qui est ensuite analysé par nos équipes pédagogiques.
• Une feuille d’émargement par demi-journée de présence est fournie en fin de formation ainsi qu’une attestation de fin de formation si le participant a bien assisté à la totalité de la session.
MODALITÉS ET DÉLAIS D’ACCÈS
L’inscription doit être finalisée 24 heures avant le début de la formation.
ACCESSIBILITÉ AUX PERSONNES HANDICAPÉES
Pour toute question ou besoin relatif à l’accessibilité, vous pouvez joindre notre équipe PSH par e-mail à l’adresse psh-accueil@orsys.fr.
Dates et lieux
Dernières places
Date garantie en présentiel ou à distance
Session garantie