Retour

Migrer vers React

Front End Dev

Télécharger le programmeLe programme

Détails

Durée 4 Jours

Prochaines dates

date sur demande

Public cible Dev Frontend, Dev Fullstack

Niveau Intermédiaire

Prix présentiel 3450 € HT/pers

DESCRIPTION

Cette formation couvrira les techniques et les bonnes pratiques pour créer des applications Web modernes en utilisant le framework React et son écosystème (composants, styles, tests).

Que ce soit pour le développement d’un nouvel applicatif ou la migration d’une base de code javascript ou typescript existante.

OBJECTIFS PÉDAGOGIQUES

#1. Comprendre les usages de React (avantages et inconvénients)

#2. Découvrir les cas d’utilisation de l’API React et des conseils de pro

#3. Adopter les bonnes pratiques pour créer des composants bien architecturés

#4. Élaborer une intégration fluide de React à une base de code existante

#5. Isoler les nouveaux composants de la dette technique existante

#6. Utiliser des techniques JS modernes instinctivement

#7. Permettre aux équipes de créer, maintenir et faire évoluer une base de code frontend solide

MÉTHODES D'ENSEIGNEMENTS

Cette formation sera principalement constituée de théorie et d’ateliers techniques qui permettront d’être rapidement opérationnel.

Support : un support de cours en français sera remis aux participants au format électronique via PDF
Évaluation : Les acquis sont évalués tout au long de la formation par le formateur (Questions régulières, travaux pratiques, QCM ou autres méthodes).
Formateur : le tout animé par un consultant-formateur expérimenté, nourri d’une expérience terrain
Satisfaction : à l’issue de la formation, chaque participant répond à un questionnaire d’évaluation qui est ensuite analysé en vue de maintenir et d’améliorer la qualité de nos formations.
Suivi : une feuille d’émargement par demi-journée de présence est signée par chacun des participants.
Format : Cette formation peut être dispensée en format inter-entreprises ou intra-entreprise sur demande et en mode présentiel comme en distanciel.

DURÉE

4 jours (soit 4 x 7 heures) répartis sur 2 semaines, répartis en 2 x 2 jours

PRÉREQUIS

Ordinateur, webcam, microphone, connexion Internet
N’importe quel éditeur de code / IDE (code VS recommandé)
node + npm et git installés

PROGRAMME

JOUR 1 : REACT FUNDAMENTALS

Framework SPA
Flux de données unidirectionnel
Gestion des états
Style fonctionnel vs classes
Hooks (useState, useEffect, useReducer, useRef, useDebugValue, hook personnalisé…)
Architecture des composants (JSX, composition, composants d’ordre supérieur)
Contexte, Suspens & Portal
+ 1h Session de code live: composant d’animation

JOUR 2: STRATÉGIES DE MIGRATION / ADOPTION

Réécriture / Big Bang
Une fonctionnalité à la fois
Pièges de la migration progressive (isoler les styles et mount multiple)
Introduction aux Web components
Encapsuler avec Shadow Dom
Slots, variables CSS et techniques avancées
L’alternative préact
+ 2h de laboratoire: Construction de composants isolés

JOUR 3: CLASSIQUES DU FRONTEND

Styliser des composants
Formulaires avancés
Gestion des événements
Conseils JS modernes (imports, async, spread, immuabilité, formatage …)
+ 3h de lab: Créer un composant simple vs composant intelligent

JOUR 4: EXPÉRIENCE DÉVELOPPEUR

Gestion des dépendances (npm, yarn)
Découverte de l’écosystème (ressources, évaluation de l’impact sur votre bundle)
Outillage (Eslint, Webpack, Babel)
Présentation de Typescript
Tests
+ 1h30 Session de code live: créer, tester et publier un composant
+ 2h Sujet personnalisé libre (les participants peuvent sélectionner n’importe quelle problématique, à la fin du jour 2)

Télécharger le programmeLe programme

Formations sur mesure

Besoin d’une formation adaptée à la taille de vos équipes ? Un mélange de plusieurs formations ? N’hésitez pas à nous contacter, nous trouverons une solution à vos besoins.

Contactez-nous

NOS AUTRES FORMATIONS

Design OpsExpertise

Design Ops : Améliorez l’efficacité et l’autonomie de votre équipe design

Le Design Ops, également connu sous le nom d’opérations de conception, est une pratique qui consiste à appliquer les principes des opérations et de la gestion de projet à la conception d’expériences utilisateur (UX) et d’interfaces utilisateur (UI). Le Design Ops vise à améliorer l’efficacité et l’efficience de la conception en organisant les processus, les outils et les ressources pour mieux répondre aux besoins des utilisateurs et des équipes de conception.

Les équipes de Design Ops sont responsables de la gestion des projets de conception, de la coordination des activités de conception, de l’optimisation des flux de travail, de l’intégration des technologies de conception et de la création d’un environnement propice à la collaboration et à l’innovation.

Le Design Ops est de plus en plus utilisé dans les entreprises de toutes tailles pour améliorer la collaboration, l’efficacité et la qualité de la conception des produits numériques. Ce nouveau rôle est devenu un must-have pour toutes les entreprises qui opèrent leur transformation centrée utilisateur.

Facilitation

Devenir un facilitateur Expert

Les ateliers offrent la possibilité de travailler en profondeur des sujets complexes en équipe à travers des exercices créatifs qui s’appuient notamment sur Design Thinking. Oscillant entre divergence et convergence, l’objectif d’un atelier est de concevoir collectivement une solution à un problème défini dans un temps limité.

Design System

Figma : design & prototypage en Atomic Design

Figma s’est imposé comme l’outil de référence du Product Design. Ses fonctionnalités de collaboration, de design et de prototypage renforcent la productivité des équipes et la qualité des produits.
Cette formation s’adresse aux Designers, Product Managers, Team Leader, Consultants qui souhaitent s’initier à Figma à travers une méthode de conception d’interfaces modulaires et industrialisables.