Cours JavaScript et React en ligne
Le cours en ligne JavaScript et React sur CodeWorlds compte 16 modules de courtes leçons avec un éditeur de code et 1069 exercices pratiques, racontés comme une aventure. Tu peux lire les leçons gratuitement sur ce site.
En apprenant JavaScript, React.js et Redux, nous partons en mission spatiale. Explore l'espace en tant que membre d'une équipe d'astronautes.
Ton guide
Ra
Guide spatial
Ce que tu apprendras
- Composants fonctionnels et de classe React
- Hooks React - useState, useEffect, useContext
- Gestion de l'état avec Redux Toolkit
- React Router - routage et navigation
- Stylisation avec CSS Modules et Styled Components
- Fetch API et Axios pour la communication avec le backend
- Tests avec Jest et React Testing Library
- Optimisation avec React.memo et useMemo
Projets principaux
Au cours de la formation, tu construiras de vrais projets que tu pourras ajouter à ton portfolio
Panneau de contrôle de mission
Tableau de bord de contrôle de mission avec mises à jour en temps réel et graphiques
Système de gestion de l'équipage
Application CRUD de gestion d'équipage avec authentification
Explorateur spatial
Application d'exploration de l'espace avec l'API NASA
Programme du cours
16 modules remplis d'exercices interactifs et de projets pratiques
Début de la mission
Bases de React
Ce qu'est React, Virtual DOM, Node.js et npm, projet Vite, structure de l'app, premier composant, JSX et React DevTools
65 exercices
Base lunaire
Composants et props
Anatomie d'un composant, props et children, composition, rendu conditionnel et de listes, composants contrôlés ou non
65 exercices
Atterrissage sur Mars
État et événements
État du composant, gestion et propagation des événements, flux de données, mises à jour de l'état et formulaires contrôlés
51 exercices
Centre de commandement
Context API et useReducer
Context API, reducers et useReducer, état global de l'application, optimisation du contexte et patterns de gestion d'état
70 exercices
Problèmes de connectivité
useEffect et hooks personnalisés
Cycle de vie et effets, données d'API, nettoyage des effets, useRef, hooks personnalisés, race conditions, debouncing et mémoïsation
87 exercices
- Cycle de vie et effets
- Synchronisation avec des systèmes externes
- Gestion des API et récupération de données
- Nettoyer les effets
Toutes les leçons (11)
- Les références avec useRef
- Optimisation des performances avec useEffect
- Hooks personnalisés pour les effets
- Effets avancés - Race conditions et debouncing
- Mémoïsation - React.memo, useMemo et useCallback
- Révision : Le hook useRef - Références et valeurs entre les rendus
- Révision : Hooks personnalisés avancés - Modèles et composition
Voyage vers l'Orbiter
React Router
Configuration des routes, paramètres d'URL, routes imbriquées, navigation programmatique, routes protégées, redirections et lazy loading
74 exercices
- React Router - La navigation cosmique
- Configuration du routage dans les applications spatiales
- Les paramètres d'URL dans la navigation cosmique
- Les chemins imbriqués dans la navigation intergalactique
Toutes les leçons (11)
- La navigation programmatique dans les voyages spatiaux
- Sécuriser les chemins dans la station spatiale
- Les redirections dans la navigation cosmique
- Le chargement différé des composants lors d'un voyage spatial
- Passer un état à travers les emplacements
- La gestion de l'historique du navigateur lors d'un voyage spatial
- Architecture de routage complète - Le centre de commandement de navigation
Stylisation du vaisseau
Styles et animations
Styled Components, Sass, Tailwind CSS, bibliothèques de composants UI, design system maison, React Transition Group et animations CSS
67 exercices
Systèmes avancés
Patterns React avancés
HOC, render props, compound components, Suspense, code splitting, accessibilité, profilage des performances et déploiement sur Vercel
64 exercices
Noyau galactique
Hooks React modernes
useTransition, useDeferredValue, useOptimistic, useActionState, useFormStatus, useId, le hook use et virtualisation de listes
62 exercices
Voyage vers l'inconnu
Écosystème et avenir de React
Portails, i18n, sécurité, GraphQL avec Apollo, WebSockets, Web Workers, React Compiler, Server Components et TanStack Query
86 exercices
- Les portails React
- React-i18next - L'internationalisation dans React
- Pratiques de sécurité complètes dans React
- Apollo Client - Intégration complète de GraphQL avec React
Toutes les leçons (14)
- WebSockets et Server-Sent Events dans React
- Les Web Workers dans React
- Le compilateur React (React Forget)
- SSR en streaming et Edge Runtime
- Les React Server Components (RSC) - L'avenir de React
- Les micro-frontends avec React - Architecture évolutive
- React Query / TanStack Query - Gestion de l'état serveur
- React 19 - ref sans forwardRef
- React 19.2 - Le pré-rendu partiel (PPR)
- Projet principal : Centre de commandement des missions spatiales
Communication avec la base de données
Récupération de données et API
Fetch et Axios, états de chargement et d'erreur, AbortController, envoi de données, cache et stale-while-revalidate, pagination
63 exercices
Cartes stellaires
React et TypeScript
Typage des composants, props, useState et useRef, événements, Context API et useReducer, composants génériques et unions discriminées
63 exercices
Contrôle qualité
Tester React
Jest et React Testing Library, tests des interactions et composants asynchrones, mocks de modules et d'API, hooks et snapshots
63 exercices
Couleurs de la flotte
Styles avancés
Variables CSS et thèmes, CSS Modules, CSS-in-JS sans runtime, theming avec styled-components, Emotion, design tokens et responsive
63 exercices
Station orbitale
Patterns et architecture
Composition, container/presentational, headless components, inversion de contrôle, feature flags, atomic design et machines à états
63 exercices
Atterrissage d'urgence
Gestion des erreurs et Suspense
Error boundaries, react-error-boundary, erreurs de formulaire, logs et monitoring, fallback UI, skeletons et interfaces résilientes
63 exercices
Thème du cours
Vaisseaux spatiaux et Galaxies
Chaque module est ancré dans un univers unique qui transforme l'apprentissage en aventure.
Ton guide
Ra
Guide spatial
Il te guidera à travers tous les défis et t'aidera à acquérir de nouvelles compétences.
Questions fréquentes sur le cours JavaScript et React
Le cours JavaScript et React est-il gratuit ?
En partie. Tu peux lire gratuitement les leçons du cours JavaScript et React sur ce site. Les tâches du cours dans l'application nécessitent un plan premium ; avec un compte gratuit, tu peux suivre dans l'application le cours HTML et CSS avec 10 unités de carburant par jour.
Combien de temps dure le cours JavaScript et React ?
La durée d'apprentissage estimée du cours JavaScript et React est de 80-120 heures. Le cours compte 16 modules et plus de 1069 tâches, et c'est toi qui choisis le rythme.
Ai-je besoin d'une expérience préalable pour le cours JavaScript et React ?
Avant le cours JavaScript et React, il est utile d'avoir : Bases du HTML et du CSS, Bases du JavaScript, Monde 1 ou connaissances équivalentes.
Qu'est-ce que je vais apprendre dans le cours JavaScript et React ?
Dans le cours JavaScript et React, tu apprendras entre autres : Composants fonctionnels et de classe React, Hooks React - useState, useEffect, useContext, Gestion de l'état avec Redux Toolkit, React Router - routage et navigation.
Comment se passe l'apprentissage sur CodeWorlds ?
Sur CodeWorlds, chaque module est une série de courtes leçons avec un éditeur de code en direct, des quiz et des tâches pratiques. Ta progression te rapporte de l'XP et débloque de nouveaux lieux du monde Mission spatiale.
Commence à apprendre JavaScript dès aujourd'hui
Rejoins CodeWorlds et découvre des méthodes d'apprentissage modernes qui rendent la programmation fascinante et accessible à tous.