React et TypeScript Vers des applications web professionnelles

Alexandre COCHET

Bientôt disponible !
Suivez-nous pour être informé dès la sortie

Vous maîtrisez déjà JavaScript et souhaitez progresser vers un développement front-end plus structuré et professionnel ? Cet ouvrage constitue une référence complète pour apprendre à concevoir des applications web modernes en combinant la puissance de React et la fiabilité de TypeScript. Il commence par les principes fondamentaux de React : la composition, la gestion déclarative du DOM et la syntaxe JSX/TSX. Vous y découvrez ensuite l’apport déterminant de TypeScript, grâce à une présentation...

Aperçu de la version papier

Niveau Confirmé à Expert
Parution avril 2026

Présentation

Vous maîtrisez déjà JavaScript et souhaitez progresser vers un développement front-end plus structuré et professionnel ? Cet ouvrage constitue une référence complète pour apprendre à concevoir des applications web modernes en combinant la puissance de React et la fiabilité de TypeScript.

Il commence par les principes fondamentaux de React : la composition, la gestion déclarative du DOM et la syntaxe JSX/TSX. Vous y découvrez ensuite l’apport déterminant de TypeScript, grâce à une présentation approfondie de la création et l’extension de types, ainsi que des types génériques et utilitaires qui permettent de produire un code plus sûr et plus robuste.

La partie consacrée à la construction d’applications détaille la création de composants, la gestion des props, l’affichage conditionnel, les listes génériques et l’intégration du routeur, tout en mettant l’accent sur la composition, pilier de React. Les différentes approches de stylisation sont également expliquées, des méthodes classiques aux solutions CSS-in-JS, accompagnées d’une introduction aux bibliothèques de composants.

Le cœur dynamique de React est ensuite exploré en profondeur : cycle de vie, gestion des états, hooks personnalisés, contextes globaux et communication optimisée avec les API grâce à des outils modernes comme TanStack Query.

Résolument orienté vers l’excellence technique, le livre présente les design patterns essentiels de React (compound components, modèles contrôlés/non contrôlés…), les principes SOLID et les techniques d’optimisation des performances.

Une dernière partie aborde la qualité logicielle avec les tests unitaires (RTL), Storybook, et ouvre sur des sujets clés d’un écosystème professionnel : Next.js, sécurité, internationalisation (i18n) et accessibilité (A11y).

Véritable guide d’expertise, cet ouvrage vous accompagne vers une maîtrise complète des bonnes pratiques du développement React moderne.

Caractéristiques

Reliure spirale - 17 x 21 cm (Médian)
ISBN : 978-2-409-05359-7
EAN : 9782409053597
Ref. ENI : EIMREATYP

Caractéristiques

HTML
ISBN : 978-2-409-05360-3
EAN : 9782409053603
Ref. ENI : LNEIMREATYP

Téléchargements

Des fichiers complémentaires (207 Ko)

Table des matières

Faire connaissance avec React

1. Qu’est-ce que React ?
2. La syntaxe JSX/TSX
3. Création d’un premier projet

Découvrir TypeScript avec React

1. Introduction
2. Qu’est-ce que TypeScript ?
3. Créer ses propres types
1. 3.1 Le fonctionnement des types
2. 3.2 Les interfaces
3. 3.3 Les types
4. 3.4 Les extensions de types
4. Les types génériques
1. 4.1 Le principe de généricité avec le type Array
2. 4.2 Les types utilitaires de TypeScript
  1. 4.2.1 La facultativité
  2. 4.2.2 La sélectivité
  3. 4.2.3 L’immuabilité
  4. 4.2.4 Les types indexés et les dictionnaires
5. La création de types génériques
1. 5.1 Le cas d’utilisation simple
2. 5.2 Les spécificités des types génériques
3. 5.3 Le type any et le type unknown

Créer ses premiers composants

1. La déclaration d’un premier composant
2. Le transfert de données entre composants
1. 2.1 La déclaration des props
2. 2.2 L’utilisation des props
3. 2.3 Les props facultatives et les valeurs par défaut
4. 2.4 L’affichage conditionnel
5. 2.5 L’opérateur de décomposition (spread operator)
3. La gestion des événements
4. La propriété children et les injections de JSX
1. 4.1 Le principe de la propriété children
2. 4.2 Les fonctions utilitaires de React.Children
5. Les listes de composants
1. 5.1 Listes d’éléments HTML
2. 5.2 Listes de composants
3. 5.3 Un composant de liste générique
  1. 5.3.1 L'implémentation d’un composant For
  2. 5.3.2 La composition avec le composant For
6. Le routeur
7. Les composants en classe

Styliser des composants

1. Introduction
2. La stylisation « vanille »
1. 2.1 Le style inline
2. 2.2 Le style conditionnel
3. 2.3 Les feuilles de style
4. 2.4 L’importance de surcharger les éléments HTML
3. Les portals
4. Le CSS-in-JS avec styled-components ou emotion
1. 4.1 La découverte de styled-components
2. 4.2 Le style conditionnel
3. 4.3 Le thème
5. Les bibliothèques de composants
1. 5.1 Les bibliothèques opiniated (opinées)
2. 5.2 Les bibliothèques headless (sans style)
3. 5.3 Le choix de la méthode de stylisation

Gérer le cycle de vie des composants

1. Les hooks et la boucle de rendu en React
2. La gestion des états
1. 2.1 Le hook useState
  1. 2.1.1 Le fonctionnement de useState
  2. 2.1.2 Les mises à jour asynchrones
  3. 2.1.3 L’utilisation de références (objets, tableaux...)
  4. 2.1.4 Les états dans les composants de classe
2. 2.2 Le hook useReducer
3. 2.3 Les signaux
  1. 2.3.1 Le principe des signaux
  2. 2.3.2 Le cycle de vie des signaux
  3. 2.3.3 Les composants spécifiques aux signaux
3. La gestion des références avec useRef
1. 3.1 Qu’est-ce qu’une référence ?
2. 3.2 Les références et les éléments HTML
3. 3.3 Le passage de références entre composants
4. La gestion du cycle de vie avec useEffect
1. 4.1 Le principe de useEffect
2. 4.2 Le hook useEffect sans tableau de dépendances
3. 4.3 Le tableau de dépendances
4. 4.4 Les fonctions et le hook useCallback
5. 4.5 La fonction de cleanup
5. La séparation du code avec des hooks personnalisés
6. Les contextes globaux
1. 6.1 La Context API
2. 6.2 Le fonctionnement de Redux

Communiquer avec des API

1. Les approches pour la récupération de données
1. 1.1 L’approche fetch-on-render
2. 1.2 L’approche fetch-then-render
3. 1.3 L’approche render-as-you-fetch
4. 1.4 Le hook use
2. La gestion d’états automatique avec Tanstack Query
1. 2.1 La query
2. 2.2 Le chargement infini des données
3. 2.3 La mutation
4. 2.4 La mise à jour des données modifiées
5. 2.5 La gestion des formulaires avec React Hook Form
  1. 2.5.1 Le hook useForm
  2. 2.5.2 La vérification avec des schémas

Structurer le code de ses applications

1. Introduction
2. Les design patterns en React
1. 2.1 Les composants d’ordre supérieur (HOC)
2. 2.2 Les compound components
3. 2.3 Les composants controlled/uncontrolled
3. Les principes SOLID en React
1. 3.1 Le S comme Single responsibility
2. 3.2 Le O comme Open/Closed
3. 3.3 Le L comme Liskov substitution
4. 3.4 Le I comme Interface Segregation
5. 3.5 Le D comme Dependency Inversion
4. L’architecture des composants
1. 4.1 La clean architecture en React
2. 4.2 Le design atomique

Optimiser ses applications

1. La mémoïsation
1. 1.1 La mémoïsation avec les hooks useCallback et useMemo
2. 1.2 La mémoïsation des composants avec memo
2. La concurrence
1. 2.1 Le lazy loading
2. 2.2 La transition API

Assurer la qualité du code

1. La visualisation des composants avec Storybook
1. 1.1 Les métadonnées
2. 1.2 Les stories
3. 1.3 Les décorateurs
2. Les tests unitaires avec React Testing Library (RTL)
3. React Developer Tools
1. 3.1 L’onglet Components
2. 3.2 L’onglet Profiler

Aller plus loin

1. Le framework Next.js
1. 1.1 Le routeur avec App Router
2. 1.2 Les composants côté-serveur
3. 1.3 La génération de sites statiques
4. 1.4 Les variables d'environnement
2. La sécurité des applications
3. L’internationalisation (i18n)
1. 3.1 La configuration de l’internationalisation
2. 3.2 L’utilisation des traductions
3. 3.3 Les interpolations
  1. 3.3.1 Les interpolations via le hook useTranslation
  2. 3.3.2 Les interpolations via le composant Trans
4. L’accessibilité (A11y)
1. 4.1 Les rôles et attributs ARIA
2. 4.2 La gestion du focus
Conclusion
Index

Auteur

Alexandre COCHET

Architecte logiciel de formation et ancien assistant pédagogique en programmation bas niveau (C/C++), Alexandre COCHET s’est orienté vers le développement front-end et s’est spécialisé dans la conception d’applications web de haute qualité. Expert de l’architecture logicielle en React et TypeScript, il met dans cet ouvrage son expérience et sa pédagogie au service des développeurs.

Caractéristiques

Caractéristiques

Téléchargements

Alexandre COCHET

Nos nouveautés