Skip to content

What is Angular?

Angular is a web framework from Google for building single-page applications in TypeScript. Where some tools leave you to pick a router or a forms library, Angular includes both, along with an HTTP client and the Angular CLI, a command-line tool that generates new projects and components. The Angular you'll find today was released in 2016 as a full rewrite of AngularJS, an older framework with a similar name.

Recent versions manage state with signals. A signal holds a value, and a computed signal updates whenever the signals it reads change:

import { Component, signal, computed } from '@angular/core';

@Component({
  selector: 'app-cart',
  template: `
    <button (click)="add()">Add item</button>
    <p>Total: {{ total() }}</p>
  `,
})
export class Cart {
  count = signal(0);
  total = computed(() => this.count() * 12);
  add() { this.count.update((n) => n + 1); }
}

Why learn Angular?

Angular makes a lot of structural decisions for you. Components, services and routes follow the same patterns from one project to the next, and the CLI generates files in the expected shape, so you learn one set of conventions well. You'll also write TypeScript from your first component.

The start is slower. Before your first feature works, you'll meet decorators, dependency injection and TypeScript types, which React and Vue let you put off. In Stack Overflow's 2025 Developer Survey, 18.2% of respondents used Angular, close to Vue at 17.6% and well behind React at 44.7%.

Practice Angular on Frontend Mentor

Frontend Mentor briefs list what users should be able to do and leave the framework to you, so any of them can be an Angular project. These picks use the tools Angular ships with.

The Mortgage repayment calculator is a contained place to learn Angular's form handling, with required fields and an error message for each. REST Countries API with color theme switcher adds the router: each country has a detail page, and the border-country links lead to other countries through the same route. The Invoice app brings it together, with a service holding invoices for the list and detail pages and a form where line items can be added and removed.

Start building free

Take your Angular skills further

Want a more structured approach? This learning path takes you through its challenges in order, from first principles to real-world projects.

advanced

JavaScript frameworks and libraries

Using a JavaScript framework can provide many benefits. In this path, we outline core concepts and provide a sequence of challenges to help you reinforce knowledge and gain hands-on experience with your chosen framework.

Challenges to practice Angular with

Every challenge works with any tech stack. These are good ones to build with Angular, from easiest to hardest.

  • Free

    Mortgage repayment calculator

    • HTML
    • CSS
    • JS
    junior

    This mortgage calculator is an excellent project for practicing working with forms, client-side validation, and updating the DOM. Remember to focus on accessibility, too!

  • Free

    Typing speed test

    • HTML
    • CSS
    • JS
    junior

    Build a typing speed test that calculates words per minute (WPM) and accuracy. A fun project to practice DOM manipulation and working with timers.

  • Premium

    Frontend Quiz app

    • HTML
    • CSS
    • JS
    intermediate

    This app will test your skills (as well as your knowledge!) as you build out a fully functional quiz. We provide a local JSON file to help you practice working with JSON!

  • Free

    REST Countries API with color theme switcher

    • HTML
    • CSS
    • JS
    • API
    advanced

    Build a countries app with search, filtering, detail pages, and a light/dark theme using any JS framework. Country data is provided as JSON.

  • Premium

    Bookmark manager app

    • HTML
    • CSS
    • JS
    advanced

    Build a fully-functional bookmark manager with add, edit, archive, search, and filter features. Perfect for practicing forms and state management.

  • Premium

    Invoice app

    • HTML
    • CSS
    • JS
    guru

    This invoicing app project will test you on many levels. You'll be working with JSON data, managing state, plus a lot more. You can even build it out as a full-stack app!

View more challenges

Solutions made with Angular

View more solutions

Related technologies

  • What is TypeScript?

    TypeScript is JavaScript with syntax for types, made by Microsoft. It checks your code before it runs and compiles to plain JavaScript for any browser.

  • What is React?

    React is a JavaScript library, created at Facebook, for building user interfaces from components. You write them in JSX, and React keeps the page in sync.

  • What is Vue.js?

    Vue is a JavaScript framework for building user interfaces. You write components in .vue files, and Vue updates the page whenever your data changes.

Join 1,204,908 people building portfolio-worthy projects

Our highly supportive, positive community is here to help you improve your skills. We all try to help each other out wherever possible. We’d love to welcome you to our community!

Log in