DNG Consulting est une société pionnière dans le domaine du développement d’application Web. Les récentes évolutions du Framework Angular sont une avancée majeure par rapport aux versions précédentes. L’utilisation du langage Typescript fortement typé et très proche de la syntaxe Java ou C# font de ce Framework un incontournable sur le marché. Cette formation s’adresse aux développeurs de tous bords souhaitant appréhender les nombreux concepts d’Angular.
Développer avec Angular
Mettre en oeuvre une application Web avec Angular 2
Audience
- Architectes
- Développeurs
- Chefs de projet
Pré-requis
Connaitre un peu JavaScript et le monde Web
Tarif et dates
Nous consulter
Durée
3 jours
Répartition
- Pratique
- Théorie
Objectifs
- Découvrir les bases du framework Angular
- Comprendre les mécanismes de composants et de binding
- Modifier et organiser un template
- Découvrir la programmation réactive et les concepts de promesse
Plan du cours
L’architecture Angular
- Principes et définition
- L’environnement de développement
- Le projet Angular
- Vue générale
- Notion de module
- @NgModule
- Librairies Angular
- Modules Angular et modules JavaScript
- Component
- Metadata
- Template
- Data Binding
- Directives
- Structural directive
- Attribute directive
- Service
- Services et components
- Injection de dépendance
TypeScript
- Principe
- Structures de contrôle
- Types et déclarations
- Les types de base
- Tableaux et Tuples
- Les types énumérés : enum
- Les types dans les Fonctions
- Any, Object, Void, Null, Undefined et Never
- Le contrôle de type
- Objets, classes et Interfaces
- Arrow functions
- Compatibilité des types
- Intersection de types (mixins)
- Union de types
- La déstructuration de listes
- Template
- Map et Set
- Decorateur
- Les Modules
- Introduction aux modules
- La déclaration d’export
- Import de module
- Préciser un export par défaut
- Les modules de définition de types
- Système de résolution des modules
- Processus de résolution des modules
La programmation réactive
- Concepts de programmation réactive
- La classe Observable
- Les opérateurs classiques
- Les opérateurs: un peu plus loin
- Conclusion RxJs et Angular
Les bases du Framework
Modules
- Principe des modules Angular
- Ng Module en pratique
- Bootstrapping du module principal
- Bootstrapping dans main.ts
Composants
- Les composants : définition
- Composants et directives ?
- Les composants : Angular CLI
Template
- La vue ou template
- Template: syntaxe HTML
- Template: exemple de composition
Data binding
- Le databinding
- Interpolation
- Binding de propriétés
- Binding de propriétés: targets particuliers
- Binding de propriétés: bonnes pratiques
- Gestion des évènements
- Gestion des évènements: $event et event bubbling
- Gestion des évènements: événements clavier
- Data binding bidirectionnel
Entrées-Sorties
- Les Entrées
- Les Sorties avec EventEmitter
- Communication parent-enfant: Variable locale
- Communication parent-enfant: @ViewChild
Directives
- Les directives d’attributs : NgStyle, NgClass, NgModel
- Les directives d’attributs : création
- Les directives structurelles : NgIf, NgFor, NgSwitch
- Les directives structurelles: <ng-container>
- Les directives structurelles: création
Styles
- Syntaxe
- Autres ajouts de style
- Sélecteurs spéciaux
- Encapsulation
Cycle de vie des Directives et Components
- Principe
- Les phases
Formulaires
- Gestion des formulaires: principe
- Gestion des formulaires: sous le capot
- Formulaires pilotés par le template Binding bidirectionnel
- Validateurs: formulaire par le template
- Formulaires pilotés par le code
- Validateurs personnalisés
- Validateur: les styles
Pipe et transformation
- Async, slice, lowercase, uppercase
- Pourcentages et dates
- Pipes personnalisés
L’Injection des dépendances
- Configurer un provider
- Class provider, Value et Factory providers
- Singletons
- Providers hiérarchiques
Le routage
- Principe de fonctionnement
- Configuration et Configuration avancée
- RouteurLink et API Route
- Paramètres dans les URLs
- Les observeurs et les routes
- Routage hiérarchique
- Guards: principe et mise en place
- Resolver: principe et mise en place
- Evenements de routage
- Les types de paramètre Url
- Propriétés de route
- Chargement à la demande: principe et mise en place
Service http
- Communication serveur
- HttpClient Module
- Les service HttpClient
- Gestion des erreurs
- HttpClient: un peu plus loin…
- Interceptor
- Règle « Same Origin Security Policy »
- Gestion du CORS
Le déploiement
- Un mot sur Webpack et SystemJS
- Mode « dev » et « prod »
- Lazy Loading
- Webpack, TreeShaking
- Compilation AOT (Ahead Of Time)
- Gestion du CORS
L'offre de DNG Consulting et son savoir-faire
DNG Consulting forme depuis plus de dix ans de nombreuses entreprises au travers de sessions intra-entreprises ou inter-entreprises.
Nos formateurs interviennent au quotidien sur des problématiques techniques au travers des projets de nos clients. La spécialité de DNG est l’accompagnement dans un contexte agile.
Pour plus de renseignements : formation@dng-consulting.com ou conseil@dng-consulting.com