Angular 18 - Beginner To Expert + Interview Questions

Master Angular framework, Latest Angular Updates, Interview questions, Angular tasks for hands on

What you'll learn

Learn to build robust Angular applications with the latest architecture.

Dive deep into Angular's component-based architecture and learn how to build efficient and scalable web apps.

Create fast, smooth, and engaging user experiences with single-page applications.

Leverage data binding to create responsive and interactive user interfaces.

Implement effective component interaction patterns for modular applications.

Interview questions guide for every topic included

Tons of practical tasks for every topic to understand practical implementation

Requirements

Basic HTML and CSS skills are helpful but not required.

Time and A commitment to learning and practice.

Description

Master the Art of Web Development with Angular 18Ready to take your web development skills to the next level? Our comprehensive Angular 18 course is designed to equip you with the knowledge and practical experience you need to build cutting-edge web applications. This course is designed for freshers as well as experienced developers to guide step by step.Why Choose Our Angular 18 Course?In-Depth Learning: Dive deep into the core concepts of Angular, including components, directives, data binding, and dependency injection.Real-World Projects: Apply your knowledge to practical projects and build real-world applications.Expert Guidance: Learn from experienced instructors who will guide you through every step of the learning process.Stay Up-to-Date: Keep pace with the latest Angular trends and best practices.Flexible Learning: Learn at your own pace, anytime, anywhere.What You'll Learn:Angular Fundamentals: Master the building blocks of Angular applications.Advanced Features: Explore powerful features like routing, forms, HTTP requests, and reactive programming with RxJS.Best Practices: Learn to write clean, efficient, and maintainable Angular code.Deployment Strategies: Deploy your Angular apps to production environments.Technologies Covered:Angular 18HTML5CSS3BootstrapTypeScriptNode.jsMySQLGitAngular CLIVisual Studio CodeEnroll Now and Start Your Journey to Becoming an Angular 18 Expert!

Overview

Section 1: Introduction

Lecture 1 Introduction to Angular v18 (Course Introduction)

Lecture 2 Angular CLI

Lecture 3 Understanding Project Structure

Section 2: Angular Fundamentals

Lecture 4 First Component with Architecture

Lecture 5 IQ - First Component with Architecture

Lecture 6 Displaying message dynamically (Interpolation)

Lecture 7 IQ - Interpolation

Lecture 8 Task - Display sum of two values

Lecture 9 Property binding

Lecture 10 IQ - Property Binding

Lecture 11 Task - Property binding with image tag

Lecture 12 Event binding with click event

Lecture 13 IQ - Event Binding

Lecture 14 Task - Creating Counter Example

Lecture 15 Binding other mouse related events

Lecture 16 Binding keyboard events

Lecture 17 $event object

Lecture 18 IQ - $event object

Lecture 19 Task - Checking Shift key status

Lecture 20 Task - Keydown to increment/decrement counter

Lecture 21 Two way binding (ngModel)

Lecture 22 IQ - Two way binding (ngModel)

Lecture 23 Task (Two-way Binding) - Get input field value on button click

Lecture 24 Task - Simple Cart Calculation - Two way binding

Section 3: Angular Directives

Lecture 25 Directives Introduction

Lecture 26 Structural Directives (*ngIf)

Lecture 27 IQ - *ngIf directive

Lecture 28 Task - Implementing show & hide functionality with *ngIf

Lecture 29 Structural Directives (*ngFor)

Lecture 30 IQ - *ngFor Directive

Lecture 31 Structural Directives (*ngSwitch)

Lecture 32 IQ - *ngSwitch directive

Lecture 33 Task Implementing age validation functionality

Lecture 34 Attribute Directives [ngClass]

Lecture 35 Task - Toggle functionality using ngClass

Lecture 36 Attribute Directives [ngStyle]

Lecture 37 Task [ngStyle] - Changing the color of input field

Lecture 38 Grouping elements with ng-container

Lecture 39 HTML templates with ng-template

Lecture 40 IQ - ng-template Vs. ng-container

Lecture 41 Task - Display msg if input remains empty (ng-container & ng-template)

Lecture 42 Rendering templates with ngTemplateOutlet - Part 1

Lecture 43 Rendering templates with ngTemplateOutlet - Part 2

Lecture 44 IQ - ngTemplateOutlet Directive

Lecture 45 Task - Portfolio Builder (Phase 1) - Defining Template

Lecture 46 Task - Portfolio Builder (Phase 2) - CSS

Lecture 47 Task - Portfolio Builder (Phase 3) - Binding

Section 4: Component Lifecycle

Lecture 48 Introduction

Lecture 49 Component Creation Hook - ngOnChanges()

Lecture 50 IQ - ngOnChanges()

Lecture 51 Understanding SimpleChanges Object

Lecture 52 IQ - SimpleChanges Object

Lecture 53 Component Creation Hook - ngOnInIt()

Lecture 54 IQ - ngOnInit()

Lecture 55 Detecting Custom Changes With ngDoCheck() hook

Lecture 56 IQ - ngDoCheck()

Lecture 57 Understanding the ngAfterContentInit() hook

Lecture 58 IQ - ngAfterContentInit()

Lecture 59 Checking The Content With ngAfterContentChecked() hook

Lecture 60 Loading Content With ngAfterViewInit() hook

Lecture 61 IQ - ngAfterViewInit()

Lecture 62 Checking The Component View With ngAfterViewChecked() hook

Lecture 63 Destroying Component With ngDestroy() hook

Section 5: Decorators

Lecture 64 Introduction To Decorators

Lecture 65 Class Decorators @NgModule

Lecture 66 Class Decorators - @Component Decorator

Lecture 67 Property Decorators - @Input() decorator

Lecture 68 IQ - @Input() decorator

Lecture 69 Task - @Input() Decorator

Lecture 70 Property Decorators - @Output decorator

Lecture 71 IQ - @Output decorator

Lecture 72 Task - Using @Input and @Output Together

Lecture 73 Property Decorators - Accessing Child Components With @ViewChild

Lecture 74 IQ - @ViewChild decorator

Lecture 75 Property Decorators - Accessing The Projected Content With @ContentChild

Lecture 76 IQ - @ContentChild() Decorator

Lecture 77 Property Decorators - Binding Properties With @HostBinding

Lecture 78 Method Decorators - Binding Methods To Events With @HostListener

Lecture 79 Task - Implementing Color Picker

Lecture 80 Parameter Decorators

Section 6: Angular Pipes

Lecture 81 Pipes Introduction

Lecture 82 Task - Implementing the built-in pipes

Lecture 83 Understanding Slice Pipe

Lecture 84 Task - Page navigation using slice pipe (Part-1)

Lecture 85 Task - Page navigation using slice pipe (Part-2)

Lecture 86 Understanding Number pipe

Lecture 87 Task - Pound to Kg Converter Using Number Pipe

Lecture 88 Understanding JSON Pipe

Lecture 89 Displaying Table Data To JSON string

Section 7: Custom Pipes

Lecture 90 Creating Custom Pipes

Lecture 91 IQ - Custom Pipes

Lecture 92 Task - Creating Custom Pipe For Sorting Numbers

Lecture 93 Task - Creating Custom Pipe For Letter Count

Lecture 94 Pure Vs Impure Pipe

Lecture 95 Using Impure Pipes

Section 8: Angular Routing

Lecture 96 Routing Introduction

Lecture 97 Creating a simple route -

Lecture 98 IQ -

Lecture 99 Creating A Navigation Link With “routerLink” Directive

Lecture 100 IQ - routerLink Directive

Lecture 101 Creating A NavBar Using Routes

Lecture 102 Passing Route Parameters (Dynamic Routing)

Lecture 103 IQ - Dynamic Routing

Lecture 104 Wildcard Routes - Displaying The ‘404’ Page

Lecture 105 IQ - Wildcard Routes

Lecture 106 Understanding Nested Routes

Lecture 107 IQ - Nested Routes

Lecture 108 Task - Creating a multi-level menu

Lecture 109 Redirecting Routes

Lecture 110 IQ - Redirecting Routes

Lecture 111 Understanding ActivatedRoute

Lecture 112 IQ - ActivatedRoute

Lecture 113 Query Parameters In Routing

Lecture 114 IQ - Query Parameters In Routing

Lecture 115 Navigating Routes

Lecture 116 IQ - navigate() method

Lecture 117 Task - Displaying Course Details And Fetching The Query Parameters

Section 9: Angular Services

Lecture 118 Introduction To Services

Lecture 119 IQ - Introduction to Services

Lecture 120 Dependency Injection

Lecture 121 IQ - Dependency Injection

Lecture 122 Providing Services

Lecture 123 IQ - Providing Services

Lecture 124 Injecting services using inject()

Lecture 125 IQ - inject() function

Developers looking to leverage Angular's power for building complex web applications.,Individuals seeking to advance their Angular expertise.,Angular experts aiming to refine their skills and stay ahead of the curve.