Transition AngularJS applications effectively and elegantly to Angular 2
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.
What You Will 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
Table of Contents
Introducing Angular 2
01. The Course Overview
02. Looking at What’s New in Angular 2
03. Keeping Up with the Latest Angular 1.x Is Important
04. Presenting Our Sample Project
Planning Your Migration to Angular 2
05. Migrating Incrementally Is the Way to Go
06. Let’s Use the Latest Angular 1.x First
07. What Are TypeScript and ES6?
08. Preparing Our Development Environment
Getting Your Angular 1.x Application Ready for Angular 2
09. Cleaning Up Your $scopes
10. Making Components, Not Controllers
11. Using the Latest UI Router
12. Using TypeScript Classes for Our Services
13. Using TypeScript in Our Controllers
The Switch to Angular 2
14. Upgrading Our 1.x Services to Angular 2
15. Switching Our 1.x Components to Angular 2 Components
16. Switching Our 1.x Controllers to Angular 2 Components
17. Using the New Angular 2 Component Router
18. Solving Complex Migration Cases
Angular 2 in the Long Run
19. Best Practices for Angular 2
20. The Future of TypeScript and ES6
21. Taking Angular 2 Further
22. Learning TypeScript and Components