Angular 16 et versions antérieures – Développement d’applications Web

Objectifs pédagogiques

• Utiliser la version 16 du framework Angular
• Développer et tester complètement une application
• Appliquer les bonnes pratiques de développement

Programme

Jour 1 – Matin

• Architecture, installation et premier test
• Architecture typique d’une application Angular
• Installation minimale d’Angular
• Test d’un code simple
• TypeScript
• TypeScript : le JavaScript typé
• Les types, classes et modules
• L’asynchrone et les promesses
• Rôle majeur des composants
• Définition d’un composant Angular
• Décorateurs
• Les vues
• Le modèle
• Exemples de travaux pratiques (à titre indicatif)
• Création d’une application et analyse du code généré

Jour 1 – Après-midi

• Une première application Angular
• Démarrer « from scratch » avec Angular CLI
• Création d’un premier projet
• Exemples de travaux pratiques (à titre indicatif)
• Avec Angular CLI, création d’une application et analyse du code généré, modification des composants
• Les templates
• Utiliser l’interpolation
• Property et event bindings
• Utiliser des variables locales
• Utilisation des pipes
• Les services
• Création de services
• Injection de services
• Exemple de travaux pratiques (à titre indicatif)
• Travaux d’interpolation sur diverses zones d’affichage en relation avec les données métier alimentées via des services

Jour 2 – Matin

Les formulaires

• Création de formulaires avec :
• Le FormsModule
• Le FormBuilder
• Validation et gestion des erreurs
• Exemples de travaux pratiques (à titre indicatif)
• Ajout de formulaires d’affichage et de saisie en utilisant FormsModule et FormBuilder

Jour 2 – Après-midi

• Rôle de RxJS (Reactive extensions for JavaScript)
• Présentation des flux de données asynchrones
• Propagation des changements avec RxJS
• Travail avec HTTP
• Le service HTTP
• Communication avec une API en asynchrone
• Exemples de travaux pratiques (à titre indicatif)
• Appel asynchrone à des API externes, intégration à un service Angular

Jour 3 – Matin

• Le routage
• Les différentes versions du module de routage
• Fonctionnement du routage
• Configurer des routes et utiliser les directives
• Exemple de travaux pratiques (à titre indicatif)
• Ajout des tables de routage dans l’application Angular

Jour 3 – Après-midi

• Les « standalone components »
• Présentation du concept des composants autonomes
• Les avantages de l’utilisation de composants autonomes
• Présentation des meilleures pratiques pour créer et utiliser des composants autonomes
• Les tests
• Présentation de Jasmine et Karma
• Exemple de travaux pratiques (à titre indicatif)
• Utilisation d’un outil de test

Le contenu de ce programme peut faire l’objet d’adaptation selon les niveaux, prérequis et besoins des apprenants.