Advanced React Patterns
Compound Components, Render Props, HOC, Custom Hooks patterns, Controlled/Uncontrolled, Provider, State Reducer, Props Getters
1Qu'est-ce que le pattern Compound Components ?
Qu'est-ce que le pattern Compound Components ?
Réponse
Le pattern Compound Components permet de créer des composants qui partagent un état implicite via React Context, sans passer de props explicitement. Ce pattern est utilisé dans des bibliothèques comme Radix UI et Headless UI pour offrir une API flexible et composable. Les composants enfants peuvent accéder à l'état partagé automatiquement, permettant une personnalisation de la structure sans perdre la logique commune.
2Quel est le principe du pattern Render Props ?
Quel est le principe du pattern Render Props ?
Réponse
Le pattern Render Props consiste à passer une fonction comme prop qui retourne un élément React, permettant au composant parent de partager sa logique avec le composant enfant. Cette fonction reçoit les données ou méthodes du parent en paramètres. Ce pattern était très populaire avant l'arrivée des hooks, notamment avec des bibliothèques comme React Router et Downshift.
3Que sont les Higher-Order Components (HOC) ?
Que sont les Higher-Order Components (HOC) ?
Réponse
Les Higher-Order Components sont des fonctions qui prennent un composant en paramètre et retournent un nouveau composant enrichi avec des props ou comportements supplémentaires. Ce pattern permet de réutiliser de la logique entre composants sans duplication de code. Les HOC sont utilisés pour des fonctionnalités transversales comme l'authentification, le tracking ou la gestion des permissions.
Quelle est la différence entre un composant contrôlé et non contrôlé ?
Qu'est-ce que le pattern Provider ?
+17 questions d'entretien
Autres sujets d'entretien React / Next.js
Les bases de JavaScript
Fondamentaux React
React Hooks
Cycle de vie des composants
React Router
Gestion d'état avec Context
Formulaires & Composants contrôlés
Fetching de données & API
React Query (TanStack Query)
Styling & CSS-in-JS
Fondamentaux Next.js
TypeScript avec React
Data Fetching Next.js
Server Actions Next.js
Routing & Navigation Next.js
API Routes Next.js
Metadata & SEO Next.js
Middleware & Auth Next.js
Testing React
Zustand State Management
Optimisation Performance React
Error Boundaries & Error Handling
Fonctionnalités avancées Next.js
Déploiement & Production Next.js
Architecture & Design Patterns
React Server Components
Internationalisation Next.js
Sécurité & Best Practices React
Maîtrise React / Next.js pour ton prochain entretien
Accède à toutes les questions, flashcards, tests techniques, exercices de code review et simulateurs d'entretien.
Commencer gratuitement