Prenez contact avec nous

Plan du cours

Introduction

  • Qu'est-ce qu'Angular ?
  • Angular vs React vs Vue
  • Aperçu des fonctionnalités et de l'architecture d'Angular 17
  • Configuration de l'environnement de développement

Premiers pas

  • Création d'un nouveau projet Angular 17 à l'aide d'Angular CLI
  • Exploration de la structure du projet et des fichiers
  • Exécution et mise en service de l'application
  • Affichage des données à l'aide de l'interpolation et des expressions

Composants

  • Compréhension du rôle des composants dans Angular 17
  • Création et utilisation des composants
  • Transmission de données entre les composants à l'aide des entrées (inputs) et des sorties (outputs)
  • Utilisation des cycles de vie des composants

Directives

  • Compréhension de la différence entre les directives structurelles et les directives d'attribut
  • Création et utilisation des directives intégrées telles que ngIf, ngFor, ngSwitch, etc.
  • Création et utilisation des directives personnalisées

Tuyaux (Pipes)

  • Compréhension de l'utilité des tuyaux dans Angular 17
  • Création et utilisation des tuyaux intégrés tels que date, currency, json, etc.
  • Création et utilisation des tuyaux personnalisés

Services

  • Compréhension du rôle des services dans Angular 17
  • Création et utilisation des services
  • Injection de dépendances à l'aide des fournisseurs (providers)

Modules

  • Compréhension du rôle des modules dans Angular 17
  • Création et utilisation des modules
  • Importation et exportation de modules

Liaison de données

  • Compréhension de la différence entre la liaison de données unidirectionnelle et bidirectionnelle
  • Création et utilisation de la liaison de propriétés, de la liaison d'événements et de la syntaxe « banana-in-a-box »
  • Utilisation des variables de référence de modèle

Routage

  • Compréhension du rôle du routage dans Angular 17
  • Création et configuration des routes
  • Navigation entre les routes à l'aide de routerLink et de router.navigate()
  • Utilisation des paramètres de route, des paramètres de requête et des fragments

Formulaires

  • Compréhension de la différence entre les formulaires pilotés par le modèle et les formulaires réactifs
  • Création et validation des formulaires à l'aide des contrôles de formulaire, des groupes de formulaires, des tableaux de formulaires, etc.
  • Utilisation des validateurs intégrés tels que required, minLength, maxLength, etc.
  • Création et utilisation des validateurs personnalisés

Client HTTP

  • Compréhension du rôle du client HTTP dans Angular 17
  • Création et utilisation des requêtes HTTP pour communiquer avec les services backend
  • Utilisation des observables pour gérer les flux de données asynchrones
  • Utilisation des intercepteurs pour modifier ou gérer les requêtes ou réponses HTTP

Nouveau flux de contrôle déclaratif

  • Explication de la nouvelle syntaxe de bloc de contrôle de modèle et de la manière dont elle simplifie les tâches courantes telles que le rendu conditionnel, les boucles et la gestion des collections vides
  • Présentation d'exemples d'utilisation des nouveaux blocs, tels que @if, @else, @switch, @case, @default, @for et @empty
  • Comparaison de la nouvelle syntaxe avec l'ancienne, telle que *ngIf, *ngSwitch et *ngFor
  • Mention de la manière dont les nouveaux blocs de contrôle prennent en charge les applications sans zones (zoneless) avec des signaux

Blocs de chargement différé

  • Explication du concept de chargement différé et de la manière dont il peut améliorer les performances et l'expérience utilisateur des applications web
  • Présentation du nouveau bloc de contrôle @defer qui permet le chargement différé du contenu du bloc et de ses dépendances
  • Présentation d'exemples d'utilisation du bloc @defer pour différents scénarios, tels que le chargement de composants, de directives, de tuyaux, d'animations et de styles
  • Mention de la manière dont le bloc @defer fonctionne avec la nouvelle API des transitions de vue

API des transitions de vue

  • Explication de l'utilité et des avantages de l'API des transitions de vue, qui permet aux développeurs de personnaliser les animations et les transitions entre les vues
  • Présentation de la nouvelle directive withViewTransitions qui permet l'utilisation de l'API des transitions de vue
  • Présentation d'exemples d'utilisation de la directive withViewTransitions avec différents types de transitions, tels que fade (estompage), slide (glissement), zoom et flip (retournement)
  • Mention de la manière dont l'API des transitions de vue fonctionne avec le routeur Angular et l'historique du navigateur

Autres fonctionnalités et améliorations

  • Résumé bref de certaines des autres fonctionnalités et améliorations qu'offre Angular 17, telles que :
  • Prise en charge de la transmission des styles de @Component sous forme de chaîne
  • Le code d'animation d'Angular est chargé de manière différée
  • Prise en charge de TypeScript 5.2
  • L'API de signal du noyau est désormais stable
  • Le support de Node.js v16 a été supprimé et la version minimale prise en charge est v18.13.0
  • Esbuild sera le constructeur par défaut et le serveur de développement par défaut utilisera Vite

Résumé et prochaines étapes

Pré requis

  • Une compréhension du HTML, du CSS et du JavaScript
  • Une expérience avec TypeScript et RxJS
  • Une expérience en développement web

Audience

  • Développeurs souhaitant apprendre à utiliser Angular 17 pour créer des applications web dynamiques et réactives
  • Développeurs souhaitant mettre à jour leurs compétences par rapport aux versions précédentes d'Angular
  • Programmateurs souhaitant explorer les nouvelles fonctionnalités et améliorations d'Angular 17
 28 Heures

Nombre de participants


Prix par participant

Nos clients témoignent (2)

Cours à venir

Catégories Similaires