Upgrading AngularJS Part 3: Upgrading from AngularJS to Angular

Watch this First

Check out this overview of Upgrading AngularJS, including how to think about these courses, the course platform, and the sample code.

Course Intro and Overview

8 mins

Preview

Module 1: Setting Up ngUpgrade

Moving to ngUpgrade & Angular

Get access

Your Upgrade Roadmap Part 2

9 mins

Preview

Documentation

3 mins

Get access

Starting Point

2 mins

Get access

Installing Angular

4 mins

Preview

Fixing Two Errors

3 mins

Get access

Renaming And Exporting app.ts

3 mins

Get access

Angular Module

4 mins

Get access

Angular Module Part 2

3 mins

Get access

Adding main.ts

4 mins

Get access

Webpack Entry And Running Hybrid App

3 mins

Get access

Quiz: Module 1

Get access

Module 2: Rewriting & Downgrading Components

Rewriting Home Component

4 mins

Preview

Decision About Downgrading

2 mins

Get access

Downgrading Home Component

4 mins

Get access

Finishing Home Component

4 mins

Get access

Quiz: Module 2

Get access

Module 3: Rewriting & Downgrading Services

Adding http Module

2 mins

Get access

Rewriting Customer Service

4 mins

Get access

Converting To Promises

4 mins

Get access

Downgrading Customer Service

3 mins

Get access

Adding To ngModule

4 mins

Get access

Quiz: Module 3

Get access

Module 4: Promises & Observables

Intro To RxJS Slides

13 mins

Get access

Get Customers As Observable

2 mins

Get access

Using Observable In Customer Component

3 mins

Get access

Convert To Promise

5 mins

Get access

Convert Promise To Observable

5 mins

Get access

Quiz: Module 4

Get access

Module 5: Interfaces & Component Lifecycle Hooks

Rewriting Customers Table

4 mins

Get access

Downgrading Customers Table

4 mins

Get access

Updating Templates

4 mins

Get access

Creating Customer Interface

4 mins

Get access

Add Interface To Customer Table

2 mins

Get access

Convert Customers

4 mins

Get access

The OnInit Interface

4 mins

Get access

Finish Customers Component

4 mins

Get access

Module Wrap Up

2 mins

Get access

Quiz: Module 5

Get access

Module 6: Upgrading Services

Where We're Going

3 mins

Get access

Convert Orders Component

4 mins

Get access

Add Properties

5 mins

Get access

Finish Orders Component

4 mins

Get access

Location Provider

5 mins

Get access

Using Location In Component

3 mins

Get access

Quiz: Module 6

Get access

Module 7: Rewriting Filters & Using Pipes

Updating Orders Template

5 mins

Get access

Adding Sorting

5 mins

Get access

Testing Sorting

2 mins

Get access

Add Sort To Template

3 mins

Get access

Add Styles

3 mins

Get access

Add Filter To Component

4 mins

Get access

Add Filter To Template

4 mins

Get access

Fix Currency Pipe

2 mins

Get access

Quiz: Module 7

Get access

Module 8: Forms

Convert Create Order

3 mins

Get access

Provide Product Service

4 mins

Get access

Downgrade Component

3 mins

Get access

Add Forms Module

2 mins

Get access

Convert Form Tag

5 mins

Get access

Replace ng-model

4 mins

Get access

Replace ng-options & ng-repeat

4 mins

Get access

Required And Disabled

2 mins

Get access

Validation Styling

4 mins

Get access

Checking Out Our Validation

3 mins

Get access

Posting an Observable

4 mins

Get access

Assignment: Rewrite Customer Detail

2 mins

Get access

Quiz: Module 8

Get access

Module 9: Upgrading Components

Rewrite Customer Detail

5 mins

Get access

Upgrading Discount Component

6 mins

Preview

Finish Discount Component

5 mins

Get access

Quiz: Module 9

Get access

Module 10: ngUpgrade in Production

Current Bundle Size

3 mins

Get access

Install Bundle Analyzer

3 mins

Get access

Our Bundle And Angulars Two Modes

5 mins

Get access

Fix RxJS Imports

3 mins

Get access

Move Downgraded Components

6 mins

Get access

Move Downgraded Services

3 mins

Get access

Finishing Up The AJS Module

3 mins

Get access

Adding AJS Entry

2 mins

Get access

Changing Templates

2 mins

Get access

Assignment: Finish Changing Templates

1 min

Get access

Removing Private Template Variables

2 mins

Get access

Fix Export Defaults

3 mins

Get access

Update Angular

2 mins

Get access

Install AOT Tools

2 mins

Get access

Add AOT TS Config

3 mins

Get access

Main AOT File

4 mins

Get access

Update Prod Config

4 mins

Get access

Update Dev Config

5 mins

Get access

Our New Builds

3 mins

Get access

Quiz: Module 10

Get access

Module 11: Switching to Angular Router

Where We're At Now

5 mins

Get access

Where We Need To Be

6 mins

Get access

Adding Root Component

3 mins

Get access

Creating Routing Module

6 mins

Get access

Updating App Module

3 mins

Get access

What's Working So Far

2 mins

Get access

Replace $Location Service

4 mins

Get access

Router Links

3 mins

Get access

Adding Detail Routes

2 mins

Get access

Creating A Resolver

7 mins

Get access

Add Resolver To Routing Module

2 mins

Get access

Use Resolved Data In Component

4 mins

Get access

Order Detail Resolver

3 mins

Get access

Use Order Detail Resolver

4 mins

Get access

Use Interface In Component

3 mins

Get access

Assignment: Product Detail Resolver

1 min

Get access

Product Detail Resolver

6 mins

Get access

Fix Last Router Links

4 mins

Get access

Quiz: Module 11

Get access

Module 12: Removing AngularJS

Move Imports

3 mins

Get access

Remove AJS Refs And Files

2 mins

Get access

Main Files And Webpack Entry

2 mins

Get access

Remove AJS Packages

2 mins

Get access

Our Finished Application

5 mins

Get access

Quiz: Module 12

Get access

Module 13: Updating to Angular 5

Updating Packages

7 mins

Get access

Using HttpClient to Module

3 mins

Get access

Update Customer Service

4 mins

Get access

Update Other Services

4 mins

Get access

Remove Http Package

1 min

Get access

Fix Currency Pipe

3 mins

Get access

Update Prod Config

2 mins

Get access

Finish AOT Build

3 mins

Get access

Module Wrap-Up

4 mins

Get access

Quiz: Module 13

Get access

Module 14: RxJS 6 & Angular 6

Module Overview

4 mins

Get access

Installing RxJS 6 Packages & Tools

4 mins

Get access

Going Through the Updated Files

4 mins

Get access

Fixing the Orders Component

2 mins

Get access

Updating to Angular 6

5 mins

Get access

Making Sure Everything Works

5 mins

Get access

Quiz: Module 14

Get access

Module 15: Angular 7 & The CLI

Module Overview

6 mins

Get access

Install Angular CLI

1 min

Get access

Creating a New Project

4 mins

Get access

Add Dependencies

5 mins

Get access

Move Files

4 mins

Get access

Fix Styles

6 mins

Get access

Configure Proxy

4 mins

Get access

Delete Public Folder

2 mins

Get access

Fix Dist Folder

5 mins

Get access

Updating with the CLI

4 mins

Get access

Module Wrap-Up

3 mins

Get access

Quiz: Module 15

Get access

Module 1: Setting Up ngUpgrade

Module 4: Promises & Observables

Module 5: Interfaces & Component Lifecycle Hooks

Module 6: Upgrading Services

Module 7: Rewriting Filters & Using Pipes

Module 8: Forms

Module 10: ngUpgrade in Production

Module 11: Switching to Angular Router

Module 13: Updating to Angular 5

Module 14: RxJS 6 & Angular 6

Module 15: Angular 7 & The CLI

Upgrading AngularJS Part 3: Upgrading from AngularJS to Angular

Table of contents

Upgrading AngularJS Part 3: Upgrading from AngularJS to Angular