Web Development


Complete Angular 11 - Ultimate Guide - with Real World App

Angular 11, Angular 12 Material, REST API, JWT Authentication, Angular Project, Asp.Net Core, Dashboard, Durgasoft

4.53 (2231 reviews)


38.5 hours


Jun 2021

Last Update
Regular Price

Unlimited access to 30 000 Premium SkillShare courses

What you will learn

Confidently speak about most of the essential concepts of Angular

Crack angular job interviews easier

Solve most common bugs and issues in Angular applications

Secure Angular applications using the most-recommended - JWT Authentication

Creating unit test cases for the angular apps

Create Angular Apps From Scratch and scale it up to any level

Create Angular Folder Structure with industry best practices like a Pro

Add Angular to your prior knowledge of any Server technology (Asp .Net Core Mvc, NodeJS, Python, Java etc.), to become successful Full-stack developer and get new career opportunities

Create Professional Dashboards with ease

Angular Material (UI Components)

Angular Flex Layout

Highcharts basis


Complete Angular 11 - Ultimate Guide - with Real World App



LEARN these HOT TOPICS in Angular 11:

  • Data Bindings

  • Bootstrap Integration with Angular

  • ngIf, ngFor, ngSwitch, Style Management

  • Built-in Pipes & Custom Pipes

  • Modules

  • Services and Dependency Injection

  • RxJS Basics, Observables

  • REST-API calls using AJAX

  • Observable Map

  • CRUD operations with real databases

  • Authentication with Asp.Net Core and Angular

  • JWT Authentication for REST API end points

  • Http Interceptors and Http Headers

  • User Registration and Login in Secured way

  • Role Based Authentication

  • Secure Routes using Guards

  • Handle Forms in Efficient way with Reactive Forms and Form Builder

  • Component Communication with siblings, children and parent level, and with Custom events, RxJS Subject

  • ViewChild, ViewChildren, ContentChild, ContentChildren, ElementRef

  • Build custom pipes and directives

  • Pass route parameters in handle them in different ways

  • Create and secure child routes and animate them

  • Understand router events

  • Understand feature modules

  • Create Responsive Dashboard with Bindings.

  • Create unit test cases for components and services

  • Understand Angular Zones

  • Understand handling XSS and XSRF.

  • Understand basics of TypeScript classes and interfaces.

  • Angular Material

  • Angular Flex Layout

  • Basics of Highcharts


  • A mini project, "Angular Task Manager", where the admin can create projects and issue tasks to employees and the employees can update status of tasks.



  • By the end of this course, you will create all of the source code for a complete Angular real-time project, with all features like page navigation with routing, CRUD operations with real databases, User registration and login with JWT authentication, handle other aspects such as directives, pipes, organize the big picture of the application using angular modules.

  • You will type in every line of code with me in the videos ... all from scratch.

  • I explain every line of angular code that we create. So this isn't a copy/paste exercise, you will have a full understanding of the code.

  • I am a RESPONSIVE INSTRUCTOR .... post your questions and I will RESPOND in 24 hours, ASAP.

  • All source code is available for download

  • English, Hindi captions are available.


Sample of the reviews:


This is the best available course on Angular and he has beaten everyone on Udemy - Alok Verma


It's wonderful experience !! I am very much thanks full to Harsha that he made this tutorial interesting, easy. He teaches angular concept in very easy manner. I am expecting more courses on different technologies from Harsha. - Mithun Patil


explained very neat to understand every topic. - Praveen Kumar T


Excellent course content and delivery. Instructor speaks clearly and ensures that course remains relevant as Angular gets updated by their creators. - Mohan Singam


yeah it is really amazing .I am loving the course. Thank you Harsha - Kiran Kumar


i have completed around 70% of this course and it is absolutely brilliant. Harsha have complete knowledge about his subject and give in depth knowledge about angular. We don't only learn what to use we will learn why to use. Its an in depth explanation about angular. From zero to Hero. - Atal Srivastava


It's 5 Star Rating, Well explained help me in order to get a new job. Thanks :) - Kapil Gupta


Excellent awesome.. You Harsh covered all the basic and advanced Angular-10 topics in such a simple way that i am really putting my hands together. - Hitesh kumar Nath


He makes sure the even the backbench guys like us can understand the subject. - Jagdish Dundi


I want to appreciate Harsha for covering different aspects in angular in deep. I can definitely say that I learnt a lot. - Dileep


This instructor has such a talent explaining all the concepts and we acquire the knowledge of all about complete project structure which we will need in real time like Authentication and security really superb.. - Santosh


No Risk – Money-Back Guarantee

Finally, there is no risk. You can preview first few lectures of the course for free. Once you buy this course, for some reason if you are not happy with the course, Udemy offers a 30-day money back guarantee.

So you have nothing to lose, sign up for this course and learn how to build Angular Projects from scratch!

Key Points about this Course: 

  • AJAX & Authentication videos will be shown with Asp .Net Core Mvc;; but "node.js" source code is provided as alternative, for non-Asp. Net Core developers. So if you are a UI developer / Java developer / NodeJs developer also, no problem - you can use the node.js code for server side app.

  • All the concepts are progressively integrated into a sample mini project called "Task Manager", which includes all essential features that a real-time project should have.

  • All the concepts explained in both theoretically and practically.

  • We use Bootstrap from the beginning of the course.

  • We use Windows O/S, Visual Studio Code, TypeScriptAngular 11.


Complete Angular 11 - Ultimate Guide - with Real World App
Complete Angular 11 - Ultimate Guide - with Real World App
Complete Angular 11 - Ultimate Guide - with Real World App
Complete Angular 11 - Ultimate Guide - with Real World App


Introduction & Basics of Angular 8

Course Introduction

Introduction to Angular

Where to Start Practical

Where to Download Course Material

Goals of Angular

Code Compilation Process in Angular

Do's and Don'ts of Angular

Building Blocks of Angular

Angular Architecture

Overview of Angular Packages

Angular App Folder Structure

Angular Basics

First App in Angular [Practical Starts Here]

Creating First App in Angular

Adding Bootstrap

Adding Bootstrap NavBar

Creating & Nesting Components

Creating Basic Routing

Angular Basic App

Data Bindings, ngFor, Style Management, Pipes, Built-in Directives

Creating Dashboard

ngFor & Nested ngFor

Overview of Data Bindings & Working with All Types of Binding

Style Handling & ngClass

ngIf & ngIf-else & ng-template

Built-in Pipes & Date Formats


Modules & Services

Creating Custom Modules

Creating Services & Dependency Injection

RxJS & REST API calls using AJAX

What is RxJS, Observable and Observer

Introduction to AJAX

Retrieving Data From Database [Asp.Net Core MVC | EF Core | Get Request]

Inserting Data into Database [Asp.Net Core MVC | EF Core | Post Request]

Updating Data in Database [Asp.Net Core MVC | EF Core | Put Request]

Deleting Data in Database [Asp.Net Core MVC | EF Core | Delete Request]

Searching Data in Database with AJAX

RxJS Observable - Map with AJAX

Authentication & Security

User Authentication in Asp.Net Core Mvc

User Authentication in Angular

Understanding JWT

JWT Authentication in Asp.Net Core Mvc

JWT Authentication in Angular

Http Interceptors

Catching 401 UnAuthorized Responses using Interceptors

CanActivate Guard

Role Based Authentication

Prevent XSRF (Cross Site Request Forgery)

Prevent XSS (Cross Site Scripting)

Template Driven Forms

Adding CheckBox, RadioButton, DropDownList with Foreign Key

Validations in Template Driven Forms

Custom Validations in Template Driven Forms

Cross Field Custom Validations in Template Driven Forms

Async Custom Validations in Template Driven Forms with REST-API Calls

Reactive Forms

Understanding Reactive Forms & Creating SignUp Form using Reactive Forms

Adding Radio Buttons to Reactive Forms

Adding Dynamic Radio Buttons to Reactive Forms

Adding Dynamic DropDownList to Reactive Forms

Adding CheckBox to Reactive Forms

Subscribing to valueChanges Observable

setValue, patchValue, reset

Nested Form Groups

Form Arrays

Form Builder

Validations in Reactive Forms

Adding Validation Error Messages

Custom Validations

Cross Field Validations

Submitting SignUp Form using REST API Call

Async Validations with REST API Call

Component Communication

Parent To Child Communication - using Input Binding

Child To Parent Communication - using Output Binding with Custom Events

Parent to Child - using ViewChild

Parent to Child - using ViewChildren

Component Communication using Services

Custom RxJS Observables

RxJS Subject

RxJS BehaviorSubject

Passing Content from Parent to Child

Child to Grand Child - using ContentChild

Child to Grand Child - using ContentChildren


Debugging and Auto-Deployment

Debugging the Angular Code

Using Gulp for Continuous Deployment

Life Cycle Hooks

Overview of Life Cycle Hooks




ngAfterContentInit and ngAfterContentChecked

ngAfterViewInit, ngAfterViewChecked


Pipes - Deep Dive

Creating Simple Custom Pipe

Parameterized Custom Pipe

Creating Complex Custom Pipe

Pure Pipes (vs) Inpure Pipes

Client-Side Paging using Custom Pipe

Async Pipe

Directives - Deep Dive

Attribute Directives (vs) Structural Directives

Custom Directives

Receiving Parameters using Input Properties in Directives




Creating Custom Structural Directive

Advanced Routing

Route Parameters

Child Routes

Nested Routes in AdminModule

Nested Routes in EmployeeModule

Router Events

Server Side Logging using Router Events

CanDeactivate Guard


Introduction to Animations

Fade Animation

Slide-Up Animation

Zoom-Up Animation

Zoom-Left Animation

Slide-Left or Right Animation

KeyFrame Animation

Feature Modules

Introduction to Feature Modules

Proper Folder Structure for Enterprise Apps

Shared Module

Lazy Loading of Modules

Preloading Strategy of Lazy Loading Modules

Dynamic Components

Preparing for Dynamic Components

Preparing Masters Menu Dynamically

Loading Components Dynamically into Tabs

Data Binding to Dynamic Components

Destroying Dynamic Components

Finalizing Course Project - Task Manager

Countries Master

Sorting in Countries Master

Client Locations Master

Task Priorities Master

Task Status Master

Creating Routes for Employee

Detecting if already Logged-in

Creating Tables for Tasks

Create Task Page

Tasks Page

Applying Contextual Classes to Tasks

Update Task Status Page

Unit Testing & Angular Zones

Unit Testing Basics in Angular

Unit Testing on Components

Angular Zones

Bonus: TypeScript Essentials

Introduction to TypeScript

First App in TypeScript

Data Types

Object Literals



Array of Objects


Access Modifiers


The End

Bonus: $6 - Discount Coupons for my other Udemy Courses


Nawin19 September 2020

Sir, Please make a course on angular10 and PHP for PHP Developers. As it is difficult for us to understand asp.net and i am not ready to learn asp.net. And i Hope you will create a the above mentioned course to help your students and please send a udemy link to naveen.talari@gmail.com. Eagerly, waiting for the above mentioned course.

Charan15 September 2020

The way instructor explaining is not natural. It's like he is reading some material from somewhere. Video and audio recordings are done separately.

Aman13 September 2020

Yes , this course was perfect for me. Each and every topics were explained very clearly along with implementation.

Dileep31 July 2020

I want to appreciate Harsha for covering different aspects in angular in deep. I can definitely say that I learnt a lot. But I suggest can you please change the backend technology(asp.net core) can it be java.

Arun24 July 2020

very Good course for students, please provide a course where you make a mean project with all node and angular concepts.

Gigin24 February 2020

The way he teach is excellent, as a beginner i can follow him easily.. learnt a lot from this course, thank you harsha sir..

Jose21 February 2020

the content is good but the constant pauses at the end of every sentence making obvious that the presenter is reading are really annoy

Subhash18 February 2020

To the point information with the right speed. Instructor way of teaching is excellent. No time waste. Right now i am in the middle of course but update my review after completion of course.

Himanshu17 February 2020

Positive -> Everything covered. Negative -> Too much course content. I lost my charm multiples times while completing the course.

Mohit12 February 2020

Faculty is knowledgeable but delivery tone is so robotic that become boring after a while. Also course is not updated properly, my some of the jQuery scripts where not working until I looked up in QA section. And the biggest pain started in Section 5 when he started using .Net MVC framework without giving any stable background and suggests every now and then to buy another course of him on MVC.

Sanjay20 January 2020

I finished Section 2: your basic explanations are awesome, will leave review for each section accomplishment.

Stephen13 December 2019

I did like the course. I actually purchased a previous version, began the previous version and the course was updated and the version I purchased was taken away and I was provided with only the new version. I do think I should be able to retain what I purchased as it is my issue similar to an issue of a magazine. If an update is to be provided free, it should not overwrite what I or any student personally owns. I can see how an update would definitely change what an instructor offers. I am thankful for free updates. When an instructor is good, all versions are good, I guess, so there is value in each.

Eric29 November 2019

Bought the course. Skipped right to template forms section. There seems to be no theory or explanation of what he is doing. What is the difference between template and reactive forms?

Pragnesh22 October 2019

concepts are explained well. The focus has always been to topic and anything extra has been passed on with reference of future lecture/ separate course.

Shreya29 September 2019

it is exactly what i want ,the way of explaning things is good but i want you to publish another tutorial of angular using flex and material design.


Udemy ID


Course created date


Course Indexed date
Course Submitted by