Modern Angular 01: What Changed in Angular v21+ (And Why It Matters)

This is the first lesson of the Modern Angular Course, a free video series that teaches Angular the way it is meant to be written today. If the last time you seriously used Angular was a few years ago, Angular v21+might surprise you. This is not just another version update — it changes how you think about building Angular applications.

In this post, we cover:

• Who this course is for
• What the course covers
• The big shift: Angular is signals-first
• Built-in control flow replaces structural directives
• Vitest is now the default test runner
• Why Angular v21+feels different from older versions

Who This Course Is For

This course is designed for three types of developers:

• Developers new to Angular who want to learn it the modern way from day one
• Developers upgrading from Angular v16–v20 who feel like Angular suddenly looks and behaves very differently
• Frontend developers coming from React or Vue who want a clear, explicit, reactive mental model

No matter which group you fall into, Angular v21+ gives you a much more predictable and explicit way to build applications — and this course is built around that idea.

What This Course Covers

This is not a legacy Angular course. We build Angular applications the way Angular v21+ expects you to write them.

Throughout the course, you will learn:

• Signals-first state management — fine-grained reactivity with writable signals, computed signals, and effects
• Built-in control flow — using @if, @for, and @switch directly in templates
• Standalone components — building applications without NgModules, with modern dependency injection
• Routing — functional guards and lazy loading
• Forms and validation — using modern Angular patterns
• Performance — deferrable views and hydration
• Modern testing — Vitest and Playwright
• Migration — moving older Angular apps to Angular v21+

By the end, you will be comfortable building, testing, and deploying modern Angular applications.

The Big Shift: Angular Is Signals-First

The biggest shift in Angular v21+ is this: Angular is now signals-first.

Signals are no longer an experiment or an optional feature. They are the default way Angular expects you to manage UI state. Instead of relying on change detection magic or pushing everything through RxJS, Angular now gives you fine-grained reactivity built directly into the framework.

const count = signal(0);
const doubled = computed(() => count() * 2);

This makes Angular applications easier to reason about, easier to optimize, and much easier to test.

Built-in Control Flow (Goodbye *ngIf)

Another big change is how templates work.

In Angular v21, built-in control flow is the default. Structural directives like *ngIf and *ngFor are replaced by @if, @for, and @switch:

@if (items().length) {
  <app-list [items]="items()" />
} @else {
  <p>No items</p>
}

The result is clearer templates, better performance, and more accurate template coverage in tests. This change alone is one reason many developers notice test failures after upgrading to v21+ — and we cover how to handle that later in the course.

Testing: Vitest Is Now the Default

Testing is another area where Angular v21+ draws a clear line between old and modern Angular.

Angular now ships with Vitest as the default test runner, replacing Jasmine and Karma. This means faster tests, a better developer experience, and modern tooling out of the box.

But it also means Angular is stricter about template coverage — especially when using the new control flow syntax.

Why Angular v21+ Feels Different

When you combine all of this — signals, built-in control flow, and modern testing — Angular v21+ feels different from older versions.

You write less boilerplate. You think more explicitly about state. And Angular becomes more predictable instead of magical.

For developers coming from React or Vue, this often makes Angular feel much more familiar — and much easier to reason about.

Source Code

The full source code for the course is available on GitHub: loiane/modern-angular.

Next Step

In the next lesson, we set up a modern Angular v21+ development environment and create our first app — fully standalone and signals-ready.

Watch the Video

This post is part of the Modern Angular Course series. Check the course page for the full episode list.