Angular

A collection of the comprehensive step by step Angular tutorial starting from version 4, 5, 6, 7 to 8 completed with the working source codes

A collection of the comprehensive step by step Angular tutorial starting from version 4, 5, 6, 7 to 8 completed with the working source codes. Angular is a Javascript framework for building a web application, progressive web application, and hybrid mobile application such as Ionic and Nativescript. The Angular built entirely in TypeScript, and as a result, using TypeScript with Angular provides a seamless experience.

Why Should I Learn Angular?

Because Angular is a modern web framework that easy to learn, even if your Javascript level is a beginner. Also, Angular is one of the most popular Javascript web frameworks. Basically, it supports a Single Page Application (SPA), Hybrid Mobile Apps, and Progressive Web Application (PWA). There is a large community that actively supported the Angular. You can find or join it's the community on Facebook, Twitter, Google, LinkedIn, Pinterest, Reddit, etc with a lot of members.

Angular Features

There's some of core Angular feature that available until the last version of Angular (version 8).

Router ParamMap
Animations
NgIf with Else
Dynamic Components with NgComponentOutlet
Angular Universal
Angular CLI
Simpler Progressive Web Applications
Material Design
Build optimizer
Improved Compiler and Typescript
Router Hooks
Number, date and currency pipes update
Web Components with Angular Elements
Smaller bundler using Ivy
Remove whitespaces
Angular Schematics (ng add and ng update)
CLI prompts
Angular Material & Component Dev Kit (CDK)
Drag & drop
Virtual scrolling
Application performance improvements
Differential loading
Dynamic imports for lazy routes
CLI workflow improvements

Tutorials of Angular

NgRx Tutorial: State Management in Angular with Real-World Examples Learn NgRx state management in Angular with a real-world Todo app. Step-by-step guide on actions, reducers, selectors, effects, and best practices.

Angular 20 (Standalone) + SSR + MongoDB (Universal) — 2025 Update Modernized rewrite of Angular 8 Universal + MongoDB tutorial for Angular v20 with standalone APIs, hybrid rendering (SSR/SSG/CSR), and incremental hydration.

How to Deploy Angular App with Docker, Nginx, and Free SSL Learn how to deploy Angular apps with Docker, Nginx, and free SSL from Let’s Encrypt for a secure, scalable, and production-ready setup.

Angular 20 Firebase Tutorial: Build a Firestore CRUD Web App with Standalone Components Build a CRUD Firestore app with Angular 20 standalone components, signals, and modern template syntax — no modules, faster reactivity, cleaner code.

Angular 20 Tutorial: Create a Virtual Scroll with Angular Material CDK Learn how to use Angular 20 Material CDK Virtual Scroll to efficiently render large lists with smooth scrolling, styling, and performance best practices.

Angular Signals vs RxJS Observables: A Practical Comparison Compare Angular Signals vs RxJS Observables with real examples. Learn their differences, best use cases, and how to use both in your Angular apps.

Mastering Angular Material Datepicker with Standalone Components Learn how to use Angular Material Datepicker with standalone components. Covers date range, formatting, mobile UI, Moment.js, and real-world examples.

Angular Lazy Loading and Route Guards: Best Practices and Examples Learn how to implement Angular 20 lazy loading and route guards with standalone APIs for faster, secure apps. Includes role-based auth and real-world examples.

Mastering Angular Material Dialogs (mat-dialog) with Practical Examples Learn how to use Angular Material Dialog (mat-dialog) with real examples, forms, data passing, styling, animations, and reusable components.

Angular File Upload Tutorial with Drag-and-Drop and Progress Bar Learn how to implement file uploads in Angular with drag-and-drop support, progress bar, and preview using modern Angular features.