Développement JavaScript : rappels
- Bonnes pratiques ECMAScript 5.
- ES7/ES6/ES2015, présentation générale.
- Nouveautés syntaxiques : portée, "template string", "arrow functions", les promesses...
- Le développement JavaScript Objet avec la syntaxe de class.
- Le pattern observer/observable (ES7).
- La librairie RX.js : opérateur clés pour la manipulation d'observable.
- Outils indispensables. Babel, Traceur et Typescript.
- Typescript en détail, configuration.
- ES6/2015 approche modulaire.
- ES7 gestion de l'asynchronicité : await async.
- "Modules Loaders" : Webpack, "import/export".
Travaux pratiques
Migrer un script ES5/ES6.
Mise en œuvre de l'environnement avec TypeScript.
Migrer d'AngularJS 1.x à Angular
- Comparaison et "topographie" des concepts.
- Préparer la migration. Structure d'une application Angular.
- Les modules Angular, "core" et principaux modules.
- Principe de l'injection de dépendance.
- Classification des directives : composant, attribut, structure.
- Les décorateurs : définition des hiérarchies.
Démonstration
Migrer une application AngularJS 1.x vers Angular.
L'utilitaire ng ou @angular/cli
- Utilisation de l'utilitaire en ligne de commande.
- Scaffolder une structure de projet : anatomie et dépendance.
- Configuration des utilitaires de tâches.
- Configuration et commandes clés.
- Lancer un server de développement/production (build).
- Compilation Ahead of Time. La notion de "Tree Shaking".
- Gestion des modules : bonnes pratiques.
- BootStrap d'application.
Travaux pratiques
Structurer, "scaffolder" un projet d'application.
Définition de composants
- Comprendre les Web Components. (standard, concepts, shadow DOM, scoped CSS...).
- Cycle de vie dans l'application.
- Angular Compiler : Change Detection.
- Syntaxe des templates : interpolation/expression, "Binding" et filtres.
- Directives de transformation : ngIf, ngFor, ngSwitch...
- Définition syntaxique, le symbole (*).
- Variables locales et variables de Template.
- Classe de composants. Directives de configuration : selector, provider.
- Evénements utilisateur et événements logiques personnalisés : EventEmitter.
Travaux pratiques
Création de composants.
Classifications des composants applicatifs
- Module, RouterModule, SharedModule.
- Component, Directive, Pipe, Service, Guard.
- Principe de l'injection de dépendances.
- Création de services injectables. Classification des services.
- Configuration de l'injecteur.
- Les décorateurs et leurs propriétés en détails.
- @Host, @ContentChild, @ViewChild.
- JavaScript Pure function, PurePipe.
Travaux pratiques
Création de composants et de directives personnalisées.
Gestion des formulaires, "Routing" et requête HTTP
- FormControl et FormGroup.
- TDF versus DDF : Template Driven Form et Data Driven Form
- Validation et gestion d'erreur personnalisée.
- Liaison de données via HTTP.
- Gestion et configuration des échanges HTTP au niveau applicatif.
- Création de routes.
- Intercepter les paramètres de routage et wildcard.
- Ciblage, "router-outlet" événements de routage.
- Gestion de routes dans l'arbre des composants.
- Configuration des "Guard" pour le l'initialisation des routes.
Travaux pratiques
Mise en œuvre des cycles de validation de formulaire. Consommation d'une API REST.
Tests unitaires. Bonnes pratiques et outils
- Configurer l'environnement de test.
- Présentation de Karma et de Jasmine.
- Ecrire les tests avec Jasmine.
- Ecrire des tests d'intégration avec protractor.
- Couverture du code. Indices du code-coverage.
- BDD Behaviour Driven Developpemnt, TDD Test Driven Developpement.
- Cas de test : pipe, composant, application.
- Angular "Coding guide Style".
Travaux pratiques
Développement d'une application à partir de tests unitaires. Mise en œuvre du Test Driven Developpement.