Skip to content

elmarzouki/angular2-tutorial

Repository files navigation

Angular2-Tutorial

Angular2 tutorial from A-Z.

How it works?!

Go to your lessons directory using cd dirName Run ng serve for a dev server. Navigate to http://localhost:4200/.

Tutorial workflow

01-Components-Templates-Databinding

+ TemplatesStyles.
+ Inserting Content with ng-content.
+ String Interpolation.
+ Property Binding.
+ Binding to Custom Properties.
+ Event Binding.
+ Binding to Custom Events.
+ Two-Way Binding.
+ Component Lifecycle.
+ Template Access with Local References ViewChild and ContentChild.

02- Directives

+ Attribute Directives.
+ Building a Custom Attribute Directive.
+ Element Interaction with HostListener and HostBinding.
+ HostListener Passing Data.
+ Directive Property Binding.
+ ngIf.
+ ngFor.
+ ngSwitch.
+ Building a Custom Structural Directive - unless.

03- Services

+ Example Logging Servic.
+ Example Injecting the Logging Service.
+ Multiple Instances vs One Instance.
+ Using Services for Cross-Component Interaction.

04- Routing

+ Loading and Displaying Route Components.
+ Navigation with Links.
+ Imperative Routing Triggered in Code.
+ Route Parameters.
+ Query Parameters.
+ Extracting Query Parameters.
+ Query Parameters and the routerLink Directive.
+ Child Routes.
+ Redirecting Request.
+ Styling Active Route Links.
+ Guards CanActivate.
+ Guards CanDeactivate.

05- Forms

+ Template-Driven Approach:
	- Registering Controls.
	- Submitting a Form and Using the Output.
	- Input Validation.
	- Form State CSS Classes.
	- Two-Way Binding with ngModel.
	- Form Groups.
	- Radio Button Controls.
	- Form State.
+ Data-Driven Approach:
	- Creating a Form Data-Driven.
	- Synchronizing HTML and the Angular 2 Form Data-Driven.
	- Submitting a Form and Using the Output Data-Driven.
	- Input Validation.
	- Form State.
	- Form Groups.
	- Radio Buttons Controls.
	- Form Arrays  Arrays of Control.
	- Creating a Form with the FormBuilder.
	- Creating Custom Validators.
	- Custom Asynchronous Validators.
	- Listening to Status Value Changes.
	- Resetting Forms.

06- Pipes

+ Using Pipes.
+ Parametrizing Pipes.
+ Chaining Pipes.
+ Custom Pipes.
+ Example Creating a Filter Pipe.
+ Impure Pipes.
+ The Async Pipe.

07- Http

+ Sending a GET Request.
+ Mapping Data.
+ Sending a POST Request.
+ Retrieving and Transforming Data with Observables.
+ Using the Async Pipe.
+ Error Handling with Observables.

08- Authentication

+ Backend Firebase Setup.
+ User Signup.
+ User Signin and Managing the User State.
+ User Logout.
+ Protecting a Route from Unauthorized Access.