Prochaines sessions
- Le 04/11/2020
Objectifs
- Découvrir les fonctionnalités & les nouveautés du Framework Angular 8
- Savoir développer une nouvelle application Web avec Angular 8
- Savoir concevoir une application Angular 8 avec JavaScript et Typescript 3.1
- Connaître les mécanismes avancés du Framework
Pré requis
- Connaissance de JavaScript ou Typescript, html, CSS
Modalités pédagogiques
Cours dispensé en mode présentiel avec une alternance d’apports théoriques et méthodologiques, et de mises en situations pratiques
Public visé
- Chefs de projet Web, Architectes techniques, Développeurs front-end
Inscription
Programmes de Angular 8 et 9
Introduction
- ES6, le nouveau JavaScript
- ES6 et les modules
- TypeScript 3, le typage du JavaScript
Les bases du Framework
- Comprendre la philosophie du Framework
- Templating
- Angular CLI, un outil pour tout générer
Les nouveautés d’Angular 9, 8, 7, 6 et 5
- ng add / ng update : configuration & migration automatique
- Build avec le compilateur Bazel
- Angular Elements
- Angular Material + CDK Components
- Progressive Web App (PWA)
- Versions : RxJS 6 & Support de TypeScript 3.1
- Ivy
Composant
- Web Components
- Décorateurs Angular
- Property binding, envoyer des données au composant
- Event binding, évènements personnalisés
Directives
- Directive : fonctionnement et création
- Les directives fournies par Angular
- Attribute directives
Modules
- Déclarations d’un module : imports et exports
- Les providers d’un module
Pipes
- Les transformateurs fournis
- Formater une chaîne
- Formater des collections
Injection de dépendances (IOC)
- Principes
- Configurer son application
- L’injection de dépendances : type-based et hiérarchique
- Différents types de providers
Router
- RouterModule: Configuration des routes et URLs
- Définitions des routes, liens et redirection, paramètres
- Hiérarchies de routes
- Gérer les Resolver
- Gérer les Guards
Observables & Services
- Introduction à RxJS
- Le concept d’Observable
- Principales opérations sur les observables
- Lien avec les promesses
Échanger avec un serveur
- Requêtes HTTP
- Communication avec une API
- Afficher des données externes
- Afficher des données asynchrones avec AsyncPipe
Formulaire
- Créer un formulaire
- Template-driven forms
- ngModel
- Reactive forms
- Validation et erreurs