Angular

In short: A comprehensive frontend framework by Google (TypeScript-based) — unlike React, a “batteries-included” complete solution with a fixed, prescribed structure.

In more detail: Angular comes with routing, form handling, an HTTP client and dependency injection built in, instead of being just a view library you combine with other tools like React. The rewrite starting with Angular 2 (2016) was a complete rewrite of the original AngularJS; the two are not compatible with each other.

In Depth

Components with decorators

The central building-block concept is components with their own template, their own logic (in TypeScript) and their own stylesheet — similar to React, but with a considerably stricter, prescribed structure via decorators (special annotations that give a class additional meaning):

@Component({
  selector: "app-hello",
  template: "<h1>Hello, {{ name }}</h1><button (click)=\"greet()\">Click me</button>",
  styleUrls: ["./hello.component.css"],
})
export class HelloComponent {
  name = "World";
  greet() {
    alert(`Hello, ${this.name}!`);
  }
}

The double curly braces ({{ name }}) are Angular’s template syntax for interpolation, (click) binds a DOM event to a method — Angular deliberately uses its own, HTML-like template language instead of plain JavaScript/TypeScript as with JSX in React.

Dependency injection

Angular’s built-in dependency-injection system (inspired by server-side frameworks like Spring/.NET) allows services (e.g. for HTTP requests, state management) to be defined centrally and “handed into” any component, without manually passing them down through the component hierarchy (“prop drilling”, a well-known React problem). A service is simply requested in a component’s constructor, and Angular automatically handles instantiation and lifecycle:

constructor(private http: HttpClient) {}

The AngularJS-to-Angular break

The rewrite starting with Angular 2 (2016) was a complete rewrite of the original AngularJS (Angular 1, 2010), not just a version update — the two are fundamentally different and incompatible with each other (different language: JavaScript vs. TypeScript, different architecture: MVC vs. component-based). This radical break confused many developers and opened the field for competitors like React, which gained strong popularity during the same period.

Trade-off against React and Vue

This makes large, cross-team applications more consistent (less room for deciding how routing/forms/state should look), but also means a steeper learning curve than more minimalist approaches like React or Vue, which deliberately only cover the view layer and leave everything else to the developer. Because the framework itself prescribes how routing, forms and HTTP calls look, different Angular codebases often appear more similarly structured than React projects, where each team combines its own libraries — an advantage for large companies with many teams, a potential disadvantage for small, fast-iterating projects.

RxJS and reactive programming

Angular relies heavily on RxJS (Reactive Extensions for JavaScript) to handle asynchronous data — HTTP responses or user input, for example, are treated as “observables” (data streams you can react to) instead of single values or promises. This allows powerful operations like automatically discarding outdated search requests on fast user input (switchMap) or combining several data streams, but also further increases the learning curve, since RxJS brings its own, fairly extensive set of concepts that go beyond normal JavaScript.

Ivy compiler and standalone components

Since Angular 9, the “Ivy” compiler compiles templates into smaller, more efficient JavaScript output and enables tree-shaking (removing unused code from the final bundle) at the component level. Newer Angular versions (from version 14) also introduced “standalone components”, which get by without the previously mandatory NgModule wrappers — a response to criticism that Angular was too cumbersomely structured compared to React/Vue, and a gradual move towards simpler component models.

See also: AngularJS, React, Vue, TypeScript