Angular 4

Build the web applications of tomorrow using the new Angular web framework from Google.

Start Now!

Description

Important

This course supports Angular version 4 if you are looking for AngularJS v1.x then please check the other course in the top menu.

After taking this course, you are going to be able to:

  • Understand the latest features of ES6 JavaScript and TypeScript.

  • Build an Angular application from scratch using TypeScript and the Angular command line interface.

  • Write code using the paradigm of reactive programming with RxJS and Observables.

  • Know how to Unit Test Angular using Jasmine, Karma and the Angular Test Bed

Important

This courses teaches you Angular v2+ from scratch, you don’t need to know AngularJS 1.x.

The first chapter in the course is a quickstart where you dive straight into writing your first Angular application. We use the web editor plunker so you can get stuck in writing code ASAP.

In this quickstart you’ll get a 50,000 foot view of the major features of Angular v2+.

Then chapter by chapter we go much deeper into each of these features. We first cover the theory, using plunker as much as possible so you can try out the code yourself in a browser. Then you’ll practice what you’ve learnt with either an online quiz or a set of flash cards.

You are going to learn all about:

  • Typescript & ES6 Javascript.

  • Components & Binding

  • Directives

  • Dependency Injection & Services

  • Angular Modules & Bootstrapping your Angular application.

  • SPAs & Routing

  • Angular CLI

  • Forms

  • Reactive Programming with RXJs

  • HTTP

  • Testing

  • Packaging & Releasing

The ideal student for this course is an existing web developer, with some JavaScript knowledge that wants to add Angular to their skill set.

Or perhaps you are an existing Angular 1 developer who wants to level up to Angular.

You do need to be comfortable with at least the ES5 version of JavaScript.

We’ll be using a UI framework called twitter bootstrap throughout the course but you still must know HTML and some CSS.

Reviews

Responsive

Max Lam

Angular

I'm a big fan of Asim's courses. This course is power punch pack if you want to learn about Angular2.

Responsive

John Amuesi

Angular

I don't normally leave reviews on anything but what Asim has produced warrants a review. This is a fantastic course that will help lower the learning curve into Angular for beginners as well as experienced developers.

Responsive

Randy

Angular

Asim has once again shown why his courses are always a MUST BUY! He is in the top echelon of teachers! Excellent presentation of content, overview and examples of features!

Responsive

Evan

Angular

I'll update this as I continue the course but I'm absolutely impressed. It is clear how much thought, work, and professional experience is put in. Update Halfway - I understand why you use Plunker, its awesome. and THANK YOU for including the angular-cli!

Curriculum

Quickstart Overview Plunker Intro to TypeScript Writing our first app String Interpolation Looping Property & Event Binding Domain Model Nesting Components & Inputs User Interaction & Outputs Wrapping Up Flash Cards Activity ES6 JavaScript & TypeScript TypeScript Setup Overview Let Const Template Strings Fat Arrow Functions Destructuring For Of Map & Set Promises Class & Interface Decorators Modules Types Wrapping Up Flash Cards Angular CLI Angular CLI Flash Cards Activity Components Overview Architecting with Components Templates, Styles & View Encapsulation Content Projection Lifecycle Hooks ViewChildren & ContentChildren Wrapping Up Flash Cards Activity Built-in Directives Overview NgFor NgIf & NgSwitch NgStyle & NgClass NgNonBindable Structural Directives Wrapping Up Flash Cards Activity Custom Directives Overview Creating a custom directive HostListener & HostBinding Inputs & Configuration Wrapping Up Flash Cards Activity Reactive Programming with RxJS Overview Streams & Reactive Programming Observables & RxJS RxJS & Angular Wrapping Up Flash Cards Activity Pipes Overview Built-in Pipes Async Pipe Custom Pipes Wrapping Up Flash Cards Activity Forms Overview Model Driven Forms Model Driven Form Validation Submitting & Resetting Reactive Model Form Template Driven Forms Wrapping Up Flash Cards Activity Dependency Injection & Providers Overview Injectors Provider Tokens Configuring Dependency Injection in Angular NgModule.providers vs Component.providers vs Component.viewProviders Wrapping Up Activity HTTP Overview Core HTTP API HTTP Example with Promises HTTP Example with Observables JSONP Example with Observables Wrapping Up Activity Routing Overview Route Configuration Navigation Parameterised Routes Nested Routes Router Guards Routing Strategies Wrapping Up Activity Unit Testing Overview Jasmine & Karma Testing Classes & Pipes Testing with Mocks & Spies Angular Test Bed Testing Change Detection Testing Asynchronous Code Testing Dependency Injection Testing Components Testing Directives Testing Model Driven Forms Testing Http Testing Routing Wrapping Up Advanced Topics Custom Form Validators Configurable Custom Form Validators