Angular 2+ - Développement d'applications web
Angular 2+ - Développement d'applications web
Informatique > Développement web et mobilité
Objectifs
- Maîtriser les fondamentaux du Framework Angular et ses nouveautés.
- Organiser, modulariser et tester ses développements JavaScript.
- Savoir développer plus rapidement et tester des applications web Angular 2 avec JavaScript et TypeScript.
- Connaître les bonnes pratiques de développement et de mise en production.
- Découvrir les spécifications EcmaScript 6 (ES6).
- Savoir intégrer les tests unitaires au développement.
Le programme de la formation
Introduction
ES2022, le nouveau JavaScript
ES2022 et les modules
TypeScript : le typage du JavaScript
Les bases du Framework
Comprendre la philosophie du framework
Templating
Angular CLI, un outil pour tout générer
Atelier : Première application et outillage
Composant
Web Components
Décorateurs Angular
Property binding, lire des données depuis le composant
Event binding, événements personnalisés
Cycle de vie
Atelier : Développer un premier composant
Utiliser les directives
Directive : fonctionnement et création
Les directives fournies par Angular
Attribute directives
Structural directives
Directives complexes
Atelier : Première directive
Directives
Directives d’attributs (selecteur, ElementRef, HostListener, @Input)
Directives de structure (ngIf, ngFor, Symbole *)
ng-template
Modules
Déclarations d’un module : imports et exports
Les providers d’un module
Introduction à « forRoot » et « forChild »
Atelier : Créer un module, l’exporter et le réutiliser
Pipes
Les transformateurs fournis
Formater une chaîne
Formater des collections
Utiliser un pipe comme un service
Atelier : Créer son propre pipe
Services
Les services fournis
Création de service
Injection d’un service
Atelier : Injecter les services fournis par Angular
Injection de dépendances
Principes
Configurer son application
L’injection de dépendances : type-based et hiérarchique
Différents types de providers
Atelier : Créer ses propres services
Routeur
RouterModule: Configuration des routes et URLs
Définitions des routes, liens et redirection, paramètres
Hiérarchies de routes
Vues imbriquées
Cycle de vie (Routing lifecycle)
Atelier : Transformer une application Web en Single Page Application
Observables
Introduction à RxJS
Le concept d’Observable
Les principaux opérateurs
Lien avec les promesses
Atelier : Premier pas avec RXJS
Échanger avec un serveur
Requêtes HTTP
Communication avec une API
Afficher des données externes
Afficher des données asynchrones avec AsyncPipe
Atelier : Récupérer et afficher des données à partir d’une API REST distante
Travailler avec des formulaires
Créer un formulaire
Template-driven forms
ngModel
Reactive forms
Validation et erreurs
Observateurs
Atelier : Créer ses propres validateurs, envoyer une requête POST
Gestion des performances
Astuces, bonnes pratiques et outils
Découverte des différentes stratégies de compilation
Atelier : Tester et optimiser la performance
Concepts avancés
Animations
Nouveautés d’Angular 16
Injection de dépendances avancée (IoC)
Test unitaire
Public et Pré-requis de la formation
Architectes, Développeurs, Chefs de projets...
Disposer de connaissances pratiques sur les technologies du Web, les outils actuels de développement Front-End et JavaScript.
Méthode pédagogique de la formation
Une pédagogie basée sur l'alternance de phases théoriques, d'ateliers de mise en pratique, de retours d'expériences et de séances d'échanges.
A travers les TP proposés, les participants acquièrent une première expérience concrète du développement d'applications web sur Angular 2+.
Des experts du framework qui partagent leurs trucs et astuces pour développer plus rapidement.
Angular 2+ correspond à toutes les versions successives d'Angular, soit de la version 2 à la version 16.