

Incertain où
commencer?
Track
Certificat
Devenez Développeur React
4.8+
★★★★★
★★★★★
5 avis
Intermediate
Maîtrisez l'art de créer des interfaces utilisateur dynamiques et interactives pour les applications web en tant que développeur React qualifié. Si vous comprenez bien JavaScript, vous concentrer sur la maîtrise de React est un choix judicieux. Afficher plus
React
Boost your Tech Skills!
with up to 55% off
What you'll get with our subscription:
Access to 85+ top-rated courses
AI-driven Learning
Workspaces for practicing your skills
Personalized study tracks
Certificates of completion
Training 2 or more people?
Get your team access to Codefinity courses anytime, anywhere.
Try Codefinity TeamsWhat you will learn
- Build modern web applications using React, including components, props, and state management
- Navigate between pages seamlessly with React Router and implement dynamic routing
- Manage global state efficiently using Redux Toolkit for scalable applications
- Develop full-stack applications with Next.js 14, including server-side rendering and API routes
- Explore the basics of React Native to build cross-platform mobile applications
- 171 chapters
- 27 hours
- 119 tasks
Trusted by employees of leading companies
Learning track content
Module 1 / Maîtrise de React
Acquérez une compréhension des principes fondamentaux de React. Vous apprendrez à propos de JSX (JavaScript XML), à construire des composants d'interface utilisateur réutilisables et à rendre des éléments. De plus, vous explorerez l'importance de la collecte de données et du rendu conditionnel dans les applications React. À la fin de cette section, vous aurez une base solide des concepts essentiels de React, vous préparant au succès dans les sujets plus avancés abordés dans les sections suivantes.
- Qu'est-ce Que React?Preview
- SPAs vs. MPAs dans le Développement WebPreview
- Comment React Fonctionne Avec le DOM VirtuelPreview
- Introduction à JSX dans ReactPreview
- Créer des Éléments JSX ComplexesPreview
- Rendu des Éléments dans ReactPreview
- Défi : Rendu d'ÉlémentPreview
- Composant ReactPreview
- Props dans ReactPreview
- Défi : Composants FonctionnelsPreview
- Rendu ConditionnelPreview
- Défi : Rendu Conditionnel - Notification de ChatPreview
- Défi : Rendu Conditionnel - Alerte BancairePreview
- Rendu d'une Collection de DonnéesPreview
- Défi : Rendre une Collection de DonnéesPreview
- Récapitulatif de la Section Introduction à ReactPreview
Explorez les différentes méthodes pour ajouter des styles aux applications React. Vous apprendrez à appliquer des styles à des composants individuels, à utiliser des styles dynamiques et à maintenir une approche de stylisation évolutive et facile à maintenir dans vos projets.
- Introduction à la Stylisation dans ReactPreview
- Styles en LignePreview
- Styles en Ligne en PratiquePreview
- Défi : Styles en LignePreview
- Styliser avec le Fichier CSSPreview
- Styliser avec le Fichier CSS en PratiquePreview
- Défi : Styliser Avec le Fichier CSSPreview
- Stylisation Avec Les Modules CSSPreview
- Organisation de la Structure des DossiersPreview
- Défi : Modules CSSPreview
- Résumé de la Section sur le Style dans ReactPreview
Fonctionnalités puissantes dans le développement moderne de React. Les hooks révolutionnent la manière dont nous écrivons des composants fonctionnels, offrant une méthode concise et intuitive pour gérer l'état et effectuer des effets secondaires. À l'inverse, le contexte nous permet de partager des données à travers l'arborescence des composants sans avoir à passer par les props. La combinaison des hooks et du contexte permet une gestion efficace de l'état et un partage simplifié des données dans les applications React.
- Introduction : Hooks et Contexte ReactPreview
- Hook useStatePreview
- Défi : Basculer la VisibilitéPreview
- Hook useRefPreview
- Défi : Créer un Composant de FormulairePreview
- Hook useEffectPreview
- Défi : Récupération et Affichage des DonnéesPreview
- Hook useMemoPreview
- Défi : Filtrage de la Liste de VoituresPreview
- ContextePreview
- Contexte en PratiquePreview
- Défi : Application du Monde de l'AstronomiePreview
- Résumé de la Section sur les Hooks et le Contexte de ReactPreview
Guide étape par étape sur la façon de démarrer un projet React dans le monde réel. De la configuration de votre environnement de développement à la compréhension de l'organisation du projet et des outils essentiels, vous acquerrez les connaissances et la confiance nécessaires pour vous lancer dans votre aventure React.
Module 2 / React Router
Apprenez les bases théoriques de concepts tels que l'URL, le domaine, le protocole, les paramètres de requête, et plus encore. Comprenez l'importance du routage dans les applications web et pourquoi nous avons besoin de la bibliothèque React Router.
Découvrez comment créer une application React complète à partir de zéro, avec la capacité d'afficher du contenu qui s'adapte en fonction de l'URL en utilisant la fonctionnalité de React Router.
- AperçuPreview
- Installation de React RouterPreview
- Activation de la Fonctionnalité de RoutagePreview
- Définir les RoutesPreview
- Récapitulatif des Premières ÉtapesPreview
- Importation de Composants avec Chargement ParesseuxPreview
- Implémentation d'un Composant de SecoursPreview
- Récapitulatif des Deuxièmes ÉtapesPreview
- Créer une NavigationPreview
- Exploration de la Logique Complète de React RouterPreview
- Résumé des Bases de React RouterPreview
Explorez l'utilisation des chaînes de requête pour partager et gérer l'état de l'application via les URL, travaillez avec différents types de données dans les paramètres de requête, et utilisez React Router pour la navigation et les effets basés sur les changements d'URL.
Module 3 / Redux Toolkit & React
Explorez les concepts fondamentaux de la gestion d'état et découvrez comment exploiter la puissance du Redux Toolkit. Nous vous guiderons à travers le processus d'installation et vous aiderons à créer votre premier projet React Redux Toolkit. De plus, relevez un défi pour tester votre compréhension et vos compétences.
Explorez l'intégration de Redux avec les applications React, en couvrant les concepts de base : actions, reducers et le store Redux. Comprend des exemples pratiques et des explications de code pour configurer un store, créer des reducers et connecter des composants React via des hooks comme useSelector et useDispatch.
- Ce Qui Vous AttendPreview
- Code Initial du Projet et Structure des FichiersPreview
- Création du Store ReduxPreview
- Intégration du Store Redux dans l'ApplicationPreview
- Inspection du Store dans l'ApplicationPreview
- Actions et Créateurs d'ActionsPreview
- Rôle des RéducteursPreview
- Inspection des Actions et des RéducteursPreview
- Connexion de Redux et ReactPreview
- Compléter le Code de l'ApplicationPreview
Boostez vos compétences en gestion d'état. Dans cet atelier pratique, vous relevez des défis du monde réel et acquérez une expérience pratique en utilisant le Redux Toolkit pour un développement d'application fluide.
Module 4 / Next.js 14
Discutons de ce que vous devez apprendre avant de plonger dans le framework Next.js, de ce à quoi vous pouvez vous attendre de ce cours, et de ce que vous allez construire.
Nous allons configurer le projet, examiner les moyens d'ajouter du style à notre application et couvrir les aspects visuels tels que les images, les polices, les pages et les mises en page.
- Configuration du ProjetPreview
- Structure des Fichiers-Dossiers du ProjetPreview
- Approches de StylePreview
- Ajouter le Fichier CSS GlobalPreview
- Stylisation TailwindPreview
- Modules CSSPreview
- Appliquer des Styles ConditionnellementPreview
- Polices Google PersonnaliséesPreview
- Défi : Ajouter une Police Google PersonnaliséePreview
- ImagesPreview
Apprenez à créer et gérer facilement une nouvelle vue pour votre application et à naviguer sans effort à travers toutes les pages grâce à un système de routage intégré.
Déployez l'application Next.js en utilisant des comptes GitHub et Vercel. De plus, établissez une base de données pour fournir à l'application les données nécessaires.
Considérez comment obtenir et afficher les données à l'utilisateur de manière claire et efficace.
- Comment Récupérer des DonnéesPreview
- Travailler Avec la Page du Tableau de BordPreview
- Pratique et Défi : Récupération de DonnéesPreview
- Rendu Dynamique vs StatiquePreview
- ChargeursPreview
- Chargeurs de Parties SpécifiquesPreview
- Défi : Chargeur de SquelettePreview
- Regroupement des Composants pour les ChargeursPreview
Découvrez comment implémenter des fonctionnalités web modernes telles que la pagination, les opérations CRUD, la recherche globale, la validation de formulaire, et plus encore.
Mise en œuvre de l'authentification dans Next.js.
- Comprendre l'AuthentificationPreview
- Route de ConnexionPreview
- NextAuth.jsPreview
- Configuration d'Authentification et Protection des RoutesPreview
- Hachage de Mot de Passe et IdentifiantsPreview
- Fonctionnalité de ConnexionPreview
- Connexion de l'Interface Utilisateur et des FonctionnalitésPreview
- Fonctionnalité de DéconnexionPreview
- Et Après?Preview
Module 5 / Fondations de React Native
L'introduction complète à React Native décrit les prérequis et les objectifs du cours et offre des conseils sur les pratiques d'apprentissage efficaces. Comprenez ce à quoi vous attendre du cours et comment aborder efficacement le parcours d'apprentissage.
Explorez les concepts fondamentaux de React Native, de la configuration de l'environnement de développement à la compréhension des composants React Native. Acquérez une expérience pratique en construisant une application simple et en posant les bases pour des projets plus complexes.
- Configuration du ProjetPreview
- Composants React NativePreview
- Composants de Vue et de TextePreview
- Composant ImagePreview
- StylisationPreview
- Défi : Ajout de StylesPreview
- Composant TouchableOpacityPreview
- Composant ScrollViewPreview
- Rendu des Listes de DonnéesPreview
- Défi : Liste de Stations InteractivePreview
- QuizPreview
Apprenez la gestion efficace des états dynamiques, des props, de la navigation et des hooks pour créer des applications React Native soignées.
Explorez les aspects avancés du développement React Native, en couvrant des sujets cruciaux tels que la gestion des entrées, la barre d'état, les ActivityIndicators, et plus encore. Plongez profondément dans des techniques pratiques pour construire des applications mobiles sophistiquées.
Requirements
- A computer with a browser - all browsers are supported.
- Your enthusiasm to enhance your tech skills.
- Everything else needed to start learning and practicing is already included in this course.
Over 200,000 5-star ratings and counting
Ruslan Kravchuk
L'essentiel est d'apprendre et de ne pas abandonner
Le matériel est bon, il y a beaucoup à apprendre, tout cela pour s'améliorer, et l'essentiel est d'apprendre ce que vous souhaitez....
Matteo Comune
Grâce à eux, j'apprends énormément…
Grâce à eux, j'apprends beaucoup plus rapidement car ils vous aident à tout comprendre depuis le début. C'est le meilleur site web pour aider les personnes sans connaissances préalables en informatique...
Yuliana Cadavid
super cours pour débutants
super cours pour débutants, ils testent vos connaissances à chaque leçon...
Elpunzon
Je profite pleinement de mon expérience Codefinity…
Je profite pleinement de mon expérience Codefinity en apprenant Python. L'apprentissage à votre rythme est idéal car il s'adapte à votre emploi du temps...
Alexandru Alexandru
C'est agréable d'apprendre avec Codefinity
C'est agréable d'apprendre avec Codefinity. C'est facile et il y a de bons exemples de ce que j'ai appris ici...
jacob Templet
Easy to follow along with and provides…
Facile à suivre et apporte un défi dans mon quotidien. Ce défi me motive à apprendre chaque jour...
Elan
Codefinity est un outil d'apprentissage complet…
Codefinity est un outil d'apprentissage complet qui vous aide à développer vos compétences en tant qu'ingénieur logiciel ou data scientist. Les exercices sont amusants et constituent un excellent moyen d'affiner vos compétences...
Thibault
Première fois que j'apprends à coder
Première fois que j'apprends à coder et je réussis grâce à Codefinity - merci...
Adrien Morel
Parfaitement conçu pour les débutants complets
Parfaitement conçu pour les débutants complets, le progrès pas à pas me donne confiance....
_Gracy
c'est tout simplement parfaitement bien expliqué
C'est tout simplement parfaitement bien expliqué ! Jusqu'à présent, je n'ai rencontré aucune difficulté car tout est si bien organisé...
Ruslan Kravchuk
L'essentiel est d'apprendre et de ne pas abandonner
Le matériel est bon, il y a beaucoup à apprendre, tout cela pour s'améliorer, et l'essentiel est d'apprendre ce que vous souhaitez....
Matteo Comune
Grâce à eux, j'apprends énormément…
Grâce à eux, j'apprends beaucoup plus rapidement car ils vous aident à tout comprendre depuis le début. C'est le meilleur site web pour aider les personnes sans connaissances préalables en informatique...
Yuliana Cadavid
super cours pour débutants
super cours pour débutants, ils testent vos connaissances à chaque leçon...
Elpunzon
Je profite pleinement de mon expérience Codefinity…
Je profite pleinement de mon expérience Codefinity en apprenant Python. L'apprentissage à votre rythme est idéal car il s'adapte à votre emploi du temps...
Alexandru Alexandru
C'est agréable d'apprendre avec Codefinity
C'est agréable d'apprendre avec Codefinity. C'est facile et il y a de bons exemples de ce que j'ai appris ici...
jacob Templet
Easy to follow along with and provides…
Facile à suivre et apporte un défi dans mon quotidien. Ce défi me motive à apprendre chaque jour...
Elan
Codefinity est un outil d'apprentissage complet…
Codefinity est un outil d'apprentissage complet qui vous aide à développer vos compétences en tant qu'ingénieur logiciel ou data scientist. Les exercices sont amusants et constituent un excellent moyen d'affiner vos compétences...
Thibault
Première fois que j'apprends à coder
Première fois que j'apprends à coder et je réussis grâce à Codefinity - merci...
Adrien Morel
Parfaitement conçu pour les débutants complets
Parfaitement conçu pour les débutants complets, le progrès pas à pas me donne confiance....
_Gracy
c'est tout simplement parfaitement bien expliqué
C'est tout simplement parfaitement bien expliqué ! Jusqu'à présent, je n'ai rencontré aucune difficulté car tout est si bien organisé...
Data Engineer
Certificat de Réalisation
Montrez vos compétences nouvellement acquises. Vous l'avez mérité
Discover more
Learning tracks
Seulement pour Ultimate
1 Cours
1 Projet
0 Task
Seulement pour Ultimate
7 Cours
326 Tâches
Seulement pour Ultimate
5 Cours
150 Tâches
Seulement pour Ultimate
4 Cours
115 Tâches
Seulement pour Ultimate
6 Cours
101 Tâches
Seulement pour Ultimate
6 Cours
169 Tâches
Seulement pour Ultimate
5 Cours
132 Tâches
Seulement pour Ultimate
2 Cours
1 Projet
57 Tâches
Seulement pour Ultimate
6 Cours
307 Tâches
Seulement pour Ultimate
4 Cours
143 Tâches
Seulement pour Ultimate
5 Cours
170 Tâches
Seulement pour Ultimate
5 Cours
155 Tâches
Seulement pour Ultimate
6 Cours
286 Tâches
Seulement pour Ultimate
6 Cours
226 Tâches
Seulement pour Ultimate
8 Cours
2 Projets
176 Tâches
Seulement pour Ultimate
2 Cours
77 Tâches
Seulement pour Ultimate
7 Cours
293 Tâches
Seulement pour Ultimate
1 Projet
0 Task
Seulement pour Ultimate
2 Cours
21 Tâches
Seulement pour Ultimate
5 Cours
112 Tâches
Seulement pour Ultimate
2 Cours
0 Task
Seulement pour Ultimate
3 Cours
39 Tâches
Seulement pour Ultimate
13 Cours
543 Tâches
Seulement pour Ultimate
13 Cours
543 Tâches
Seulement pour Ultimate
1 Cours
0 Task
Seulement pour Ultimate
0 Task
Seulement pour Ultimate
5 Cours
143 Tâches
Seulement pour Ultimate
3 Cours
79 Tâches
Seulement pour Ultimate
7 Cours
272 Tâches
Seulement pour Ultimate
5 Cours
217 Tâches
Seulement pour Ultimate
3 Cours
104 Tâches
Seulement pour Ultimate
2 Cours
13 Tâches
Seulement pour Ultimate
3 Cours
119 Tâches
Seulement pour Ultimate
1 Cours
15 Tâches
Seulement pour Ultimate
3 Cours
75 Tâches
Seulement pour Ultimate
3 Cours
31 Tâches
Seulement pour Ultimate
2 Cours
151 Tâches
Seulement pour Ultimate
3 Cours
49 Tâches
Seulement pour Ultimate
2 Cours
1 Projet
38 Tâches
Seulement pour Ultimate
3 Cours
36 Tâches
Seulement pour Ultimate
2 Cours
1 Projet
38 Tâches
Learning tracks
parcours
TEST TRACK 12
Débutant
4.0
(5938)
parcours
Développement Web Full Stack
Débutant
4.5
(57)
parcours
Maîtriser la Visualisation des Données
Intermédiaire
4.6
(7)
parcours
SQL de Zéro à Héros
Débutant
4.7
(91)
parcours
Essentiels de C++
Débutant
4.4
(17)
parcours
Python de Zéro à Héros
Débutant
4.7
(284)
parcours
Apprentissage Automatique Supervisé
Intermédiaire
4.9
(7)
parcours
Python au-delà de l'Intermédiaire
Débutant
5.0
(1)
parcours
Essentiels de Java
Débutant
4.3
(9)
parcours
Développement de Jeux avec Unity
Débutant
4.6
(7)
parcours
Become a Django Developer
Avancé
4.4
(27)
parcours
Flask for Dummies
Intermédiaire
4.5
(31)
parcours
Fondations du Développement Frontend
Débutant
4.6
(52)
parcours
Web Developer from Zero to Hero
Débutant
4.6
(56)
parcours
Preparation for Data Science
Intermédiaire
4.5
(11)
parcours
Deep Learning Odyssey
Avancé
5.0
(3)
parcours
Développement Web Avec C#
Débutant
4.8
(97)
parcours
TEST E2E TRACK BEGINNER
Débutant
parcours
Test Track
Begginer
4.7
(3)
parcours
Skilled Python BackEnd Developer
Avancé
4.7
(261)
parcours
Test Recalculate
Débutant
parcours
Essentiels d'Excel
Débutant
4.5
(33)
parcours
Full-Stack .NET Developer Journey
Intermédiaire
4.8
(128)
parcours
Full-Stack .NET Developer Journey
Intermédiaire
4.8
(128)
parcours
Test track with rating
Avancé
4.0
(4)
parcours
TEST TEST TRACK
Débutant
parcours
Data Analyst Foundation
Débutant
4.7
(110)
parcours
Maîtrise du C++
Avancé
parcours
Java Web
Avancé
4.5
(30)
parcours
Devenez un Ingénieur QA
Débutant
4.5
(43)
parcours
Production Vidéo avec Adobe
Débutant
parcours
Digital Marketing Essentials
Débutant
parcours
Outils de Conception UI/UX
Débutant
parcours
Test image upload track
Débutant
parcours
Essential Office Skills
Débutant
4.6
(24)
parcours
GitHub from Zero to Hero
Débutant
parcours
No-Code Website Development
Débutant
parcours
C Programming & Low-Level Development
Débutant
parcours
testes
Débutant
4.7
(3)
parcours
Test translation track
Intermédiaire
parcours
Test CMS Track
Débutant
4.7
(3)
Become a Development expert
Interactive exercises
Learning videos
AI-assistant on all courses
Workspaces for designing your own projects
Ready to get started?
ProBest intro offer | UltimateA complete experience to kickstart your career | |
---|---|---|
85+ Top-Rated courses | ||
Completion certificates | ||
AI-Assistant in all courses | ||
20+ hands-on Real-world projects | ||
Personalized study tracks | ||
Unlimited workspaces | ||
Boost your Tech Skills!
with up to 55% off
What you'll get with our subscription:
Access to 85+ top-rated courses
AI-driven Learning
Workspaces for practicing your skills
Personalized study tracks
Certificates of completion
Training 2 or more people?
Get your team access to Codefinity courses anytime, anywhere.
Try Codefinity Teams