Angular

What is it?

Angular is a full application framework maintained by Google, rebuilt from the ground up in 2016 (as "Angular", distinct from the earlier AngularJS). Unlike React or Vue, which are UI libraries you assemble a stack around, Angular ships with routing, forms, HTTP client, testing tools, and dependency injection built in - one opinionated way to structure an application rather than a menu of choices.

It's written in TypeScript by default, which brings strict typing to every part of the app, not just an optional add-on.

When to use it

Angular fits large, long-lived applications built by larger teams - enterprise dashboards, internal tools, and products where consistent structure across many contributors matters more than initial setup speed. Its conventions and built-in tooling reduce "which library should we use for X" debates. For solo developers, small teams, or projects that need to ship fast, the upfront learning curve and boilerplate are usually not worth it - Vue or React get you moving faster.

Core concepts

• Components - TypeScript classes decorated with @Component, paired with an HTML template and (usually) a separate CSS file.
• Modules - NgModules group related components, directives, and services into cohesive units of the app.
• Dependency injection - services (shared logic like data fetching) are "injected" into components that need them, rather than imported and instantiated by hand.
• Templates and directives - Angular's own template syntax (*ngIf, *ngFor, now increasingly @if/@for in newer versions) extends HTML with logic.
• RxJS - Angular leans on reactive streams (Observables) for async data, which is powerful but a distinct mental model from promises/async-await.

A taste of the code

import { Component } from "@angular/core";

@Component({
  selector: "app-counter",
  template: `
    <button (click)="count = count + 1">
      Clicked {{ count }} times
    </button>
  `,
})
export class CounterComponent {
  count = 0;
}

Compare this to the equivalent React or Vue counter: more ceremony up front (the class, the decorator), in exchange for a structure that scales predictably as the app - and the team building it - grows.

Your first steps

1. Learn JavaScript fundamentals and get comfortable reading basic TypeScript (types, interfaces) before diving in.
2. Install the CLI with npm install -g @angular/cli, then scaffold a project with ng new my-app.
3. Run ng serve, open the local URL, and edit src/app/app.component.ts to see live reload.
4. Generate a new component with ng generate component to see how the CLI keeps the project structured for you.
5. Build a small app with a service (for shared data) and a couple of routed pages to get a feel for dependency injection and the router together.

Common beginner mistakes

• Confusing AngularJS with Angular. AngularJS (1.x) is a different, discontinued framework. Make sure tutorials are for modern Angular.
• Learning NgModules first. Standalone components are the default in current Angular; older tutorials built around NgModule add complexity you no longer need.
• Leaking subscriptions. Observables you subscribe to manually keep running after a component is destroyed. Prefer the async pipe, signals, or takeUntilDestroyed().
• Business logic in components. Keep components focused on the view; put data access and shared logic in injectable services.
• Ignoring signals. Signals are Angular's modern, simpler way to manage reactive state - worth learning early.

Getting it online

ng build produces static files in the dist folder, which you can deploy to any static host or shared hosting. Configure the host to serve index.html for unknown paths so refreshing a route works - the same fix described in our Vite deployment guide.

With server-side rendering enabled, Angular needs a Node host instead.

Go deeper