Introduction

An overview of Angular — what it is, why it's popular, and what you'll build in this series.

Introduction

Welcome to the Angular 2 Tutorial! Angular is a powerful, full-featured front-end framework built by Google for creating dynamic, single-page applications (SPAs). Despite the name "Angular 2," this tutorial covers the modern Angular framework (versions 2+), which is a complete rewrite of AngularJS.

What Is Angular?

Angular is a component-based framework for building web applications. It provides:

A structured, opinionated architecture
Two-way data binding
Dependency injection
Routing
HTTP services
A powerful CLI for scaffolding and building

Angular vs AngularJS

Feature	AngularJS (1.x)	Angular (2+)
Language	JavaScript	TypeScript
Architecture	MVC (controllers, scopes)	Component-based
Mobile support	Limited	Built-in
Performance	Slower (digest cycle)	Much faster (change detection)
CLI	None official	Angular CLI
Rendering	Browser only	Server-side rendering support

Why Angular?

Full framework — routing, forms, HTTP, testing all built in
TypeScript — type safety catches errors at compile time
Google-backed — long-term support and large ecosystem
Enterprise-ready — used by Google, Microsoft, Forbes, BMW
Angular CLI — generates components, services, and builds with one command

What You'll Learn

Setting up Angular with the CLI
TypeScript fundamentals
Components and templates
Data binding (property, event, two-way)
Custom property and event binding
Routing and navigation
Directives and pipes
Services and dependency injection
HTTP and connecting to Firebase

Prerequisites

Solid understanding of HTML and CSS
Basic JavaScript knowledge (ES6 features like arrow functions, classes)
Node.js installed on your machine
A code editor (VS Code recommended — with the Angular Language Service extension)

The Angular Ecosystem

Angular Application
├── Components      → Building blocks of the UI
├── Templates       → HTML with Angular syntax
├── Services        → Shared logic and data
├── Directives      → Custom HTML behavior
├── Pipes           → Data transformation
├── Routing         → Page navigation
└── HTTP Client     → API communication

Key Takeaways

Angular is a full-featured, component-based framework by Google
It uses TypeScript for type safety and better tooling
Angular (2+) is a complete rewrite of AngularJS — much faster and modern
The Angular CLI handles project setup, scaffolding, and building
This series covers everything from setup to connecting with Firebase