In this video, Aviv Ben-Yosef goes over the different motives for upgrading an existing Angular 1.x app to modern Angular 1.6 and the trade-offs involved.
- [Instructor] Making the decision to spend time and money to upgrade an existing app is not straightforward. Playing with the new shiny language may not fit with the fine business goals. And, yet, as with everything in software the decision depends on the project's situation and entails trade-offs. In some cases upgrading is worthwhile. When dealing with an existing Angular 1.x project that is intended to be maintained in the long-term it should be possible to offset the cost of a gradual upgrade.
As time progresses it will become harder to find updated materials and support for older versions. Which means maintenance will get more expensive. The same is true for third-party libraries. As the new methods become standard using code in old and unsupported ways will become increasingly complicated. It will also become increasingly harder to hire new developers to work on an outdated code base. Both for lack of experience and lack of will. Moreover, many teams are already fired up about Angular two and are planning to upgrade their projects soon.
Upgrading an existing app to Angular two in one big go as possible but may not be the wisest choice. Angular two is a big change both in terms of the code base and coding practices. Migration might require changing the responsibilities and communication between existing components. Instead of taking on a lot of work in a single step, learning Angular two and migrating to it while still maintaining a working product it's possible to make progress without adding huge delays.
This is why taking it step by step is safer and, in a lot of scenarios, faster. Once the project is using the component paradigm and is scope-free, upgrading will be much more straightforward. In some businesses having the option to migrate to a different web framework, should the need arise, is also important. Most existing Angular 1.x projects though are locked into the Angular way of doing things on multiple aspects. First, using the propriety DOLI scope object is problematic.
Also, most other modern frameworks make regular use of some form of classes be it ES6 or typescript which DOLI scope inhibits. And a lot of Angular's binding magic will not be straightforward to replicate in a different framework. 1.6 makes Angular a lot less sticky. Angular 1.6's best practices reduce a lot of the implicit Angular magic which will help with any future transition.
Aviv Ben-Yosef kicks off the course by explaining what's different in Angular 1.6, as well the different motives for upgrading. Next, he walks through how to safely upgrade an existing app. He covers going from controllers to directives, as well as component lifecycle hooks. He also goes into the architectural changes in Angular, such as one-way data flow and immutability. To wrap up, he discusses how to properly test components.
- Deciding to upgrade an existing app
- Upgrading to Angular 1.6
- Removing standalone controllers
- Using directives as route targets
- Converting a controller's code
- Converting a controller's template
- Comparing directives and components
- Converting a directive
- Reviewing the concept of one-way binding