React 2021 Par La Pratique, De A A Z (Evolution Progressive)

[LeeAndro]

Last updated 2/2022MP4 | Video: h264, 1280x720 | Audio: AAC, 44.1 KHzLanguage: French | Size: 6.68 GB | Duration: 13h 26m

Apprenez les bases de React et ses modules importants dont React-Router V5/Axios/React-Bootstrap en creant 4 applis

What you'll learn
Developper des applications avec la librairie React
Communiquer avec des serveurs et API REST (axios)
Mettre en place de maniere basique un serveur Firebase et une database
Creer des sites internet "Single page" avec le module React-Router
Mettre en ligne ses applications et sites internet developpes avec React sur un serveur Apache
Utiliser Bootstrap avec et sans React-Bootstrap
Requirements
Avoir de bonnes connaissances en Javascript (+ connaitre bootstrap, HTML, CSS)
Description
Le cours utilise la version 5 de REACT ROUTER.​

La V6 est disponible depuis fin 2021. Pour suivre cette formation, je vous inviterai a utiliser la meme version que moi et a regarder la documentation relative aux mises a jours de la V6.Nouveau 2021 : Ajout de 2 modules sur les Hooks (1,5h) : - Introduction aux Hooks- 5eme mini-projet utilisant les hooksREACT 2020 par la pratique, de A a Z (evolution progressive) :Avec ce cours, vous apprendrez les bases de la librairie JavaScript REACT au travers de 4 applications differentes.C'est l'un des "cours de fin de parcours" que je propose dans le cursus JavaScript H2PROG ; il en contient 10 autres permettant d'apprendre ce langage de programmation, les bases de donnees (MongoDB / SQL), l'architecture MVC, la programmation Serveur, la programmation Front-End ....Un niveau Intermediaire :Meme si j'explique tout ce qui est realise, il vous faudra disposer de bonnes bases en programmation JavaScript pour suivre ce cours dans de bonne conditions ! Je ne recommande pas a un debutant en programmation de demarrer son apprentissage par l'utilisation d'un Framework ou d'une librairie (en particulier REACT).La progression normale d'un apprenti developpeur est la suivante : Algorithmique -> langage de programmation -> framework / librairieLe niveau est cependant "Debutant" en ce qui concerne la librairie REACT.Le cours...... permettra d'apprendre les bases de la librairie et toutes les notions fondamentales pour l'utiliser dans de bonnes conditions. Vous aurez des diapositives de synthese telechargeables que vous pourrez impr et utiliser au besoin dans la poursuite de votre apprentissage.La prre application...... contiendra toutes les bases de la librairie et sera un "gros" exercice du cours. Nous rajouterons en plus deux notions fondamentales liees aux sites et applications web avec : la creation de formulaires avec React, l'utilisation des modules Formik et Yup pour valider les formulairesNous creerons une application permettant de gerer des livres (CRUD front-End).La deuxieme application...... permettra de mettre en pratique tous vos acquis et rajoutera la possibilite d'echanger avec un "serveur" tels que Firebase. Nous creerons sur ce dernier une base de donnees qui contiendra plusieurs informations que nous pourrons recuperer dans notre application grace a Axios. Nous verrons egalement comment envoyer des informations au serveur. Nous programmerons une application permettant de creer des personnages (type RPG).La troisieme application...... permettra encore plus de pratique sur les fondamentaux, l'utilisation des competences apprises dans la deuxieme application, en particulier sur le module Axios. Nous communiquerons avec une API REST (REST Countries) pour recuperer des donnees et les traiter en Front avec React. Nous en profiterons pour apprendre comment creer un site web complet via l'utilisation de React RouterNous creerons un site permettant d'afficher tous les pays du monde (drapeau, nom, capitale ....), depuis une l'API REST Countries.La quatrieme application...... permettra de consolider les acquis des 3 prres et de creer un site web supplementaire avec 3 pages (la page d'accueil, l'application, la page de contact). Cette application fournira l'occasion d'installer le module React-Bootstrap et de voir comment il s'utilise en combinaison avec React-Router. Nous ajouterons une application permettant de lister tous les etablissements publics Francais, en utilisant une API REST du gouvernement.Nous verrons enfin comment mettre en ligne ce site internet sur un serveur Apache!L'objectif...Avec plus de 10 heures d'enregistrements, vous disposerez du necessaire pour developper sereinement des applications et sites internet Front-end avec la librairie REACT. A l'issue de cette formation vous pourrez rajouter cette nouvelle competence sur votre CV.Les applications sont disponibles en ligne et sont testables !Merci et a tres vite !Matthieu de H2PROG.

Overview

Section 1: Introduction

Lecture 1 Introduction

Lecture 2 Qui suis-je

Lecture 3 Conseils pour suivre la formation

Lecture 4 Le parcours de formation

Lecture 5 Installations

Lecture 6 Installation de Visual Studio Code

Lecture 7 Installation de Node.JS

Lecture 8 Qu'est ce que REACT

Lecture 9 PDF

Section 2: Initialisation

Lecture 10 Avant de demarrer

Lecture 11 Creation de la prre application

Lecture 12 Le JSX

Section 3: Les composants

Lecture 13 Composants simples

Lecture 14 Des composants plus "complexes"

Lecture 15 Des composants dans des composants

Lecture 16 Passage d'informations a un composant

Lecture 17 Classes

Lecture 18 Synthese

Section 4: Le states

Lecture 19 Le principe

Lecture 20 Cycle de vie

Lecture 21 L'horloge & setState

Lecture 22 setState

Lecture 23 Synthese

Section 5: Structuration (Dossier, CSS ...)

Lecture 24 Restructuration du dossier SRC

Lecture 25 Le CSS dans REACT

Lecture 26 Tests et ternaires

Lecture 27 Synthese

Section 6: Les evenements

Lecture 28 Le clic sur un bouton

Lecture 29 Evenements et states

Lecture 30 Modifier une personne

Lecture 31 Synthese

Section 7: Propriete "children"

Lecture 32 L'utilisation de la propriete "children"

Lecture 33 Synthese

Section 8: Les listes

Lecture 34 Listes et fonction map

Lecture 35 La propriete "key"

Lecture 36 Synthese

Section 9: Projet 1 : Les livres et un CRUD Front-End

Lecture 37 Presentation du projet et choix des composants

Lecture 38 Creation du projet

Lecture 39 Ajout de bootstrap

Lecture 40 Composant "Titre"

Lecture 41 Creer un Snippet

Lecture 42 Changer la police

Lecture 43 Composant Bouton

Lecture 44 Composant Livres

Lecture 45 Liste de livres

Lecture 46 Composant Livre

Lecture 47 Suppr un livre

Lecture 48 Bouton d'ajout d'un livre

Lecture 49 Composant formulaire d'ajout

Section 10: Les formulaires dans REACT

Lecture 50 Creation du formulaire d'ajout

Lecture 51 Soumission du formulaire

Lecture 52 Ajout du livre dans les states

Lecture 53 Fermer le formulaire

Lecture 54 La modification d'un livre

Lecture 55 Composant Alert

Lecture 56 Synthese

Section 11: La validation des formulaires

Lecture 57 Le formulaire d'ajout d'un livre avec Formik

Lecture 58 La validation des saisies avec Formik

Lecture 59 La validation des saisies avec YUP

Section 12: Projet 2 : Createur de personnages (Ajout de firebase)

Lecture 60 Presentation du projet

Lecture 61 Preparation du projet

Lecture 62 Composants bouton et titre

Lecture 63 Composant CreateurPersonnage

Lecture 64 Composant ImagePerso

Lecture 65 Les fleches

Lecture 66 Changer d'image

Lecture 67 Points de caracteristiques

Lecture 68 Les boutons lies aux caracteristiques

Lecture 69 La mise a jours des points de caracteristiques dans les states

Lecture 70 Affichage des armes

Lecture 71 Selectionner une arme

Lecture 72 Bouton "creer" et "reinitialiser"

Section 13: Firebase & Database & Axios

Lecture 73 Creation de la DB

Lecture 74 Axios & Firebase

Lecture 75 Enregistrer les personnages

Lecture 76 Lister les personnages crees

Lecture 77 Rafraichissement des donnees

Section 14: Projet 3 : API REST & Axios

Lecture 78 Presentation du projet

Lecture 79 Creation du projet

Lecture 80 Utilisation de l'API REST

Lecture 81 Filtrer sur les pays

Lecture 82 La pagination

Section 15: Routage

Lecture 83 Attention : Comptabilite V5 - V6

Lecture 84 Les bases du routage

Lecture 85 NavBar

Lecture 86 Afficher un pays (etape1)

Lecture 87 Afficher un pays (etape 2)

Lecture 88 Erreur 404

Lecture 89 Parametrage des NavLinks

Lecture 90 Mise en ligne

Lecture 91 Synthese sur le routage

Section 16: Projet 4

Lecture 92 Presentation du projet

Lecture 93 Structure du site

Lecture 94 React router

Lecture 95 NavBar avec React-Bootstrap et React-Router

Lecture 96 La page d'accueil

Lecture 97 Erreur 404

Lecture 98 Page contact et formulaire

Lecture 99 Validation du formulaire avec Formik et Yup

Lecture 100 Page localisation (etape 1)

Lecture 101 Page localisation (etape 2)

Section 17: Introduction aux Hooks

Lecture 102 Les hooks

Lecture 103 useState

Lecture 104 useState et les objets

Lecture 105 useEffect

Lecture 106 Hook personnalise

Section 18: Projet 5 : Utilisation des connaissances sur les hooks

Lecture 107 Presentation du projet

Lecture 108 Les bases du projet

Lecture 109 Lister les formations

Lecture 110 Hook personnalise : useLoadData

Lecture 111 Filtrer par categorie

Section 19: Bonus - Mes autres cours

Lecture 112 Continuer son apprentissage

Developpeur web,Etudiant en developpement,Reconversion professionnelle

HomePage:

Https://anonymz.com/https://www.udemy.com/course/react-2020-par-la-pratique-de-a-a-z-evolution-progressive/

DOWNLOAD

https://1dl.net/fkut4ms437jy/PqGmdABV__REACT_2021.part1.rar.html
https://1dl.net/01ce7dnz6jui/PqGmdABV__REACT_2021.part2.rar.html
https://1dl.net/uam3t28epp9e/PqGmdABV__REACT_2021.part3.rar.html
https://1dl.net/wrkmafkkyfc5/PqGmdABV__REACT_2021.part4.rar.html
https://1dl.net/2xqvrpu73ckp/PqGmdABV__REACT_2021.part5.rar.html
https://1dl.net/4w1sik3ulzup/PqGmdABV__REACT_2021.part6.rar.html
https://1dl.net/yeo2wzelejj8/PqGmdABV__REACT_2021.part7.rar.html