Partie 1 : Découvrir Angular

Chapitre 1 : L’introduction indispensable à Angular

10 Étapes

1. Angular, c’est quoi ?

1.1. Site Web versus Application Web

2. Différences entre Angular et AngularJS

3. La philosophie d’Angular

4. Le fonctionnement global d’une application Angular

Chapitre 2 : Le JavaScript moderne avec ECMAScript 6

10 Étapes

1. C’est quoi, ECMAScript 6 ?

2. Le nouveau monde d’ES6

2.1. L’héritage de classes avec JavaScript

2.2. Les paramètres par défaut

2.3. Les nouveaux mots clés : « let » & « const »

2.4. Un raccourci pour créer des objets

2.5. Les promesses

2.6. Les fonctions fléchées, ou « Arrow Functions »

2.7. Les « Template Strings »

3. Conclusion

Chapitre 3 : Découvrir TypeScript

8 Étapes

1. C’est quoi, « TypeScript » ?

2. Angular et TypeScript

3. « Hello, TypeScript ! »

4. Pas de limites avec TypeScript

4.1. Les fonctions avec TypeScript

4.2. Les classes avec TypeScript

4.3. Les Décorateurs

5. Conclusion

Chapitre 4 : Le standard des « Web Components »

7 Étapes

1. Introduction aux « Web Components »

2. Les éléments personnalisés

3. Le DOM de l’ombre

3.1. Angular et le Shadow DOM

4. Les templates HTML

5. Des importations en HTML

6. Conclusion

Chapitre 5 : Premiers pas avec Angular

11 Étapes | 1 Questionnaire

1. Les outils du développeur Angular

2. Installer Node.js et Npm

3. Installer un éditeur de code qui supporte le TypeScript

4. Démarrer un projet Angular

5. Installer Angular CLI

6. Générer le socle de notre projet

7. Présentation du socle généré par Angular CLI

8. Implémenter notre premier composant Angular

9. Présentation du module racine

10. Démarrer l’application

11. Conclusion

Questionnaire 1 : Démarrer avec Angular

Partie 2 : Acquérir les bases sur Angular

Chapitre 6 : Les Composants

7 Étapes

1. Qu’est-ce qu’un composant ?

2. Les cycles de vie d’un composant

2.1. Interagir sur le cycle de vie d’un composant

3. Une méthode pour gérer les interactions utilisateurs

4. Un peu de pratique !

5. Correction

6. Conclusion

Chapitre 7 : Les Templates

9 Étapes

1. Développer des templates

2. L’interpolation

3. Syntaxe de liaison des données

4. Gérer les interactions de l’utilisateur

5. Les variables référencées dans le template

6. Les directives NgIf et NgFor

7. Un peu de pratique : Modifions les templates de notre application

8. Correction

9. Conclusion

Chapitre 8 : Les Directives

7 Étapes

1. Qu’est-ce qu’une directive ?

2. Créer une directive d’attribut

3. Prendre en compte les actions de l’utilisateur

4. Utiliser notre directive

5. Ajouter un paramètre à notre directive

6. Réorganiser notre code

7. Conclusion

Chapitre 9 : Les Pipes

7 Étapes

1. Utiliser un Pipe

1.1. Les pipes disponibles de base

1.2. Combiner les pipes

1.3. Paramétrer nos pipes

1.4. Améliorons l’affichage des dates de notre application

2. Créer un pipe personnalisé

3. Conclusion

Chapitre 10 : Les Routes

12 Étapes

1. Le fonctionnement de la navigation

2. Deux nouveaux composants

2.1. Le composant DetailPokemonComponent

2.2. Le template du composant

2.3. Le composant de la liste des Pokémons

3. Mise en place du système de navigation

3.1. La balise

3.2. Créer les routes

3.3. Déclarer nos routes auprès du module racine

4. Gérer les erreurs 404

5. Débogguer vos routes

6. Conclusion

Chapitre 11 : Les Modules

5 Étapes

1. Le module racine et les autres

2. Créer un module

3. Mettre à jour le reste de l’application

4. Structurer l’architecture de notre application

5. Conclusion

Chapitre 12 : Les services et l’injection de dépendances

7 Étapes | 1 Questionnaire

1. Créer un service simple

2. Utiliser un service

3. L’injection de dépendances

3.1. Fournir un service à toute l’application

3.2. Fournir un service au niveau d’un module

3.3. Fournir un service au niveau d’un composant

4. Conclusion

Questionnaire 2 : Acquérir les bases sur Angular

Partie 3 : Aller plus loin avec Angular

Chapitre 13 : Formulaires pilotés par le template

15 Étapes

1. Introduction

1.1. Le module FormsModule

1.2. La directive NgForm

1.3. La directive NgModel

2. Créer un formulaire

2.1. Le composant du formulaire

2.2. Le template du formulaire

2.3. Les champs du formulaire

2.4. Le bouton submit

3. Ajouter des règles de validation

4. Prévenir l’utilisateur en cas d’erreurs

4.1. Ajouter des indicateurs visuels

4.2. Afficher des messages d’erreurs

5. Intégration du formulaire

6. Conclusion

Chapitre 14 : Formulaires pilotés par le modèle

14 Étapes

1. Les Formulaires pilotés par le modèle

2. Un peu de théorie

2.1. Les contrôles avec FormControl

2.2. Regrouper les contrôles avec FormGroup

2.3. Un comportement commun avec AbstractControl

2.4. Les validateurs

2.5. Combiner les validateurs

2.6. Valider un groupe de contrôle

2.7. Déclarer vos formulaires sous forme de tableaux

3. Construire un formulaire

3.1. Le FormBuilder

4. Développer une règle de validation personnalisée

5. Choisir entre formulaires pilotés par le template ou par le modèle

6. Conclusion

Chapitre 15 : La programmation réactive

8 Étapes

1. Tenir ses promesses

2. La programmation réactive

2.1. Qu’est-ce qu’un « flux » ?

2.2. Traitement des flux

3. La librarie RxJS

3.1. Les Observables

3.2. Observable ou Promesse ?

4. Conclusion

Chapitre 16 : Effectuer des requêtes HTTP standards

18 Étapes

1. Mettre en place le module HttpClientModule

2. Simuler une API Web

3. Mettre à jour notre service

3.1. Gestion des erreurs

3.2. Récupérer un Pokémon à partir d’un identifiant

3.3. Utiliser le service mis à jour

4. Modifier un pokémon

4.1. Une méthode de modification

4.2. Sauvegarder les données

5. Supprimer un pokémon

6. Ajouter un Pokémon

6.1. Ajouter une méthode POST

6.2. Un composant pour ajouter un Pokémon

6.3. Adapter notre modèle

6.4. Importer ce nouveau composant AddPokemon dans l’application

6.5. Adapter notre formulaire d’édition

6.6. Ajouter un lien vers le formulaire d’ajout

7. Conclusion

Chapitre 17 : Effectuer des traitements asynchrones avec RxJS

8 Étapes

1. Construire un champ de recherche

1.1. Un champ de recherche

1.2. Consommer un Observable

1.3. Les termes de la recherche

1.4. Initialiser un Observable

1.5. Afficher le champ de recherche

2. Ajouter une icône de chargement

3. Conclusion

Chapitre 18 : Authentification

5 Étapes

1. Un Guard

2. Mise en place d’un Guard

3. Vers un système d’authentification plus complet

4. Une page de connexion

5. Conclusion

Chapitre 19 : Déployer votre application

9 Étapes | 1 Questionnaire

1. Le processus de déploiement

2. Activer le mode production

3. Créer un livrable pour notre application

4. Déployer sur Firebase Hosting

5. Créer le projet dans Firebase

6. Installer la boîte à outil de Firebase

7. Configurer votre projet pour le déploiement

8. Déployer l’application

9. Conclusion

Questionnaire 3 : Aller plus loin avec Angular

Bonus

🎁 Bonus : Le Guide des Bonnes Pratiques Angular d’après Google

7 Étapes

1. Le principe de « Responsabilité Unique »

2. Les conventions de nommage

3. Les conventions de code

5. Les composants

6. Les services

7. La structure de l’application

8. Conclusion

1 de 2

Chapitre Suivante

Chapitre 1 : L’introduction indispensable à Angular

Angular : Développer votre première application Chapitre 1 : L’introduction indispensable à Angular

Félicitations ! 🎉

Vos 7 chapitres Angular viennent d’être débloqués !

Débloquer 12 Chapitres Supplémentaires

Et Accéder au Seul Livre sur Angular en Couleur et en Français >>>

Contenu de la Chapitre

0% Terminé 0/10 Etapes

1. Angular, c’est quoi ?

1.1. Site Web versus Application Web

2. Différences entre Angular et AngularJS

3. La philosophie d’Angular

4. Le fonctionnement global d’une application Angular

Retour à la/au Cours

Chapitre Suivante