React avec TypeScript
Développement FrontendDurée
3 jour(s)Niveau
IntermédiaireRéférence
DE-127
Présentation
Au cours de la dernière décennie, l’évolution rapide du web a stimulé le besoin d’un « JavaScript étendu » enrichissant l’expérience utilisateur avec de nouvelles fonctionnalités tout en simplifiant le développement. TypeScript, React, Angular ou encore Vue.js sont notamment nés de ce besoin.
TypeScript, créé en 2012 par Microsoft, offre un sur-ensemble typé de JavaScript qui facilite la construction d'applications complexes et améliore la qualité du code grâce en partie à son typage statique et son inférence de type. React, créé en 2013 par Meta (ex Facebook), s’est imposé comme un incontournable pour la création d’interfaces utilisateurs réactives, qui s’adaptent aux interactions des personnes ainsi qu’aux changements de données.
Au cours de cette formation, vous plongerez dans les spécificités de TypeScript appliquées à la bibliothèque React pour élaborer des applications robustes et évolutives. Vous apprendrez les fondamentaux de TypeScript pour définir des types statiques, des interfaces, et des génériques pour créer des composants réutilisables et facilement maintenables. En parallèle, vous apprendrez à maîtriser React en construisant des composants, en gérant l'état et les données, et en composant des interfaces dynamiques avec JSX. Cette formation vous permettra non seulement de consolider vos connaissances en JavaScript moderne, mais aussi d’intégrer les avantages de TypeScript et React pour optimiser votre développement et tirer parti des meilleures pratiques pour une expérience de développement améliorée.
Objectifs de la formation
- Découvrir, installer et utiliser React et TypeScript
- Développer sa rigueur de programmation informatique
- Savoir créer des composants React
- Savoir utiliser la State, les props, les styles et les Hooks au sein de React
Public
- Toute personne souhaitant améliorer ses compétences en développement web front-end.
Prérequis
- Une connaissance de JavaScript est nécessaire.
Programme
Introduction à l’environnement React avec TypeScript
Environnement d’exécution, modules et Node
Architecture d’un projet
Concept de rafraîchissement en temps réel
Introduction à TypeScript
Concepts et pertinence de TypeScript
Rappels nécessaires en JavaScript
Intégration et compilation
Syntaxe de base
Les types primitifs en TypeScript
Concepts de types primitifs / référencés
Description des types primitifs
Typages explicite ou par inférence
Les unions et alias de types
Les types référencés en TypeScript
Description des types référencés
Les tuples et enums
Les interfaces
Typage de fonctions
Les génériques en TypeScript
Concepts et cas d’utilisation
Paramètre de généricité
Les génériques dans les interfaces
Introduction à React
Origines et concepts liés à React
Fonctionnalités récentes de JavaScript utilisées avec React
La syntaxe JSX
Le DOM fantôme (Shadow DOM)
Le composant ReactDOM
Les composants React
Objectifs des composants, syntaxe, créer son premier composant
Composants fonctionnels ou composants sous forme de classe ?
Le cycle de vie (lifecycle) et les grappins (hooks) : useEffect, useState, …
La state
Fonctionnalités liées aux composants React
Gestion des styles des composants : imports et styles React
Les props d’un composant
Le contrôle des formulaires
Créer des composants parents
Les contextes
Date de dernière modification : 22/03/2024
Cette formation ne dispose pas d'évaluation pour le moment.
Organisation
Modalités d'évaluation :
Questionnaires à choix multiples (QCM) en fin de formation. L'intervenant formulera également une appréciation sur vos acquis pour l'entièreté de la formation.
Moyens pédagogiques :
Formation alternant la théorie et la pratique, avec un intervenant présentant la formation en direct. Possibilité de réaliser cette formation en face-à-face dans nos locaux, dans vos locaux d'entreprise ou à distance via visioconférence.
Une fois terminée, vous disposerez d'une attestation de suivi de la formation, ainsi que des contenus de cours relatifs au contenu présenté.
Informations pratiques :
En cas de dispense dans nos locaux, le matériel informatique est fourni et l'ensemble des commodités sont accessibles. Nos locaux sont également accessibles aux personnes à mobilité réduite : découvrir notre centre.
Retrouvez toutes les informations pratiques pour préparer votre formation sur notre page dédiée : informations pratiques.
Ces formations pourraient vous intéresser
JavaScript : Design Patterns et orienté prototype
JavaScript est un langage disposant de multiples paradigmes de programmation en son sein. On y retrouve des éléments de programmation fonctionnelle avec l’utilisation massive des fonctions « map », « reduce » …
React : les fondamentaux
Avec l’évolution des usages du web de cette dernière décennie, il s’est développé un fort besoin d’un « JavaScript étendu » pour fournir de nouvelles fonctionnalités aux utilisateurs, dans un langage …