Jul 27, 2017

So, you jumped at the opportunity to start working with Angular 2, awesome! But just as we got our heads around it, they introduced Angular 4 and then a few weeks later they announce that Angular 5 is already in development.

And if your head is not spinning yet, the plan is to release a new version of Angular every six months. That is a superfast timeline to keep up with. But don’t worry, in this blog post I am going to talk about Angular and the road to Angular 5, which is scheduled to be released in September/October 2017.

Before we get ahead of ourselves, let’s rewind and start from the beginning. Angular 2 is a development framework based on JavaScript and it builds on HTML/CSS. It was released mid-September 2016 and was created as the next incarnation of the Angular JS framework.

Why Angular?

The main goal for Angular is to simplify and modularize development of a web based application. It achieves this by reducing the code required to handle data, complex forms and even network communication. It also allows you to build your application into separate modules so you can easily test, reuse and swap components when needed.

Additional benefits that you get with Angular include:

• Reduction in full-page loads

• Moving to client-side coding as opposed to server side scripting

• Support for single page applications

Understanding the Versioning

Angular has adopted Semantic Versioning numbers. In the early stages of development, they referred to it as Angular 2. But with the new versions of Angular coming out, this is becoming out of date. Now ‘Angular’ refers to the new architecture (Angular 2, 4 and 5), while ‘AngularJS’ refers to the old architecture. We will only use Angular 2.0.0 or Angular 4.3.0 to talk about a specific version and what features it includes. Otherwise, we just call it ‘Angular’.

So, how does semantic versioning work and look? Let’s look at the following:

Angular 2.4.1

In this version, we have three versions depicted as:

<Major>.<Minor>.<Patch>

Major versions only change when breaking changes are introduced into the framework, Minor versions change when new, non-breaking features are added, and Patch versions change when bug fixes are added.

Road from Angular 2 to Angular 4

With Angular 4 came the introduction of new features. This included a lot of Minor version updates. Some of the more notable changes were:

View Engine Changes

Changes made to reduce the size of AOT (Ahead of Time) generated code looks like.

TypeScript 2.1

Updated Angular to a more recent version of TypeScript.

StrictNullChecks (Optional)

Prevents you from assigning null and undefined to anything. This is an optional setting and can be changed.

Enhanced the ngIf syntax

Now allows you to implement if/else statements within the template itself.

Click here to view all of the changes made from Angular 2 to Angular 4.

Road from Angular 4 to Angular 5

With Angular 5 currently being developed at the time of writing this blog, the current beta version is Angular 5.0.0-beta. There isn’t much to show in the current beta as it only has one new feature and a few bug fixes.

However, I would like to mention that the latest release of Angular 4 is version 4.3.1. With this release, we have a brand new HTTP Client API, which has the following features:

• Synchronous response body access

• JSON is assumed as default, no longer do we need to explicitly parse it

• Progress events for request upload and response download

• Interceptors allow middleware to be inserted in the pipeline

• Post-request verification

We also got a few new router-level events for GuardsCheck and Resolve:

• GuardsCheckStart – Event that happens on the start of each route navigation

• GuardsCheckEnd – Event that happens on the end of each route navigation

• ResolveStart – Event that happens at the start of the resolve phase of routing

• ResolveEnd – Event that happens at the end of the resolve phase of routing

Since the beta of Angular 5 has started, we can all be excited to see what features are coming to Angular as the beta phase continues. As more people transition from Angular JS to Angular, the growth is not likely to stop anytime soon. Even with the development of Angular 5, the Google team is still optimising and actively working on Version 4 to make the transition easier and smoother.

With that being said, I would like to conclude my blog by saying that all Google internal web apps use Angular (pre-release version of Angular). This gives me confidence in Angular’s stability and the reassurance that I can take comfort when working with it.

If you would like to know more about the Angular courses we offer, contact us today to speak with one of our Learning Solutions Advisors or visit our website.

We currently offer:

Introduction to Angular 4 Programming

Advanced Angular 4 Programming