Creez Des Sites Interactifs Avec React Et Redux

Section 1: Leçons 1 à 10

10 leçons 16 min

Bienvenue dans la formation "Créez des sites intéractifs avec React et Redux"

2 min
Test de positionnement

3 min
Quelques conseils avant de commencer

2 min
Avant de commencer - Bienvenue dans ce cours !

1 min
Avant de commencer - Prérequis

1 min
Avant de commencer - Comment réussir cette formation

1 min
Orientation - Commencez la formation selon votre niveau

2 min
Partons sur de bonnes bases - Qu'est-ce que React ?

3 min
Partons sur de bonnes bases - Comprendre la différence entre des sites « Single Page » et « Multi Page »

3 min
Partons sur de bonnes bases - Quels logiciels utiliser ?

2 min

Section 2: Leçons 11 à 20

10 leçons 13 min

Partons sur de bonnes bases - Quelles extensions installer

3 min
Quelques rappels sur les nouveautés de JavaScript - Revoyons ensemble les nouveautés de JavaScript

1 min
Quelques rappels sur les nouveautés de JavaScript - Oubliez « var », utilisez « let » et « const

3 min
Quelques rappels sur les nouveautés de JavaScript - Les fonctions fléchées

1 min
Quelques rappels sur les nouveautés de JavaScript - Les objets

1 min
Quelques rappels sur les nouveautés de JavaScript - Les classes (constructeur, propriétés et méthodes)

2 min
Quelques rappels sur les nouveautés de JavaScript - Les modules (import et export)

2 min
Quelques rappels sur les nouveautés de JavaScript - L'affectation par décomposition

1 min
Quelques rappels sur les nouveautés de JavaScript - Le REST parameter

1 min
Quelques rappels sur les nouveautés de JavaScript - Les types primitifs et les types par référence

1 min

Section 3: Leçons 21 à 30

10 leçons 19 min

Quelques rappels sur les nouveautés de JavaScript - Nous voici prêts pour entrer sur la planète React

1 min
Nos premiers pas avec React - Notre première application avec React

2 min
Nos premiers pas avec React - Composant par classe VS Composant par fonction

3 min
Nos premiers pas avec React - Ajoutons un nouveau composant

2 min
Nos premiers pas avec React - À la découverte des props (propriétés)

3 min
Nos premiers pas avec React - Utiliser du JavaScript dans du JSX

1 min
Nos premiers pas avec React - La propriété children

2 min
Nos premiers pas avec React - Et si on stockait des données (Le state)

5 min
Nos premiers pas avec React - Props VS State

1 min
Nos premiers pas avec React - Les composants Statefull et Stateless

3 min

Section 4: Leçons 31 à 40

10 leçons 22 min

Nos premiers pas avec React - Changer le state grâce aux événements

1 min
Nos premiers pas avec React - Les événements disponibles

2 min
Nos premiers pas avec React - Modifier proprement le state

1 min
Nos premiers pas avec React - Voir et modifier les props et les states depuis son navigateur

2 min
Nos premiers pas avec React - Quand mettre des parenthèses

1 min
Le cycle de vie d'une application React - Qu'est-ce que le cycle de vie d'une application

1 min
Le cycle de vie d'une application React - Analysons les différents états

8 min
Le cycle de vie d'une application React - Eviter l'actualisation d'un composant inutilement

3 min
Prenons un voyage pour le futur : les React Hook - Qu'est-ce que les React Hook

1 min
Prenons un voyage pour le futur : les React Hook - Comment utiliser le State avec React Hook

6 min

Section 5: Leçons 41 à 50

10 leçons 20 min

Prenons un voyage pour le futur : les React Hook - Les autres états

5 min
Prenons un voyage pour le futur : les React Hook - Limiter la mise à jour d'instructions inutilement

2 min
Projet 1 - Un prévisualisateur de markdown - Qu'allons-nous faire dans ce projet

3 min
Projet 1 - Un prévisualisateur de markdown - Avant de se lancer préparer son projet

2 min
Projet #1 - Un prévisualisateur de markdown - Etape 1 - Créer le HTML et le CSS

3 min
Projet #1 - Un prévisualisateur de markdown - Etape 2 - Détecter le changement du texte

2 min
Projet #1 - Un prévisualisateur de markdown - Etape 3 - Installer MarkedJS

2 min
Projet #1 - Un prévisualisateur de markdown - Etape 4 - Transformer le texte en HTML

3 min
Projet #1 - Un prévisualisateur de markdown - Correction

3 min
Parlons design avec React - Qu'allons-nous apprendre dans cette section

1 min

Section 6: Leçons 51 à 60

10 leçons 11 min

Parlons design avec React - Qu'est-ce qu'un module CSS

2 min
Parlons design avec React - Initialisations des modules CSS

2 min
Parlons design avec React - Modifions dynamiquement le CSS avec les modules

2 min
Parlons design avec React - Appliquer un style global sans aucune transformation

1 min
Parlons design avec React - Modifier dynamiquement le style en utilisant JavaScript

1 min
Parlons design avec React - Gérer dynamiquement les classes

2 min
Parlons design avec React - Qu'est-ce que Styled Components

1 min
Parlons design avec React - Utilisons Styled Components sur notre site

1 min
Parlons design avec React - Modifions dynamiquement le CSS avec Styled Components

2 min
Parlons design avec React - Ajouter un effet de hover

1 min

Section 7: Leçons 61 à 70

10 leçons 10 min

Parlons design avec React - Personnaliser dynamiquement Styled Components

1 min
Entraînons-nous au design avec React - Exercice 1 Pratiquer Styled Component

1 min
Entraînons-nous au design avec React - Exercice 1 Correction

2 min
La logique avec React - Utiliser les conditions ternaires pour afficher du contenu

2 min
La logique avec React - Utiliser les conditions if else pour afficher du contenu

1 min
La logique avec React - Lister dynamiquement des composants

1 min
La logique avec React - Supprimer dynamiquement des composants

2 min
La logique avec React - Modifier dynamiquement des composants

1 min
Projet #2 - Une TO-DO list - Qu'allons-nous faire dans ce projet

1 min
Projet #2 - Une TO-DO list - Avant de se lancer préparer son projet

1 min

Section 8: Leçons 71 à 80

10 leçons 11 min

Projet #2 - Une TO-DO list - Découper le code en composants

1 min
Projet #2 - Une TO-DO list - Configurer les modules CSS

1 min
Projet #2 - Une TO-DO list - Etape 3 - Créer le state

1 min
Projet #2 - Une TO-DO list - Etape 4 - Gérer la suppression

1 min
Projet #2 - Une TO-DO list - Etape 5 - Gérer le checkage

1 min
Projet #2 - Une TO-DO list - Etape 6 - Gérer l'ajout d'une nouvelle tâche

2 min
Projet #2 - Une TO-DO list - Correction

2 min
Plongeons dans les profondeurs de React - Les Reacts Fragments

1 min
Plongeons dans les profondeurs de React - Les HOC (composant d'ordre supérieur)

2 min
Plongeons dans les profondeurs de React - Les Refs

2 min

Section 9: Leçons 81 à 90

10 leçons 17 min

Plongeons dans les profondeurs de React - Les Refs dans les composants par classe

1 min
Plongeons dans les profondeurs de React - Le context API

2 min
Plongeons dans les profondeurs de React

1 min
Quiz du module 1

3 min
Restez organiser pour un meilleur apprentissage !

1 min
Connectons-nous au monde extérieur (Firebase / Axios) - Qu'allons-nous faire dans cette section

1 min
Connectons-nous au monde extérieur (Firebase / Axios) - Créer une application sur firebase

2 min
Connectons-nous au monde extérieur (Firebase / Axios) - Installer Axios pour gérer les requêtes AJAX

1 min
Connectons-nous au monde extérieur (Firebase / Axios) - Créer une base de données

2 min
Connectons-nous au monde extérieur (Firebase / Axios) - Ajouter des données

5 min

Section 10: Leçons 91 à 100

10 leçons 13 min

Connectons-nous au monde extérieur (Firebase / Axios) - Récupérer des données

3 min
Connectons-nous au monde extérieur (Firebase / Axios) - Supprimer des données

3 min
Connectons-nous au monde extérieur (Firebase / Axios) - Modifier des données

2 min
Connectons-nous au monde extérieur (Firebase / Axios) - Gérer les erreurs

1 min
Connectons-nous au monde extérieur (Firebase / Axios) - Ajouter un spinner pendant le chargement des données

1 min
Connectons-nous au monde extérieur (Firebase / Axios) - Améliorons notre code en créant une instance Axios

2 min
Projet #3 - Une TO-DO list améliorée - Qu'allons-nous faire dans ce projet

1 min
Projet #3 - Une TO-DO list améliorée - Avant de se lancer préparer son projet

1 min
Projet #3 - Une TO-DO list améliorée - Etape 1 - Créer le focus à l'affichage de la page

1 min
Projet #3 - Une TO-DO list améliorée - Etape 2 - Configurer firebase

1 min

Section 11: Leçons 101 à 110

10 leçons 13 min

Projet #3 - Une TO-DO list améliorée - Etape 3 - Permettre l'ajout d'une tâche sur Firebase

3 min
Projet #3 - Une TO-DO list améliorée - Etape 4 - Récupérer les tâches depuis Firebase

2 min
Projet #3 - Une TO-DO list améliorée - Etape 5 - Permettre la mise à jour d'une tâche sur Firebase

2 min
Etape 6 - Permettre la suppresion d'une tâche sur Firebase

2 min
Projet #3 - Une TO-DO list améliorée - Correction

2 min
Projet #4 - Un véritable blog - Qu'allons-nous faire dans les prochaines sections

1 min
Faisons un site avec plusieurs pages - Plusieurs pages dans une seule page

2 min
Faisons un site avec plusieurs pages - Créons un nouveau projet

1 min
Faisons un site avec plusieurs pages - Mettre en place une route

2 min
Faisons un site avec plusieurs pages - Afficher des pages selon l'adresse visitée

1 min

Section 12: Leçons 111 à 120

10 leçons 11 min

Faisons un site avec plusieurs pages - Ajouter des liens (Link)

2 min
Faisons un site avec plusieurs pages - Mettons en place notre navigation

1 min
Faisons un site avec plusieurs pages - Ajouter du style sur le lien de la page actuelle (NavLink)

2 min
Faisons un site avec plusieurs pages - Passer des paramètres dans les urls du route

2 min
Faisons un site avec plusieurs pages - Passer des ancres et utiliser les requêtes GET

2 min
Faisons un site avec plusieurs pages - Redirigeons notre utilisateur directement

1 min
Faisons un site avec plusieurs pages - Essayons de rediriger un utilisateur dans un sous-composant

1 min
Faisons un site avec plusieurs pages - Que faire si la page demandée n'existe pas

1 min
Faisons un site avec plusieurs pages - Que faire si la page demandée n'existe pas

1 min
Faisons un site avec plusieurs pages - Stocker les routes dans un fichier de configuration

1 min

Section 13: Leçons 121 à 130

10 leçons 24 min

React et les formulaire - Les formulaires et React

1 min
React et les formulaire - Créons notre composant input

1 min
React et les formulaire - Affichons nos inputs dynamiquement

3 min
React et les formulaire - Autorisons notre utilisateur à écrire

3 min
React et les formulaire - Ajoutons des vérifications

3 min
React et les formulaire - Changeons le style des inputs en cas d'erreur

2 min
React et les formulaire - Ajoutons un article sur Firebase

6 min
React et les formulaire - N'oublions pas la page d'accueil

3 min
React et les formulaire - Lister un seul article

4 min
React et les formulaire - Supprimer un article

2 min

Section 14: Leçons 131 à 140

10 leçons 20 min

React et les formulaire - Modifier un article

4 min
React et les formulaire - Rediriger l'utilisateur si l'article n'existe pas

1 min
React et les formulaire - Afficher uniquement les articles publiés

2 min
React et les formulaire - Réalisons les finitions

2 min
Projet #5 - Blog : Utilisation de Redux - Qu'allons-nous faire dans les prochaines sections

1 min
Quiz du module 2

3 min
Redux - Qu'est-ce que Redux et pourquoi l'utiliser

2 min
Redux - Comprenons le fonctionnement de Redux

2 min
Redux - Connecter Redux avec React

3 min
Redux - Connecter le store avec React

3 min

Section 15: Leçons 141 à 150

10 leçons 17 min

Redux - Connecter les actions avec React

3 min
Redux - Passer des données dynamiques avec les actions

1 min
Redux - Protégeons le nom des actions

4 min
Redux - Combinons le state local avec Redux

4 min
Redux - Finaliser sur le Redux

2 min
Envoyer son projet sur internet - Comment allons-nous faire

1 min
Envoyer son projet sur internet - Changer le basename

2 min
Envoyer son projet sur internet - Créer un build du projet

2 min
Envoyer son projet sur internet - Envoyer le projet avec Firebase

1 min
Les petits plus qui font toute la différence - Ajouter des notifications

1 min

Section 16: Leçons 151 à 158

8 leçons 12 min

Les petits plus qui font toute la différence - Afficher la date dans la langue de molière

1 min
Les petits plus qui font toute la différence - Modifier dynamiquement la balise head

2 min
Les petits plus qui font toute la différence - Utiliser Bootstrap avec React

1 min
Les petits plus qui font toute la différence - Utiliser des types avec PropTypes

2 min
Conclusion - Félicitations, vous avez réussi !

2 min
Quiz du module 3

3 min
Bravo

1 min
Evaluation finale

3 min

Creez Des Sites Interactifs Avec React Et Redux

Course description

What will i learn?

Wiki form

60 €

Cours

158

Skill level

Intermédiaire

Expiry period

Lifetime

Related courses

Intermédiaire

Html5 Et Css3 De Debutant A Expert

160 €

Intermédiaire

Javascript Les Fondamentaux

100 €

Intermédiaire

Devenir Un Developpeur Python

140 €

Intermédiaire

Devenir Un Developpeur C

180 €

Débutant

Lessentiel De Wordpress 5

120 €

Intermédiaire

Formation Woocommerce

60 €

Catégories principales

Liens utiles

Aide

Subscribe to our newsletter

Creez Des Sites Interactifs Avec React Et Redux

Course description

What will i learn?

Wiki form

60 €

Cours

158

Skill level

Intermédiaire

Expiry period

Lifetime

Related courses

Intermédiaire

Html5 Et Css3 De Debutant A Expert

160 €

Intermédiaire

Javascript Les Fondamentaux

100 €

Intermédiaire

Devenir Un Developpeur Python

140 €

Intermédiaire

Devenir Un Developpeur C

180 €

Débutant

Lessentiel De Wordpress 5

120 €

Intermédiaire

Formation Woocommerce

60 €

Catégories principales

Liens utiles

Aide

Subscribe to our newsletter

Êtes-vous sûr ?