Il ne s’agit pas vraiment d’un article, mais d’une liste présentant les principaux changements que j’ai apporté à mon cours pour la migration vers Angular 5.
Cette liste est destinée aux personnes ayant acheté le cours à jour avec Angular 5, et qui souhaite prendre connaissance des nouveaux éléments apportés par cette mise à jour, par rapport à la version du cours précédente, fonctionnant avec Angular 4.3.4.
Modifications globales
- Mise à jour de la démonstration en ligne pour Angular 5.
- Mise à jour de tous les extraits de code, disponibles à cette adresse.
- Création d’un nouveau dépôt sur Github. La correction des chapitres est maintenant accessible via des tags plutôt qu’avec des branches.
- Le chapitre sur les requêtes HTTP a été complétement réécrit pour utiliser le nouveau module HttpClientModule, plutôt que le module HttpModule.
- Le chapitre sur les tests a été supprimé. Il été trop incomplet et n’avait pas sa place dans un cours pour les débutants. A la place, de nouvelles fonctionnalités plus concrètes ont été ajoutées pour les lecteurs: authentification avec des identifiants, possibilité de supprimer un Pokémon via l’API, etc. Les tests avec Angular seront présentés dans un nouveau cours destiné à la maîtrise d’Angular.
- Pour beaucoup de chapitre, j’ai apporté des modifications mineures. Voici ce qui est englober par ce terme:
- Réecriture des parties présentant des Imprécisions;
- Correction des coquilles;
- Indentations identiques pour les extraits de code;
- Remplacement des quotes par des backquote pour tous les template;
- Modification de certains commentaires, dans les extraits de code;
- Mise à jour des numéros des versions des différents outils à installer : Npm / Node / TypeScript / Firebase-tools.
Chapitre 6 : Premiers pas avec Angular
- Mise à jour de la version de TypeScript pour fonctionner avec Angular 5.
- Mise à jour des fichiers de configuration systemjs.config.js et package.json.
- Mise en garde d’un bug relatif à l’utilisation de l’extension Chrome AdBlock avec la librairie Zone.js.
Chapitre 7 : Les templates
- Séparation des fichiers de composant *.ts et des fichiers de template *.html pour le composant AppComponent.
Chapitre 8 : Les directives
- Modification du nom de la directive pkmnBorderCard afin de respecter les conventions de nommage recommandés par Google : camelCase plutôt que underscore_case.
- Suppression de Renderer & Renderer2 car ces éléments étaient devenus inutiles et dépréciés.
- Ajout d’une nouvelle partie afin de paramétrer la couleur de la bordure de la directive avec l’annotation @Input.
- Ajout d’une seconde propriété pour définir une couleur par défaut aux bordures.
Chapitre 9 : Les pipes
- Quelques corrections mineures.
Chapitre 10 : Les routes
- Séparation du fichier du template et de la classe pour les composants ListPokemonComponent et DetailPokemonComponent.
- Remplacement de snapshot.params[‘id’] par paramMap.get(‘id’), pour la capture du paramètre de la route avec la nouvelle syntaxe d’Angular 5.
- Ajout d’une explication de la propriété route.snapshot.
- Mise à jour de la méthode goBack avec l’utilisation du service Location.
- Quelques corrections mineures.
Chapitre 11 : Les modules
- Séparation du fichier du template et de la classe pour tous les composants.
- Ajout d’une explication sur le débugage du routing avec l’option enableTracing.
- Quelques corrections mineures.
Chapitre 12 : Les services
- Ajout de l’élément Router dans le constructeur du composant DetailPokemonComponent.
- Quelques corrections mineures.
Chapitre 13 : Les formulaires pilotés par le template
- Ajout d’un opérateur facultatif « ? » pour éviter une requête 404 en console, lors du chargement de l’image d’un pokémon, en attendant la réponse l’API simulée.
- Ajout d’une méthode goEdit dans le composant DetailPokemonComponent.
- Mise à jour du code de la méthode isTypesValid du composant PokemonFormComponent, pour gérer le cas où aucun type n’a été sélectionné dans le formulaire.
- Quelques corrections mineures.
Chapitre 14 : Les formulaires pilotés par modèle
- Ajout d’un exemple d’utilisation et justification de l’utilisation du FormArray.
Chapitre 16 : Effectuer des requêtes HTTP
- Récriture complète du chapitre pour l’utilisation du module HttpClientModule.
- Utilisation systméatique des Observables plutôt que des Promesses. Toutes les méthodes du service PokemonsService ont été réécrites.
- Ajout d’une partie permettant de supprimer un Pokémon.
- Mise à jour de la partie sur le champ de recherche d’un Pokémon et de l’auto-complétion. Le code est plus concis et conforme avec les exigences d’Angular 5.
- Quelques corrections mineures.
Chapitre 17 : Authentification
- Ajout des champs « Name » et « Password » pour le formulaire de connexion à l’application.
- Quelques corrections mineures.
Chapitre 19 : Déployer votre application
- Mise à jour des fichiers de configuration pour le déploiement sur Firebase.
- Mise à jour des catures d’écran avec la nouvelle interface de Firebase.
- Rappel : Mise en garde d’un bug relatif à l’utilisation de l’extension Chrome AdBlock avec la librairie Zone.js.
- Quelques corrections mineures.
Annexes
- Quelques corrections mineures.