Intermédiaire
React
Apprenez React de zéro. Composants, état, hooks, contexte, performance, routage, tests et un projet final.
17 leçons10.2h pratique11 langues
Commencez à apprendre gratuitementReact cours17 leçons, dans l’ordre
- 125 min
Qu'est-ce que React ?
What React isComponents as functionsVirtual DOM intuitionRendering JSXCreating a Vite app - 230 min
JSX et composants
JSX syntax rulesSingle root elementClassName vs classEmbedding expressions with {}Defining componentsComposing components - 330 min
Props
Passing props as attributesReceiving props objectDestructuring props in signatureDefault valuesThinking about prop shapes - 435 min
L'état avec useState
UseState hookReading stateCalling the setterUpdater function formNever mutate stateCounter pattern - 530 min
Gestion des événements
OnClick handlerOnChange basicsPassing functions vs calling themEvent objectPassing handlers as props - 630 min
Rendu conditionnel et listes
&& for show/hideTernary for either/orMapping arrays to JSXThe key propWhy keys need to be stable - 735 min
Formulaires et champs contrôlés
Controlled input patternValue and onChange togetherMulti-field form stateOnSubmit and preventDefaultGathering form data - 840 min
Les effets avec useEffect
What counts as a side effectUseEffect signatureDependency arrayRunning on mount onlyCleanup functionSubscribe/unsubscribe pattern - 935 min
Composition de composants
Children propWrapping componentsPassing JSX as propsLifting state upThinking in component trees - 1035 min
Contexte et useContext
CreateContextContext.ProviderUseContextWhen context is the right toolContext vs prop drilling tradeoffs - 1135 min
useReducer
When to reach for useReducerReducer function shapeAction objectsDispatchCombining useReducer with useContext - 1235 min
Hooks personnalisés
Extracting stateful logic into a functionUse prefix conventionUseToggle exampleUseLocalStorage exampleHooks rules - 1335 min
Performance et mémoïsation
React.memo for componentsUseMemo for expensive computationsUseCallback for stable function referencesWhen memoization is overkillMeasuring before optimizing - 1440 min
Récupération des données
Fetch inside useEffectLoading/error/data statesAbortController cleanupPreventing setState after unmountMention TanStack Query as a next step - 1540 min
Routage avec React Router
Installing react-router-domBrowserRouterRoutes and RouteLink for navigationUseParamsUseNavigate - 1640 min
Tester les composants React
Vitest + React Testing Library setupRender and screenGetByRole queriesUserEvent for interactionsWriting one good button test - 1760 min
Projet final : Application de liste de tâches
Combining state, lists, controlled inputsCustom hook for localStorage persistenceSmall routing setupPutting it together
Apprenez React dans votre langue
Chaque leçon, quiz et réponse du tuteur s’affiche dans votre langue. Le tuteur IA répond dans la langue que vous utilisez.
