Son astuce pour mieux se former

Plonge dans une interview inspirante et condensée de Gérôme Grignon, développeur frontend passionné et figure incontournable de la communauté Angular francophone.

Dans cet échange, Gérôme partage son parcours, ses conseils d'apprentissage, sa vision d'Angular et sa réflexion sur l'usage de l'IA dans le développement web.

S'abonner à la chaîne @angular_fr
Angular

Appearance

Vous souhaitez recevoir de l'aide sur ce sujet ? rejoignez la communauté Angular.fr sur Discord.

Nouveautés d'Angular 21 (19 novembre 2025) ​

Quel moment passionnant pour être développeur ! Avec tous les progrès enthousiasmants de l’IA dans le développement Web, il semble que les développeurs vivent une nouvelle aventure chaque jour. Cela correspond parfaitement au thème de l’événement de lancement de la sortie v21, qui offre une vue d’ensemble de ce que la version 21 d’Angular propose de meilleur.

Avec la sortie de v21, Angular devient un partenaire encore plus précieux pour vos aventures quotidiennes — vous offrant la stabilité du framework Angular tout en vous permettant de créer de superbes applications alimentées par l’IA, évolutives et accessibles à tous.

Angular v21 apporte de nombreux outils très attendus à ajouter à votre boîte à outils, et garantit une excellente expérience développeur, que vous codiez avec des agents et une assistance IA ou que vous préfériez écrire, déboguer et tester votre code uniquement avec votre IDE.

Quelques points forts :

  • Les développeurs d’Angular lancent les Signal Forms en version expérimentale, offrant une nouvelle expérience de formulaires réactive, composable et scalable, construite sur les Signals.
  • Angular Aria arrive en Developer Preview : des composants headless accessibles, totalement personnalisables.
  • Vos agents IA peuvent utiliser le serveur MCP d’Angular, désormais doté de sept outils stables et expérimentaux — permettant aux LLM d’utiliser les nouvelles fonctionnalités Angular dès leur sortie.
  • Le CLI Angular intègre Vitest comme test runner par défaut, désormais stable et prêt pour la production.
  • Les nouvelles applications Angular n’incluent plus zone.js par défaut !
  • Et bien plus encore — plongeons directement dedans !

Les Signal Forms expérimentaux sont là ​

Les développeurs d’Angular sont heureux d’annoncer que vous pouvez désormais essayer les Signal Forms, une bibliothèque expérimentale permettant de gérer l’état des formulaires en s’appuyant sur les fondations réactives des Signals.

Avec Signal Forms, le modèle du formulaire est défini par un signal synchronisé automatiquement avec les champs du formulaire auxquels il est lié, offrant une expérience ergonomique avec une sécurité de type complète. Une validation puissante, centralisée et basée sur des schémas est intégrée 🎉

ts
import { form, Field } from '@angular/forms/signals';

@Component({
  imports: [Field],
  template: `
    Email: <input [field]="loginForm.email">
    Password: <input [field]="loginForm.password">
  `
})
export class LoginForm {
  login = signal({
    email: '',
    password: ''
  });
  
  loginForm = form(this.login);
}

Vous pouvez ensuite lier les champs dans le template via [field]. Les schémas de validation classiques (email, regex…) sont intégrés, et les validateurs personnalisés permettent d’aller encore plus loin.

Plus besoin de ControlValueAccessor : la liaison avec les composants personnalisés est entièrement signal-based.

Les développeurs d’Angular vous invitent à consulter le guide essentiel des Signal Forms et la documentation complète.

Des composants accessibles — à votre style, avec Angular Aria ​

L’équipe Angular est ravie d’annoncer la Developer Preview de Angular Aria, une bibliothèque moderne de composants headless pour les patterns UI les plus courants. L’accessibilité est la priorité numéro un de cette bibliothèque.

Vous disposez de 8 patterns regroupant 13 composants complètement non stylés, prêts à être personnalisés :

  • Accordion
  • Combobox
  • Grid
  • Listbox
  • Menu
  • Tabs
  • Toolbar
  • Tree

Angular Aria utilise les directives modernes d’Angular, est basé sur les signals, et repose sur l’expérience approfondie des développeurs d’Angular en matière de composants accessibles.

Angular Aria

Installation :

npm i @angular/aria

L’équipe Angular fournit également un guide complet avec exemples et skins prêts à copier-coller.

Plus d’outils pour vos agents IA — avec le serveur MCP d’Angular ​

Les développeurs d’Angular souhaitent fournir les bons outils pour l’ère de l’IA. Le serveur MCP intégré au CLI depuis la v20.2 est désormais stable.

Ce serveur donne aux agents IA une compréhension du contexte Angular moderne et leur permet :

  • De récupérer du contexte

    • get_best_practices : guide des bonnes pratiques
    • list_projects : liste des projets Angular du workspace

  • De trouver des informations à jour

    • search_documentation : interroge la documentation officielle
    • find_examples : donne des exemples actuels de patterns Angular

  • De mettre à jour une application

    • onpush_zoneless_migration : plan de migration vers OnPush + zoneless
    • modernize : migrations via schematics

  • D’apprendre Angular

    • ai_tutor : tuteur interactif IA

Grâce au serveur MCP, les agents IA ne sont plus limités par leur date d’entraînement : ils peuvent utiliser immédiatement les fonctions les plus récentes (Signal Forms, Angular Aria…).

MCP

Vitest devient le test runner par défaut ​

Depuis la dépréciation de Karma en 2023, l’équipe Angular a étudié plusieurs solutions (Jest, Web Test Runner, Vitest). Les retours de la communauté ont conduit les développeurs d’Angular à choisir Vitest comme nouvelle solution officielle, désormais stable en v21 🎉

Vitest

Exécution :

ng test

Migration :

ng g @schematics/angular:refactor-jasmine-vitest

Le support Vitest étant désormais stable, l'équipe Angular a décidé de déprécier le support expérimental pour Web Test Runner et Jest et prévoit de les supprimer dans la version 22. Les équipes qui souhaitent continuer à utiliser Jest peuvent envisager l'une des alternatives existantes proposées par la communauté, telles que jest-preset-angular et le plugin Nx Jest.

Zoneless est prêt pour le prime-time ​

Angular reposait historiquement sur zone.js pour détecter les changements. Ce mécanisme, bien que pratique, peut devenir coûteux en performance.

Avec les Signals, zone.js n’est plus nécessaire. Le zoneless, introduit en v18 et stabilisé en v20.2, devient le comportement par défaut dans les nouvelles applications Angular v21.

Ses avantages :

  • meilleures Core Web Vitals
  • async/await natif
  • meilleure compatibilité écosystème
  • bundle plus léger
  • débogage simplifié
  • contrôle plus fin

Un outil MCP (onpush_zoneless_migration) peut générer un plan de migration détaillé.

Les développeurs d’Angular tiennent à remercier chaleureusement l’équipe de zone.js, en particulier Jia Li, pour des années de contributions essentielles.

Une nouvelle expérience de documentation ​

Le site angular.dev a été largement modernisé pour refléter les concepts récents.

Les développeurs d’Angular ont ajouté :

  • une nouvelle section angular.dev/ai dédiée aux applications Angular + IA
  • un nouveau tutoriel complet Signals
  • une refonte totale de la documentation sur le routing
  • une amélioration profonde des guides d’injection de dépendances
  • un guide complet sur le theming Material
  • un guide complet sur Angular + Tailwind CSS

Votre agent IA peut accéder à ces contenus via l’outil MCP search_documentation.

Et bien plus encore… ​

Parmi les autres améliorations livrées par les développeurs d’Angular :

  • mise à jour de CLDR (v41 → v47)
  • support des regex dans les templates
ts
@let isValidNumber = /\d+/.test(someValue);

@if (!isValidNumber) {
  <p>{{someValue}} is not a valid number!</p>
}
  • nouveau Signals formatter intégré au navigateur

Signals formatter

  • personnalisation des options IntersectionObserver pour @defer
ts
@defer (on viewport({trigger, rootMargin: '100px'}) {
  <section>Content</section>
}
  • SimpleChanges devient générique
  • KeyValue pipe gère mieux les clés optionnelles
  • nouvelles classes utilitaires Material Design
  • CDK overlays utilise les popovers natifs
  • nouvelles API d’animation, améliorations du Drag&Drop, outils DevTools, etc.

Angular ♥️ sa communauté ​

Depuis la v20, 215 contributeurs ont participé au code Angular. Les développeurs d’Angular mettent en avant de nombreuses contributions importantes (migrations, diagnostics, DevTools, CDK, Vitest…).

Les développeurs d’Angular remercient chaleureusement la communauté.

Mise à jour de la mascotte ​

La communauté avait été consultée pour une nouvelle mascotte en v20. L’annonce officielle aura lieu lors de l’événement de lancement le 20 novembre 2025.

À vous de construire la prochaine génération d’applications ​

Les développeurs d’Angular sont fiers de cette version, mais ce n’est qu’une étape dans l’évolution du framework.

Des fonctionnalités comme Signal Forms et Angular Aria témoignent de l’engagement continu à offrir une API moderne pour la construction d’applications web fiables et scalables.

Exécutez ng update et créez des applications que vos utilisateurs vont adorer.

Source

Source et traduction française de Angular v21