Angular for Beginners Course

Name: Angular for Beginners Course
Rating: 4.5 (4430 reviews)

A quick introduction to the Angular framework, focusing on its most commonly used parts

Created byAngular University

Last updated 6/2026

English

What you'll learn

Code in Github repository with downloadable ZIP files per section
Feel comfortable using the most commonly used features of the Angular framework

Course content

3 sections • 20 lectures • 1h 58m total length

Angular for Beginners - Helicopter View4:19
Recommended Software Versions0:15
Course Kickoff - Development Environment Setup5:53
Set up your development environment, scaffold a small Angular application with the Angular CLI, and run a hello world app to see Angular in action.
The Typescript Jumpstart Ebook3:20
Introduction To Angular - Custom HTML Elements, Model vs View8:54
Why Angular? Learn the Key Features of Angular Core11:36
Explore Angular core features like input properties, template syntax, and browser events, and learn how Angular automatically synchronizes data with the view and provides built-in security.

New Section - Angular Components and Core Directives3:59
Explore Angular components and core directives in a starter repository, learn to switch branches, install dependencies with npm, and run a local server to build custom components.
Building our First Angular Component5:42
Learn to build a custom Angular component, the course card, scaffolded with the Angular CLI, and pass dynamic data to multiple instances without hard coding.
Component Inputs and the @Input Decorator9:42
Learn how to expose course data to templates with the @Input decorator and square-bracket bindings. Pass a full course object to a component to display title, description, and image.
Angular Component @Output - Custom Events and Event Emitters9:53
Learn to implement custom events in Angular using @Output and EventEmitter, emit the selected course from a child component, and handle it in the parent with the dollar event.
Angular @for Syntax5:17
Learn how to use the Angular for syntax to loop over a courses array, apply a tracking function for efficient updates, and render each course with a clean, optimized approach.
Angular @for @empty, $index and other extra options9:13
Discover the add for template syntax in Angular, including the empty placeholder for empty lists and the $index, $count, $first, $last, $even, and $odd variables for styling and data display.
Comparison between @for and ngFor1:15
Angular @if Syntax5:05
Learn to use the Angular @if syntax for conditional rendering with an active template syntax, handling missing icons with placeholders and implementing if, else if, else in course cards.
Comparison between @if and ngIf1:43
Compare the new Angular if syntax with ngIf, highlighting its plain JavaScript feel, no imports, support for if else if else, and automated migration from ngIf.
Angular ngClass Core Directive - Learn All Features9:07
Discover the ngClass directive for conditional styling in Angular components. Use string, array, or object forms (or a component method) to apply or remove classes like beginner based on data.
Angular ngStyle Core Directive - When to use it and Why6:29
Explore how to apply dynamic styles with ngStyle in Angular, using a configuration object and template syntax to set properties like text-decoration and background-image.
Angular @switch Syntax3:52
Learn how to use Angular's switch syntax for conditional rendering in templates, creating case blocks for beginner, intermediate, and advanced categories with a default fallback and category badges.
15 Angular Built-In Pipes - Complete Catalog11:17

Requirements

Just some HTML, CSS and Javascript

Description

There is a lot to learn about the Angular framework, which can be a bit daunting especially for beginners. But the good news is that there are some parts of the framework that are used much more often than others. In fact, in Angular you will be using 10% of its features maybe 90% of the time!

If you are going to learn Angular, why not focus first on the features that you will be using all of the time, and leave the more advanced parts for later in your learning process?

Course Overview

This course is a beginner-friendly introduction to the Angular framework. In this course, we are going to start by setting up your development environment, and we will use the Angular CLI to quickly scaffold a small Angular project from scratch.

Using this initial playground, we are then going to answer some of the most common Angular questions:

Why Angular, what are its main advantages and key features? We will answer this by demonstrating how the change detection mechanism works, and introduce some of the Angular template syntax.

We will then cover the most commonly used parts of the Angular framework that you are going to be using all the time: Components, Pipes, Services and Core directives, among others.

Table of Contents

This course covers the following topics:

Custom components with @Component
Components @Input and @Output, event Emitters
ngFor
ngIf
ngClass
ngStyle
ngSwitch
Built-In Pipes
Async Pipe
Custom Pipes
@Injectable and Custom Services
HTTP Client - GET POST PUT DELETE

What Will You Learn In this Course?

This course will give you a practical hands-on introduction to the Angular framework. After taking this course you will feel very comfortable navigating the code of an existing Angular application and finding your way around, and you will know how to build your own custom components.

Who this course is for:

Developers looking to get started quickly in the Angular framework
Developers looking to learn first the most commonly used parts of Angular

Angular for Beginners Course

What you'll learn

Explore related topics

Course content

Introduction to Angular6 lectures • 34min

Angular Components13 lectures • 1hr 23min

Conclusion & What's Next1 lecture • 2min

Requirements

Description

Who this course is for: