Apprendre Angular, un pas à la fois.
Des articles clairs, pratiques, et sans blabla, pour apprendre Angular comme on code vraiment et suivre sa communauté.
87 articles trouvés
Sujets populaires
13 juillet 2026
Ton composant affiche le détail du mauvais utilisateur quand tu cliques vite. Ce n'est pas un bug d'Angular. C'est une race condition classique que resource() promet de tuer... à condition d'utiliser son abortSignal. Voici les 4 pièges qui te ramènent au point de départ.
10 juillet 2026
Ton Form fournit un Validation. Ton Field l'injecte. Ça marche en interne, ça pète en NG0201 quand le Field est projeté via ng-content. La différence entre providers et viewProviders tient en une règle de 3 lignes, et elle change la surface DI complète de ton composant. Démonstration, explication de la résolution, 4 patterns à connaître.
8 juillet 2026
Tu actives le SSR, ton app fonctionnait très bien. Puis `ReferenceError: window is not defined` au premier build. Ou pire : ça build, mais ton API est refetchée, tes observers restent actifs côté serveur et ton bundle SSR gonfle. Voici les 4 erreurs Angular 17+ qui te piègent avec `window` / `document` / `localStorage` et le fix propre avec `PLATFORM_ID`, `DOCUMENT` et `afterNextRender`.
6 juillet 2026
Tu poses un <ng-content> dans ton composant Card et tu penses que c'est réutilisable. Sauf que le slot vide casse ton layout, l'ordre de tes select te joue des tours, un <ng-container> disparait dans un slot à sélecteur de tag, et détecter un slot vide te force à toucher au DOM. 6 patterns concrets, tous vérifiés en test, avec du signal-based contentChild pour boucler proprement en Angular 20+.
6 juillet 2026
Coller le reset global qui met toutes les animations à 0.01ms te donne bonne conscience, mais il rate deux choses : la motion qui portait du sens disparaît d'un coup, et tout ce qui est animé en JS ou par Angular passe à travers le filet. Faire prefers-reduced-motion correctement, ancré sur du vrai code Angular 21.
5 juillet 2026
Un @theme qui empile 40 couleurs à plat, c'est du drift garanti : chaque composant consomme la palette brute et re-thémer devient un chercher-remplacer. La vraie architecture tient en deux couches, primitives et sémantiques, et ce repo la fait tourner en prod pour thémer trois produits d'un seul point.
3 juillet 2026
Chaque fois que tu ajoutes un effect() ou un [class.x] pour réagir à l'état du DOM, tu écris du JavaScript que le CSS ferait mieux. :has() style un parent selon ses enfants, sans listener, sans hydratation, dès le SSR. Cinq patterns concrets, ancrés sur du vrai code Angular 21.
3 juillet 2026
Tu actives View Transitions API dans le router Angular, tu vois un flash, tu penses que ça marche. Ça ne marche pas. Voici les 6 pièges qui font que 90% des devs qui essaient View Transitions abandonnent au bout d'une heure, et le pattern minimal pour des transitions natives fluides sans dépendance tierce.
1 juillet 2026
Une app multi-marques qui charge les 30 thèmes CSS après le login alors qu'un user n'en verra qu'un seul. On est passés de 6,5 Mo à 4 Mo de bundle initial en lazy-loadant la feuille de la marque active. Voici la ligne de décision entre token-swap global et lazy-load, et le code Angular 17+ qui va avec (resolver, injection de link, FOUC, SSR).
1 juillet 2026
Tu construis un DataTable, un Select ou un Autocomplete réutilisable avec projection de template. Ça marche, mais dans le template consumer, tout est typé any. Voici comment récupérer un context strictement typé grâce à ngTemplateContextGuard, aux composants génériques et aux signal inputs.
1 juillet 2026
Coller les styles d'un composant Angular en template literal, c'est confortable, mais Stylelint qui tourne sur *.css ne les voit jamais : CI verte pendant que 29 composants accumulent px et hex. L'arbitrage inline vs .css externe, et comment linter le CSS-in-TS.
1 juillet 2026
Sur un gros projet Angular avec des devs qui tournent et une majorité de profils back, tu passes tes revues à répéter les mêmes remarques CSS : px au lieu de rem, hex en dur au lieu des tokens. Voici comment Stylelint transforme ces conventions en règles qui échouent la CI, avec la config exacte (px, hex, fonts) et le piège Tailwind v4 à désamorcer.
29 juin 2026
Tes services Angular sont bourrés de BehaviorSubject ? La moitié n'a plus aucune raison d'exister depuis les signals. Voici 4 patterns de refacto et les 2 cas qui restent légitimes en RxJS.
26 juin 2026
Optional, self, skipSelf, host. Quatre options de `inject()` qui changent radicalement la façon dont Angular résout tes dépendances. La plupart des devs n'en utilisent qu'une (optional) et passent à côté de 3 patterns qui débloquent les bugs de DI les plus tenaces.
24 juin 2026
Tu mélanges Signals et RxJS dans le même composant et un coup sur deux ton state se met à clignoter, à renvoyer undefined ou à manquer une valeur synchrone. Six pièges d'interop bien réels avec toSignal() et toObservable(), avec le pattern qui fixe chaque cas. Valide Angular 17+.
20 juin 2026
NG0100 ExpressionChangedAfterItHasBeenCheckedError : pourquoi cette erreur Angular surgit en dev, ce qui change en zoneless (v21) et comment la corriger.
19 juin 2026
Tu skips l'auth avec un header X-Skip-Auth que ton interceptor lit puis supprime ? Tu désactives ton loader avec un meta non typé passé en query string ? HttpContext résout ça depuis Angular 12 : des tokens typés, scopés à une requête, lus dans n'importe quel interceptor fonctionnel. 5 patterns concrets, le before/after, et comment tester.
18 juin 2026
parse() lance une exception, safeParse() retourne un résultat typé. Quand choisir l'un ou l'autre en Angular : API, HttpClient, httpResource, formulaires.
17 juin 2026
Ton SSR rend la page côté serveur, puis ton client refetch la même API au mount. Bravo, tu paies deux fois et ton Time To Interactive prend 800ms dans la tronche. Voici les 4 erreurs Angular 17+ qui causent le double-fetch en SSR et comment chaque correction prend moins de 5 lignes.
17 juin 2026
Vitest config Angular : anatomie de vitest.config.ts, fichier test-setup, environnement jsdom, couverture v8 et seuils. Le guide complet pour bien configurer.
17 juin 2026
Karma to Vitest : pourquoi et comment migrer tes tests Angular vers Vitest. Équivalences Jasmine, builder officiel, pièges zoneless et tableau comparatif.
16 juin 2026
Ton guard avec un appel HTTP fonctionne quand tu navigues par les liens, et part en 404 quand tu colles l'URL directement ? Tu l'as mis dans canMatch au lieu de canActivate. Les deux ne tournent pas dans la même phase du Router, et l'un échoue en silence. Explication, signature de diagnostic, et le before/after qui répare.
16 juin 2026
Ton spinner de navigation tourne à l'infini sur un guard qui refuse ? Ton resolver annule la navigation en silence et personne ne comprend pourquoi ? Le cycle d'events du Router Angular explique tout : la séquence complète, ce qui interrompt la nav, et les 3 cas d'erreur. Avec le pattern de loader qui ne te lâche jamais.
12 juin 2026
Le track de @for n'est pas un détail cosmétique : c'est ce qui décide si Angular réutilise tes lignes ou les recrée toutes à chaque changement. 5 erreurs classiques qui transforment une liste fluide en diaporama, avec le before/after qui te rend les 60 FPS.
10 juin 2026
Angular 19 a introduit provideAppInitializer et marqué le vieux token APP_INITIALIZER deprecated. Plus de useFactory, plus de deps array typé any, plus de double lambda : un callback qui tourne en contexte d'injection, avec inject() qui marche directement. Migration complète en 4 minutes, avec les pièges qui restent.
7 juin 2026
Create et edit qui se ressemblent à 90 % : un seul composant avec un mode, ou deux ? La réponse avec Signal Forms (Angular 22), un critère de décision binaire et un pattern qui supprime les if(mode).
5 juin 2026
Tes guards sont encore des @Injectable() avec un constructor de 4 paramètres ? Tes interceptors sont enregistrés via HTTP_INTERCEPTORS multi: true ? Tu écris du code Angular 14. Voici 5 raisons concrètes (bundle, tests, composition) de passer en fonctionnel, avec le before/after qui va bien.
5 juin 2026
Tu colles un computed() à chaque fois que t'as besoin d'une expression dérivée dans ton template. Sauf que 80% du temps, c'est juste de l'affichage qui n'a rien à faire dans le TypeScript. @let, stable depuis Angular 19, fait le boulot dans le template avec un type narrowing propre et zéro boilerplate. 5 patterns concrets pour nettoyer ton code.
5 juin 2026
Angular 22 introduit @Service, un décorateur plus ergonomique que @Injectable pour 90% de tes services. Singleton root par défaut, inject() obligatoire, scoping via autoProvided. On compare les deux ligne par ligne, et on voit les cas où @Injectable reste indispensable.
5 juin 2026
knip détecte fichiers, dépendances et exports morts en un seul outil. Mais sur un projet Angular SSR + Nx, le run brut flag tes entrypoints serveur et ton tooling. Voici la config qui sépare le signal du bruit, tirée d'un cas réel.
3 juin 2026
Angular 22 est sorti et signe la fin des expérimentations : OnPush par défaut, Signal Forms stables, FetchBackend par défaut, décorateur @Service, injectAsync, outils MCP, et un gros ménage d'APIs legacy. On passe tout en revue, avec du code.
2 juin 2026
NG0203 te tombe dessus dès que tu déplaces un inject() dans un setTimeout, un Observable ou après un await. L'erreur n'apparaît pas toujours en dev, parfois seulement en SSR ou en prod. Tour des 4 scénarios qui déclenchent l'erreur et des bonnes manières de la corriger sans casser ton architecture.
27 mai 2026
Tes images sont presque toujours l'élément LCP de ta page, et c'est souvent elles qui font chuter ton score Lighthouse. NgOptimizedImage corrige le CLS, le lazy-loading mal placé et les images servies en 2000px sur mobile, à condition de ne pas tomber dans les 5 pièges classiques. Guide pratique avec before/after.
22 mai 2026
Tu écris encore input() value + output() valueChange + un emit() manuel pour un simple [(banana)] ? model() fusionne les deux signaux en un seul, reste writable des deux côtés et s'intègre nativement aux signals. Guide complet : forme courte, required, validations, pièges de boucle et quand NE PAS l'utiliser.
20 mai 2026
ngAfterViewInit lit le DOM trop tôt. setTimeout(0) est un hack. Et en zoneless, les deux explosent. Angular 16 a introduit afterNextRender() et afterRender() pour synchroniser proprement le code avec le rendu : guide complet avec phases, SSR et pièges.
17 mai 2026
La Directive Composition API d'Angular 15+ te permet d'attacher des directives directement sur l'élément host d'un composant, sans héritage, sans mixin, sans duplication. Un pattern que la majorité des équipes ignore encore.
15 mai 2026
L'astuce CSS :host { display: contents } en Angular : pourquoi c'est tentant, pourquoi c'est souvent un wrapper qui s'ignore, et quand c'est légitime.
13 mai 2026
Angular 19 remplace ControlValueAccessor par FormValueControl : zéro provider, zéro callback, un simple model(). Guide de migration avant/après.
13 mai 2026
linkedSignal() est le chaînon manquant entre computed() (trop rigide) et effect() (trop dangereux pour synchroniser de l'état). Guide complet avec forme courte, forme longue, use cases pagination et sélection intelligente.
9 mai 2026
Le pattern Subject + takeUntil + ngOnDestroy est verbeux, fragile et franchement dépassé. Angular 16 a introduit takeUntilDestroyed() et DestroyRef — voici comment les utiliser correctement, y compris hors contexte d'injection.
4 mai 2026
effect() paraît simple — une fonction qui réagit aux signals. En pratique, elle concentre les erreurs les plus vicieuses : boucles infinies, memory leaks, timing surprenant. Voici les 5 pièges à éviter absolument.
29 avril 2026
Retour d'expérience sur l'utilisation de la skill open-source impeccable pour auditer et refondre la landing page EAK : du score 10/20 au score 19/20 en 28 commits, avec les commandes, les chiffres et les pièges rencontrés.
24 avril 2026
viewChild(), viewChildren(), contentChild() remplacent les décorateurs @ViewChild et @ContentChild en Angular 17+. Plus réactifs, compatibles signals, et sans le piège de timing SSR. Guide complet avec avant/après.
17 avril 2026
Angular 17 a introduit @defer pour charger les composants à la demande, sans toucher au routing. Viewport, interaction, idle, prefetch — voici comment l'utiliser pour vraiment alléger ton bundle initial.
16 avril 2026
Comparatif détaillé des trois solutions d'internationalisation Angular — compile-time vs runtime, lazy loading, SSR, API Signals — pour choisir celle qui correspond à ton contexte.
14 avril 2026
Découvrez git worktree, la fonctionnalité Git méconnue qui permet de travailler sur plusieurs branches simultanément sans stash ni clone — cas d'usage concrets, commandes essentielles et retour d'expérience avec Claude Code.
14 avril 2026
Comment générer un flux RSS 2.0 statique à partir d'articles markdown sur un blog Angular SSG — script TypeScript, intégration au build, pièges à éviter.
8 avril 2026
Toutes les APIs Signals d'Angular (17+ à 21+) dans une fiche mémo : signal, computed, effect, input, output, model, linkedSignal, resource, httpResource, rxResource, interop RxJS et patterns avancés.
10 mars 2026
Récapitulatif complet des évolutions du moteur de template Angular : control flow, @let, template literals, spread operator, arrow functions et plus encore, de la v17 à la v21.2.
26 février 2026
Angular 21.2 est une minor release anormalement dense : TypeScript 6, Signal Forms matures, @switch exhaustifs, instanceof dans les templates, arrow functions et resource snapshots.
4 février 2026
Angular 19.2 a introduit httpResource, une API déclarative pour charger des données HTTP via les signals. Simple, élégante… mais qui fait grincer des dents les puristes de la clean architecture. Faut-il l'adopter ou la fuir ?
18 janvier 2026
Découvre comment rendre tes InjectionToken Angular tree-shakable avec providedIn et factory. Moins de boilerplate, bundle plus léger, code plus propre.
15 janvier 2026
Angular 21.1 apporte des changements pratiques au quotidien : @switch fall-through, spread syntax dans les templates, évolutions de Signal Forms et nouvelle fonction isActive() standalone pour le router.
6 janvier 2026
Utiliser any en TypeScript, c'est comme conduire sans ceinture. Découvre comment unknown, les type guards et Zod peuvent sauver ton code (et ta carrière).
13 décembre 2025
Faut-il utiliser type ou interface en TypeScript ? Guide complet avec exemples pratiques, différences techniques et recommandations ESLint pour faire le bon choix.
10 décembre 2025
Découvre comment j'ai fait passer mon bundle Angular de plus d'1 MB à 750 KB en remplaçant Zod par Zod Mini. Guide complet avec visualisation du bundle et astuces d'optimisation.
6 décembre 2025
Angular 21 apporte plusieurs changements majeurs dès le simple `ng new` : Tailwind intégré, Vitest par défaut, zoneless, simplification HTTP et évolution du linter. Voici ce qui change concrètement.
27 novembre 2025
Modernise tes tests Angular avec inputBinding et outputBinding : moins de fixture.detectChanges(), plus de signaux et des specs plus déclaratives.
10 novembre 2025
Guide complet pour créer des composants Angular personnalisés qui fonctionnent avec ngModel et FormControl. Apprenez ControlValueAccessor pas à pas avec des exemples pratiques.
3 novembre 2025
Histoire d'un bug de scroll Angular causé par un simple overflow-y: auto. Comment j'ai passé 2 heures à chercher un problème que j'avais créé moi-même.
27 octobre 2025
Découvre quand utiliser input(), @Attribute() ou InjectionToken dans tes composants Angular. Guide complet avec exemples pratiques, comparaisons et patterns recommandés.
25 octobre 2025
Du double subscribe au rxResource : découvre comment moderniser ton data flow Angular pas à pas, de RxJS à Signals.
20 octobre 2025
Découvre comment éliminer les div wrappers inutiles dans tes composants Angular et utiliser l'élément host pour un DOM plus propre et performant. Guide complet avec exemples pratiques.
13 octobre 2025
Découvre la différence cruciale entre les opérateurs ?? et || en TypeScript et pourquoi l'opérateur nullish coalescing devrait devenir ton nouveau réflexe pour éviter les bugs subtils.
10 octobre 2025
Pourquoi votre build casse en Angular 20.3.x avec un NG0401 sur une app SSR, et comment corriger en passant à la nouvelle API de bootstrap côté serveur avec BootstrapContext.
22 septembre 2025
Chaque principe SOLID illustré en Angular moderne (Signals, control flow, InjectionToken) avec '❌ mauvaise façon' vs '✅ bonne façon' pour guider ta refacto.
19 septembre 2025
Apprends étape par étape à brancher un composant Angular sur un Port avec deux Adapters interchangeables : HTTP réel et InMemory pour la démo/tests. Compatible Angular v19+, Signals et nouveau control flow.
11 septembre 2025
Découvre comment Nx et Rspack transforment l'expérience Angular : monorepo structuré, bundling ultra-rapide et DX améliorée. Comparaison avec Webpack et Vite, exemples pratiques et cas d'usage réels.
8 septembre 2025
Apprends à installer et utiliser Zod pour sécuriser tes données en TypeScript et Angular : validation runtime, parse vs safeParse, cas d’usage concrets avec API, formulaires et transformations.
29 août 2025
Tuto pas-à-pas pour simuler un backend REST en local avec json-server, lancer Angular et l'API en parallèle, gérer les CORS, simuler des erreurs et choisir entre json-server, MSW et Mirage.js.
25 août 2025
Pourquoi cette erreur survient dans Angular v20, comment la diagnostiquer et 3 façons propres de la corriger (providedIn, providers de route, provider global).
22 août 2025
Routes dynamiques simples, segments hybrides statique+dynamique, UrlMatcher custom, data resolver : les 4 patterns de routing Angular que j'utilise sur EasyAngularKit, avec leurs forces et leurs pièges côté SSR/SEO.
15 août 2025
Le nouveau style guide Angular v20, et le retour d'expérience d'une migration v19 → v20 sur stack Nx + Vitest. Cohérence, organisation par feature, inject(), zoneless, pièges de tests : tout ce qu'il faut savoir avant de migrer.
6 août 2025
Retour d'expérience sur la migration vers Tailwind CSS v4 avec un projet Nx + Angular + Vitest. Symptômes, débug et fix.
6 août 2025
Évite le HTML répétitif en centralisant la config des liens de navigation dans ton TypeScript. Découvre comment utiliser routerLinkActive efficacement avec Angular v19+.
24 juillet 2025
Apprenez à simplifier des menus ou interfaces répétitives en projetant dynamiquement des composants Angular à l’aide de *ngComponentOutlet.
17 juillet 2025
Apprenez à utiliser les HttpInterceptors Angular pour centraliser l'ajout de l'en-tête Accept-Language à toutes vos requêtes HTTP, en fonction de la langue active de votre application.
9 juillet 2025
Transloco Angular : ajoute le multilingue (i18n) à un projet standalone moderne, avec une configuration clean et un exemple pas à pas.
27 juin 2025
Comprenez la différence entre composants intelligents et composants présentiels, et structurez vos applications Angular proprement.
25 juin 2025
Une fiche mémo des concepts et opérateurs clés RxJS et Signal à connaître pour vos projets Angular modernes.
25 juin 2025
Une grille de décision simple pour savoir si votre projet Angular a vraiment besoin d’un store comme NgRx ou Signal Store.
12 juin 2025
Faut-il utiliser le constructor ou ngOnInit dans un composant Angular ? Ce guide rapide clarifie leur rôle et t’aide à faire le bon choix.
6 juin 2025
Guide complet pour installer et configurer Vitest avec Angular 20. Remplacez Karma/Jasmine par Vitest pour des tests plus rapides et modernes.
6 juin 2025
Un retour d'expérience concret sur l'utilisation du Signal Store de NgRx dans une reproduction simplifiée d'EasyAngularKit.
27 mai 2025
Depuis Angular v16, l’apparition de withComponentInputBinding transforme la façon dont les composants reçoivent les données des routes. Voici ce que ça change, ses avantages, ses limites… et un piège à connaître.
25 mai 2025
Retour d’expérience sur la première édition de NgBaguette, l'évènement Angular 100% francophone. Talks, rencontres et coups de cœur.
25 janvier 2025
Angular 21 active le mode zoneless par défaut. Ce guide couvre tout : contexte historique, concepts clés, stratégie de migration progressive en 4 phases, patterns courants et pièges à éviter.
Suite d'outils pour développeurs Angular francophones. Apprends, modernise tes réflexes, audite ta codebase.
© 2026 AngularKit. Tous droits réservés.