Développer avec Angular

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.

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

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