Migrating to Angular 2 – Second Edition
1.3 (2 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
12 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Migrating to Angular 2 – Second Edition to your Wishlist.

Add to Wishlist

Migrating to Angular 2 – Second Edition

Transition AngularJS applications effectively and elegantly to Angular 2
1.3 (2 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
12 students enrolled
Created by Packt Publishing
Last updated 1/2017
Price: $125
30-Day Money-Back Guarantee
  • 1.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Familiarize yourself with Angular 2’s new syntax and its change detection mechanism
  • Plan and migrate code incrementally and avoid bulk migration
  • Use the ng-upgrade library to facilitate the migration process
  • Understand how to work with the new component router
  • Switch and upgrade services, directives and forms to their Angular 2 equivalents
  • Introduce yourself to ECMAScript 6 and start incorporating TypeScript classes
  • Follow best practices recommended by the Angular core team for migrating projects
View Curriculum
  • This course is focused and practical, and demonstrates how to migrate an example application from Angular 1.x to Angular 2. For developers who want real world advice on how to upgrade Angular projects this delivers tangible examples with best practices approved by the Angular core team, in a fast, digestible way.

Angular 2 is a technical and conceptual overhaul of its hugely popular predecessor, AngularJS. This means that for developers who have built and maintained applications with AngularJS, and need to transition projects across to Angular 2, there needs to be an effective plan of action. Implementing a migration path for projects has been a major talking point in itself leading up to the release of Angular 2, and a critical concern for developer teams transitioning code across to take advantage of the new framework. Angular is a complete solution for rapid front-end development. No other plugins or frameworks are necessary to build a data-driven web application.

This course demonstrates how to apply an effective migration plan for transitioning Angular 1.x projects to Angular 2. Opening with an introduction to the major changes and additions brought by the new framework, we quickly scope out a plan to a migrate a sample weather application from its original Angular 1.x code base.

We then explain how to migrate blocks of code incrementally, as opposed to porting code in bulk, and give you a brief introduction to Typescript and ECMAScript 6. Throughout we’ll show you how to gradually deprecate $scope, upgrade services, work with the component router, transition forms, and more.

By completion of this course, you will be rapidly up to speed with the fundamental building blocks of Angular 2 development, and fully capable (and confident) transitioning existing Angular 1.x projects to the new environment, ready to explore everything the new Angular has to offer.

About The Author

Alain Chautard started using Angular in 2011, back when it was a very young technology that wasn’t widely used yet. He has used Angular JS on a daily basis since then. He also teaches Angular JS in California, where he is the organizer (and main speaker) of an Angular JS meetup group.

Alain is an expert Angular JS consultant at Interstate 21, where he develops beautiful web applications for clients located all over the world.

Who is the target audience?
  • If you’ve built an application with Angular 1.x and need direction on how to efficiently migrate that application across to Angular 2, this video course delivers the knowledge for you to do it. In addition to that, it is for anyone who has used Angular 1.x before and wants a fast, hands-on introduction to the key changes of the updated framework
Compare to Other Angular Courses
Curriculum For This Course
22 Lectures
Introducing Angular 2
4 Lectures 12:02

This video will provide an overview of the course.

Preview 02:06

Angular 2 is completely new and was entirely rewritten. Developers have to learn a new syntax, vocabulary, and way to work with Angular 2.

Looking at What's New in Angular 2

In this video, you will get to know why it is important to upgrade your code.

Keeping Up with the Latest Angular 1.x Is Important

Have a look at the presentation of the sample project, where we are going to migrate from Angular 1 to Angular 2 in order to illustrate the migration process.

Presenting Our Sample Project
Planning Your Migration to Angular 2
4 Lectures 17:32

In this video, we will plan whether the migration to Angular 2 should be done all at once or incrementally.

Preview 03:39

The Angular team wants to make our migration to Angular 2 easy by making Angular 1.x as close as possible to Angular 2.

Let's Use the Latest Angular 1.x First

Angular 2 comes with ES6 and TypeScript support, and most Angular 2 examples on the web are written with TypeScript. What is it exactly?

What Are TypeScript and ES6?

Using Angular 2 with TypeScript requires some specific development environment configuration. We will discuss what exactly we need.

Preparing Our Development Environment
Getting Your Angular 1.x Application Ready for Angular 2
5 Lectures 21:04

Angular 2 handles scopes differently compared to Angular 1. That change of philosophy was already introduced in Angular 1 with the "controllerAs" syntax.

Preview 06:11

Angular 2 introduces components, which are the new way of building Angular applications. Most of the code that we are going to write in Angular 2 will be components, so it makes sense to create as many components as possible right now.

Making Components, Not Controllers

Angular 2 introduces a new router based on components, which, as we've seen before, are similar to controllers.

Using the Latest UI Router

Angular 2 comes with TypeScript support, which allows us to write reusable code more easily. We will discuss how to use TypeScript in our services.

Using TypeScript Classes for Our Services

Angular 2 comes with TypeScript support, which allows us to write reusable code more easily. How to use TypeScript in our controllers, and especially how to achieve dependency injection?

Using TypeScript in Our Controllers
The Switch to Angular 2
5 Lectures 26:06

Angular 2 handles services differently than Angular 1. We already made most of the required changes to our code. Let's see what's left to be done.

Preview 06:11

Angular 2 uses components where we used to have directives. We already migrated our directives to components. Now is the time to turn our Angular 1 components into Angular 2 components.

Switching Our 1.x Components to Angular 2 Components

Angular 2 does not have controllers anymore. Now is the time to turn our Angular 1 controllers into Angular 2 components.

Switching Our 1.x Controllers to Angular 2 Components

Angular 2 has a new router based on components. Using this router is the final step before migrating our app fully to Angular 2.

Using the New Angular 2 Component Router

Every application is different, so your app may have code that cannot be migrated using the content of that course. Let's go through additional resources to get you covered.

Solving Complex Migration Cases
Angular 2 in the Long Run
4 Lectures 16:55

Angular 2 has a list of best practices to make our code aligned with the vision of the Angular team. What are those best practices?

Preview 03:12

Angular 2 was designed to work with TypeScript, which is a superset of ES6. In this video, we will explore what will happen in the future when those languages evolve.

The Future of TypeScript and ES6

Angular 2 is still very new to everybody. In this video, we will discover where we can find help and support to develop our apps.

Taking Angular 2 Further

The aim of this video is to learn more about TypeScript and components.

Learning TypeScript and Components
About the Instructor
Packt Publishing
3.9 Average rating
8,249 Reviews
59,099 Students
687 Courses
Tech Knowledge in Motion

Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.

With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.

From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.

Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.