Apprendre Angular Par La Création D'Un Site E-Commerce 2022

De nombreux projets professionnels pour apprendre, approfondir et devenir un expert incontournable du framework Angular

What you'll learn
Créer une application Angular complète à partir d'un dossier vide
Ajouter des formulaires pilotés par le template et par le modèle
Mettre en place un système d'authentification
Développer un système de navigation entre composants
Effectuer des requêtes HTTP depuis son application
Consommer les ressources d'une API pour produire un site
Déployer une application Angular en production
Requirements
Des connaissances en HTML, JavaScript & CSS sont recommandées
Etre motivé
Description
Vous souhaitez vous former au développement d'applications Web avec la dernière version d'Angular ? Vous rêvez de construire des sites web dynamiques, qui réagissent immédiatement aux moindres interactions de vos utilisateurs, avec une performance optimale ? Eh, ça tombe bien, vous êtes au bon endroit !Ce cours va vous permettre de vous lancer dans le développement d'applications web avec la dernière version du framework Angular. Pour une meilleure compréhension de son contenu, il est nécessaire d'avoir un minimum de connaissances sur le fonctionnement du web et sur les langages HTML et JavaScript. J'ai a eu à cœur de proposer un cours très pragmatique avec de nombreux exemples de codes expliqués, qui illustrent de façon très concrète les passages plus théoriques. Conçu pour être un allié efficace au quotidien, ce cours à la structure claire constitue un réel référentiel Angular pour le développeur.Ce que vous allez apprendre dans cette formation :Introduction générale Framework AngularMise en place et création d'un projet AngularStructure d'un projet AngularGestion des données dynamiques avec AngularNotions avancéesLes services asynchronesLes formulaires par la méthode template ou reactive en AngularInteraction avec un backendÀ la fin de ce cours, vous serez capable de :Créer des components AngularManipuler un template avec le data-binding, les directives et les pipesFaire communiquer les components avec les services et les ObservablesCréer des Single Page Applications avec le routingCommuniquer avec les utilisateurs avec les formulairesFaire communiquer une application avec un backendSi vous ne savez pas de quoi je parle, n’hésitez pas à voir les vidéos d’Intro de chaque partie, elles sont gratuites.Afin de vous proposer la formation la plus complète possible sur Udemy je m'engage à :Ajouter des chapitres pour les nouvelles mises à jour importantes (1 ou 2 par Mois)Ajouter régulièrement du contenu à la formation (essentiellement des cas pratiques)Ajouter des cas pratiques à la demande (Merci de m'envoyer un émail si vous avez une proposition)Accompagner les participants avec des cas pratiques et autres sources utiles à leur réalisation.Ces ajouts de vidéos seront, bien entendu, gratuits si vous avez acquis la formation.Je reste disponible dans la rubrique Question/Réponses d'Udemy pour répondre à vos questions.Informations importantes à savoir:Si cette formation ne vous satisfait pas alors nous nous engageons à vous rembourser sous 30 jours.Une fois que vous avez rejoint la formation, vous y avez accès à vie y compris les mises à jours.Vous pouvez m’envoyer des messages personnels avec toutes vos questions ou suggestions d'amélioration concernant la formationVous bénéficierez d'un suivi et d'une assistance durant toute la durée de votre formation A la fin de votre formation, vous pouvez obtenir une lettre de recommandation pour faciliter vos recherches d'emploi ou de stages Allez ! On passe à l’action !Inscrivez-vous maintenant et commencez par bâtir votre profil de développeur web.

Overview

Section 1: Introduction générale Framework Angular

Lecture 1 Cours 1 Présentation de la formation

Lecture 2 Cours 2 Présentation des projets de la formation

Lecture 3 Introduction au Framework Frontend Angular

Section 2: Les avantages de la formation

Lecture 4 Présentation 1 Les avantages de la formation

Lecture 5 Présentation 2 Les avantages de la formule starter

Lecture 6 Présentation 3 Les avantages de la formule basic

Lecture 7 Présentation 4 Les avantages de la formule premium

Lecture 8 Présentation 5 Les avantages de la formule business

Lecture 9 Présentation 6 Les ressources du formateur

Section 3: La communication client-serveur

Lecture 10 Cours 1 La Communication client serveur

Lecture 11 Cours 2 La Communication dans le cadre d'un site Web

Lecture 12 Cours 3 La Communication dans le cadre d'une Application Web

Lecture 13 Cours 4 Reconnaitre un site Web

Lecture 14 Cours 5 Reconnaitre une application Web

Lecture 15 Cours 6 Synthèse

Section 4: Installation des logiciels de travails

Lecture 16 Cours 1 Présentation des logiciels de travails

Lecture 17 Cours 2 Installation du navigateur Chrome sur Windows

Lecture 18 Cours 3 Installation de l'éditeur de code

Lecture 19 Cours 4 Installation du logiciel de version GIT

Lecture 20 Cours 5 Installation du logiciel de NodeJs

Section 5: Découverte de la CLI Angular

Lecture 21 Cours 1 Installation de angular CLI

Lecture 22 Cours 2 Découverte de angular CLI

Lecture 23 Cours 3 Création d'un projet avec angular CLI

Lecture 24 Cours 4 Comprendre le contenu d'un projet Angular

Lecture 25 Cours 5 Comprendre le contenu d'un projet Angular

Lecture 26 Cours 6 Comprendre le contenu d'un projet Angular

Section 6: Structure d'un projet Angular

Lecture 27 Cours 1 Structure d'un projet Angular

Lecture 28 Cours 2 Le module et le composant en Angular

Lecture 29 Cours 3 Le serveur de développement en Angular

Lecture 30 Cours 4 Configuration du DNS local en Angular Sur Windows

Section 7: TP 1 Mise en page statique avec Angular

Lecture 31 Cours 1 Présentation du module de cours

Lecture 32 Cours 2 Comment architecturer un projet

Lecture 33 Cours 3 Mise en page en angular

Lecture 34 Cours 4 Mise en page en angular

Lecture 35 Cours 5 Mise en page en angular

Lecture 36 Cours 6 Conclusion de la mise en page

Section 8: TP 2 Mise en page statique avancée avec Angular

Lecture 37 Cours 1 Mise en place du projet

Lecture 38 Cours 2 Mise en page desktop

Lecture 39 Cours 3 Mise en page du container

Lecture 40 Cours 4 Mise en forme du main

Lecture 41 Cours 5 Fin de la mise en forme du main

Lecture 42 Cours 6 Mise en page Tablette et Mobile

Section 9: Intégration de librairies CSS et JS

Lecture 43 Cours 1 Intégration de librairies en Angular

Lecture 44 Cours 2 Intégration de librairies en Angular

Lecture 45 Cours 3 Intégration de librairies en Angular

Section 10: Les directives en angular

Lecture 46 Cours 1 La directive ngIf en angular

Lecture 47 Cours 2 La directive ngFor en angular

Lecture 48 Cours 3 La directive ngClass en angular

Lecture 49 Cours 4 La directive ngStyle en angular

Section 11: La logique d'un composant Angular

Lecture 50 Cours 1 Mise en place du projet Shop App

Lecture 51 Cours 2 Balisage de l'application

Lecture 52 Cours 3 Mise en page du header et du footer

Lecture 53 Cours 4 Mise en page d'un produit

Lecture 54 Cours 5 Mise en page flexible des produits

Lecture 55 Cours 6 Quelques ajustements de styles

Section 12: La gestion des données dynamiques

Lecture 56 Cours 1 La logique d'un composant

Lecture 57 Cours 2 Propriétés et méthodes d'un composant

Lecture 58 Cours 3 Les types de données en TypeStript

Lecture 59 Cours 4 Affichages des propriétés dans le template

Lecture 60 Cours 5 Les filtres en Angular

Lecture 61 Cours 6 Création d'un model de données

Lecture 62 Cours 7 Création d'un model de données

Section 13: La transmission de données entre composants

Lecture 63 Cours 1 Introduction à la transmission des données

Lecture 64 Cours 2 L'opération Input et Output

Lecture 65 Cours 3 Transmission père au fils

Lecture 66 Cours 4 Utilisation des données reçues

Lecture 67 Cours 5 La directive ngFor ou la boucle For

Lecture 68 Cours 6 Quelques ajustement de styles

Lecture 69 Cours 7 Les évènements en angular

Lecture 70 Cours 8 Transmission du fils au père

Lecture 71 Cours 9 La directive ngIf en angular

Section 14: TP Création du modal Product View

Lecture 72 Cours 1 Présentation du projet

Lecture 73 Cours 2 Mise en place du model en Angular

Lecture 74 Cours 3 Ajustement de styles sur le modal

Lecture 75 Cours 4 Affichage du modal product View

Lecture 76 Cours 5 Gestion de l'interaction avec le Modal

Lecture 77 Cours 6 Mot de fin du la réalisation du projet

Lecture 78 Cours 7 Quelques ajustement sur l'aspect responsive

Section 15: Les services, Observables, Promises

Lecture 79 Cours 1 Les services en angular

Lecture 80 Cours 2 L'injection de dépendance

Lecture 81 Cours 3 Gestion asynchrone des données

Lecture 82 Cours 4 Programmation réactive avec RxJs

Lecture 83 Cours 5 Programmation reactive avec RXJS

Lecture 84 Cours 6 Le requêtage HTTP en angular

Lecture 85 Cours 7 Requête HTTP vers un serveur

Lecture 86 Cours 8 Les variables d'environnement en Angular

Section 16: Les formulaires templates en angular

Lecture 87 Cours 1 Présentation des formulaires

Lecture 88 Cours 2 La directive ngModel

Lecture 89 Cours 3 Correction des exercices sur le formulaire

Lecture 90 Cours 4 Correction des exercices sur le formulaire

Lecture 91 Cours 5 Correction des exercices sur le formulaire

Section 17: TP Création d'un formulaire

Lecture 92 Cours 1 Présentation du projet

Lecture 93 Cours 2 Mise en place du formulaire

Lecture 94 Cours 3 Mise en forme du formulaire

Lecture 95 Cours 4 Finalisation du projet

Lecture 96 Cours 5 Gestion de l'aspect responsive

Lecture 97 Cours 6 Création de la page de connexion

Section 18: Les formulaires réactifs en Angular

Lecture 98 Cours 1 Présentation des formulaires réactifs

Lecture 99 Cours 2 La validité d'un formulaire

Lecture 100 Cours 3 La validité d'un formulaire

Lecture 101 Cours 4 Exercice sur la validité d'un formulaire

Section 19: La routing en Angular

Lecture 102 Cours 1 Mise en place du routing en angular

Lecture 103 Cours 2 La navigation au sein d'une application Angular

Lecture 104 Cours 3 Les routes dynamiques dans angular

Lecture 105 Cours 4 Présentation du projet à réaliser

Lecture 106 Cours 5 Correction de l'exercice sur le routage

Lecture 107 Cours 6 Correction de l'exercice sur le routage

Lecture 108 Cours 7 Correction de l'exercice sur le routage

Lecture 109 Cours 8 Ajustement de styles

Lecture 110 Cours 9 Création d'une page loader

Lecture 111 Cours 10 Fin du projet

Section 20: Interface graphique du site E-commerce

Lecture 112 Cours 1 Présentation du projet

Lecture 113 Cours 2 Ajustements de la partie Header

Lecture 114 Cours 3 Ajustement du style des products item

Lecture 115 Cours 4 Ajustement du style des products item

Lecture 116 Cours 5 Ajustement du style du bas de page

Lecture 117 Cours 4 Ajustement du style des products item

Lecture 118 Cours 5 Ajustement du style du bas de page

Lecture 119 Cours 6 Ajustement du style du bas de page

Lecture 120 Cours 7 Ajustement du style du bas de page

Lecture 121 Cours 8 Ajustement du style de la page signup

Lecture 122 Cours 9 Ajustement du style du modal

Lecture 123 Cours 10 Ajustement du style du single product

Lecture 124 Cours 11 Ajustement du style du single product

Lecture 125 Cours 12 Ajustement du style du single product

Lecture 126 Cours 13 Ajustement du style du single product

Lecture 127 Cours 14 Ajustement du style du single product

Section 21: Routing avancé en Angular

Lecture 128 Cours 1 Création des routes imbriquées

Lecture 129 Cours 2 Amélioration de l'interface graphique

Lecture 130 Cours 3 Gestion des données des routes imbriquées

Lecture 131 Cours 4 Gestion des données des routes imbriquées

Lecture 132 Cours 5 Mise en page des détails de produits

Lecture 133 Cours 6 Mise en page des détails de produits

Section 22: Création d'un menu pour Mobile

Lecture 134 Cours 1 Création du menu mobile

Lecture 135 Cours 2 Création du menu mobile

Lecture 136 Cours 3 Création du menu mobile

Lecture 137 Cours 4 Fin du projet d'ajustement de styles

Lecture 138 Cours 5 Ajustement responsive

Section 23: Création d'un slider en Angular

Lecture 139 Cours 1 Mise en place du slider

Lecture 140 Cours 2 Programmation du slider

Lecture 141 Cours 3 Programmation du slider

Lecture 142 Cours 4 Programmation du slider

Section 24: Création de la page product By Category

Lecture 143 Cours 1 Présentation du projet

Lecture 144 Cours 2 Mise en place du container

Lecture 145 Cours 3 Mise en forme de la page

Lecture 146 Cours 4 Récupération des categories

Lecture 147 Cours 5 Affichage des categories de produits

Lecture 148 Cours 6 Affichage des categories de produits

Lecture 149 Cours 7 Affichage des produits

Lecture 150 Cours 8 Affichage des produits

Lecture 151 Cours 9 Affichage des produits

Lecture 152 Cours 10 Affichage des produits

Lecture 153 Cours 11 Affichage des produits

Lecture 154 Cours 12 Affichage des produits

Section 25: Création de la page de contact

Lecture 155 Cours 1 Présentation du projet à réaliser

Lecture 156 Cours 2 Création de la page contact

Lecture 157 Cours 3 Création de la page contact

Lecture 158 Cours 4 Gestion des données de la page de contact

Lecture 159 Cours 5 Gestion des données de la page de contact

Lecture 160 Cours 6 Gestion des données de la page de contact

Lecture 161 Cours 7 Création de la page 404

Section 26: Création d'interface Moderne

Lecture 162 Présentation de la création de l'interface moderne

Lecture 163 Cours 1 Présentation de l'atelier de formation

Lecture 164 Cours 2 Mise en place du projet

Lecture 165 Cours 3 Présentation de la stratégie

Lecture 166 Cours 4 Mise en place des couleurs du site

Lecture 167 Cours 5 Mise en place du fichier utile

Lecture 168 Cours 6 Création de la partie Banner Promo

Lecture 169 Cours 7 Mise en place de la barre de navigation top

Lecture 170 Cours 8 Mise en forme du nav top

Lecture 171 Cours 9 Mise en forme du nav top

Lecture 172 Cours 10 Mise en forme responsive du nav top

Lecture 173 Cours 11 Mise en place du website details

Lecture 174 Cours 12 Mise en forme du website details

Lecture 175 Cours 13 Mise en forme du website details

Lecture 176 Cours 14 Mise en forme du website details

Lecture 177 Cours 15 Mise en forme du menu

Lecture 178 Cours 16 Mise en forme du menu

Lecture 179 Cours 17 Mise en forme du menu

Lecture 180 Cours 18 Mise en forme du menu

Lecture 181 Cours 19 Mise en forme du menu

Lecture 182 Cours 20 Mise en forme du menu

Lecture 183 Cours 21 Mise en forme du menu

Lecture 184 Cours 22 Mise en forme du menu

Section 27: Slider : Interface Moderne

Lecture 185 Cours 1 Création du slider

Lecture 186 Cours 2 création de la partie promo

Lecture 187 Cours 3 création de la partie promo

Lecture 188 Cours 4 Création des boutons next et previous

Lecture 189 Cours 5 Ajustement de la partie promo

Section 28: Product : Interface Moderne

Lecture 190 Cours 1 Création de la section products featured

Lecture 191 Cours 2 Création de la section products featured

Lecture 192 Cours 3 Création de la section products featured

Lecture 193 Cours 4 Mise en forme de la section products featured

Lecture 194 Cours 5 Mise en place New arrivals Products

Lecture 195 Cours 6 Mise en place Banner big Sale

Lecture 196 Cours 7 Mise en place des categories

Lecture 197 Cours 8 Mise en page Pub banner

Lecture 198 Cours 9 Mise en page de la partie News

Lecture 199 Cours 10 Mise en page de la partie partenaires

Section 29: Special Product : Interface Moderne

Lecture 200 Cours 1 Mise en place spécial Product

Lecture 201 Cours 2 Mise en forme spécial Product

Lecture 202 Cours 3 Mise en forme spécial Product

Section 30: Footer : Interface Moderne

Lecture 203 Cours 1 Mise en place du footer

Lecture 204 Cours 2 Mise en forme du footer

Lecture 205 Cours 3 Mise en forme du footer

Section 31: Les tests unitaires en Angular

Lecture 206 Cours 1 Introduction au Test BDD avec Jasmine

Lecture 207 Cours 2 Ecrire le test unitaire d'une fonctionnalité

Lecture 208 Cours 3 Tester un model TypeScript

Lecture 209 Cours 4 Tester un component

Lecture 210 cours 5 Tester un component

Lecture 211 cours 6 Tester un component avec dépendance

Section 32: Conclusion à la formation

Lecture 212 Partie 1 Conclusion à la formation

Lecture 213 Partie 2 Aller plus loin avec une autre formation

Développeurs web junior souhaitant se former sur la nouvelle version d'Angular,Etudiants et stagiaires dans le domaine des technologies web