Angular course · updated October 2026
Learn Angular: The Complete 14-Part Course
Fourteen lessons, one path. Start with what Angular is and finish with a production build you can deploy — using standalone components, signals and the current CLI throughout, not the NgModule patterns you will find in older tutorials.
14 parts · 4 modules · about 7,800 words (~40 minutes of reading) · free, no signup
How this course is put together
Each part is a standalone tutorial with runnable code, a short FAQ and no filler. Read in order and the later lessons make sense because you have already built the project they assume; read out of order and every part still stands on its own.
By the end you can
- Scaffold and structure an Angular application with the CLI.
- Build components, templates and forms that share state cleanly.
- Wire routing, guards and an HTTP layer to a real API.
- Test, profile and deploy the finished app.
Before you start
- HTML — elements and document structure.
- CSS — enough to style a box and lay out a row.
- JavaScript — variables, functions, arrays and objects.
- TypeScript — types, interfaces and generics.
- Node.js 20 or newer and a terminal.
The curriculum
Four modules, fourteen parts. Jump to a module: 1 · Foundations 2 · Components 3 · Data & navigation 4 · Ship it
Module 1 — Foundations
Parts 1–3 Set up the tooling and build the mental model: what Angular is, how a project is laid out, and how the pieces connect.
Part 1 · 3 min read
What is Angular?
What the framework actually includes, how a modern app is put together with standalone components and signals, and whether Angular beats React or Vue for your project.
Part 2 · 2 min read
Angular CLI & Project Structure
Install the CLI, generate a project, and learn which files matter. Includes the four ng commands you will run every day.
Part 3 · 3 min read
Architecture & Standalone Components
How an app bootstraps without NgModules, where services and dependency injection fit, and the layering rule that keeps features independent.
Module 2 — Components and templates
Parts 4–7 The part of Angular you touch every day: components, data binding, communication between them, and the directives and pipes that extend markup.
Part 4 · 3 min read
Components & Lifecycle
The anatomy of a component, when to inline templates and styles, and the lifecycle hooks that still matter in a zoneless app.
Part 5 · 3 min read
Templates & Data Binding
All four binding directions, two-way binding with ngModel, the @if and @for control flow, and template reference variables.
Part 6 · 3 min read
Component Interaction
Pass data down with input(), send events up with output(), and read children with viewChild and contentChild — plus how to choose between them.
Part 7 · 3 min read
Directives & Pipes
Structural versus attribute directives, writing your own, and the built-in pipes that format dates, currency and text without extra code.
Module 3 — Data, state and navigation
Parts 8–11 Share logic with services, move between views with the router, capture user input with forms, and talk to a real API.
Part 8 · 2 min read
Services & Dependency Injection
Create a service, inject it with inject(), and see how the place you provide it decides whether state is shared or per component.
Part 9 · 3 min read
Routing & Guards
Declare routes, read parameters, lazy-load a feature, and protect pages with functional guards.
Part 10 · 3 min read
Forms: Template-Driven vs Reactive
The two forms systems side by side, when each is the right tool, and how to handle cross-field and async validation.
Part 11 · 3 min read
HTTP Client & APIs
Enable provideHttpClient(), wrap calls in a service, add interceptors for auth and errors, and retry failed requests without hiding them.
Module 4 — Signals, testing and shipping
Parts 12–14 Modern reactive state, a test and debugging workflow you will keep, and the production build that puts the app online.
Part 12 · 3 min read
Signals & State Management
signal(), computed() and effect(), component and shared service state, and the point at which you actually need NgRx.
Part 13 · 3 min read
Testing & Debugging
Component and service tests with Vitest, plus the browser tools — DevTools, source maps, breakpoints — that find bugs faster.
Part 14 · 3 min read
Performance & Deployment
Build for production, defer heavy components, cut change-detection work, and ship the static build to any host.
How to get the most out of it
- Type the code, do not just read it. Every lesson includes working snippets. One scratch project from Part 2 is enough for the whole course.
- Do the parts in order if you are new. Parts 1–3 build the project and the mental model that the rest assumes.
- Jump by task if you are not. Chasing a specific problem, such as forms, routing or testing? Open that module and work backwards through its prerequisites.
- Check the FAQ at the end of each part. It answers the questions readers ask most often about that topic, and the answers repeat what the lesson teaches.
Frequently asked questions
How long does the Angular course take?
The 14 lessons total about 7,800 words, roughly 40 minutes of reading. If you write and run the code as you go, allow two to three hours of practice. Most readers work through the series over one to two weeks.
Do I need to know TypeScript before starting?
You should be comfortable with TypeScript basics: types, interfaces, generics and modules. Angular is written in TypeScript and its tooling depends on types. If you are new to the language, work through our TypeScript guide first, then start at Part 1.
Which Angular version does this series use?
Every lesson uses current Angular: standalone components, signals, built-in control flow, functional guards and the Vitest test runner. Legacy NgModule and *ngIf examples appear only where you are likely to meet them in older code.
Should I follow the parts in order?
If you are new to Angular, yes. Parts 1 to 3 set up the project and the mental model, and every later part assumes them. Experienced developers can jump straight to the module they need, such as routing, forms or testing.
Is Angular still worth learning in 2026?
Yes. Angular has a predictable release cadence, heavy enterprise adoption and a modern core built around signals and standalone components. It is a strong choice for large, long-lived business applications, especially on teams that want one agreed structure.
Is the course free?
Yes. All 14 lessons are free to read, with no signup or paywall. Ampersand Academy offers optional one-to-one mentorship if you want feedback on your own Angular project.
Want a mentor while you learn?
Ampersand Academy teaches Angular one-to-one, from TypeScript fundamentals through the router, forms and deployment. Bring your own project and get your code reviewed line by line.
Keep going
- Angular vs React: which should you learn first?
- The TypeScript learning path — the language Angular is written in.
- All Angular tutorials on Ampersand Tutorials, including comparisons and quick fixes.
