Learn Angular: Web Development

Learn Angular step by step, from your first component to a real web app that talks to a server. Write TypeScript, a template and styles in a three-pane workbench and watch your component render live on your phone.

This is a web development course built around doing: every stop on the path is a real Angular concept, and the workbench lets you try it right away. You learn TypeScript the way frontend developers use it every day, inside components, services and templates, and you finish ready to build web apps on your own.

WHAT'S INSIDE

• 38 courses and 144 bite-sized lessons, from beginner (A1) to advanced (C1)

• A live workbench: component.ts, template.html and styles.css side by side, with a preview that runs your code

• A Projects tab with multi-file workspaces, guided project tracks and version history

• 60 TypeScript coding missions in three difficulty levels, with hints and worked solutions

• A final exam and a certificate of completion with your name on it

• The app is available in 22 languages

A COMPLETE FRONTEND DEVELOPER PATH

• Standalone components, templates and built-in control flow (@if, @for)

• Signals: signal(), computed() and effect(), signal inputs and queries

• Data binding, two-way binding, pipes and lifecycle hooks

• Dependency injection and shared services

• Routing and navigation, including advanced router patterns

• Template-driven and reactive forms, custom form controls

• RxJS fundamentals and operators

• HttpClient and interceptors for real API data

• State management with NgRx and NgRx SignalStore

• Unit, component and end-to-end testing

• Change detection, performance, server-side rendering and hydration

• Micro frontends with Module Federation, building libraries, i18n and security

PRACTICE THAT STICKS

• Mini quizzes and flashcard review for the concepts you keep forgetting

• A one-page cheatsheet of syntax, decorators and directives

• A library of short example components you can open, run and edit

• 50 interview questions with clear answers, useful before a frontend developer interview

• World Coding Challenge: one shared problem, everyone's solutions

• Streaks, XP, a leaderboard and daily reminders to keep your coding habit going

• Save your own code, notes and favorite lessons

AI TOOLS (PRO)

• AI tutor: ask about an error, a concept or your own code and get a clear explanation

• AI lesson generator: a custom lesson on the topic you don't get yet

• AI playground: describe a page and watch the code get built

WHO IT'S FOR

• Beginners taking their first steps in web development and front end work

• JavaScript and TypeScript developers learning their first framework

• React or Vue developers moving to this framework at work

• Students and career switchers preparing for a web developer job

HOW IT WORKS

1. Start with the free first course: what the framework is and what its apps look like

2. Open the workbench, change a value in the class and see the template follow

3. Move up the path: signals, services, routing, forms and HTTP

4. Test what you know with quizzes and coding missions

5. Pass the final exam and earn your certificate

FREE AND PRO

The first course and the live workbench are free. Pro unlocks every course, all coding missions and the AI tools, and removes ads.

Note: the live preview needs an internet connection.

This app is an independent learning course from CoddyKit. It is not affiliated with or endorsed by Google or the Angular team.

Start today, learn Angular at your own pace and build your first component in minutes.