In today’s article we are going to focus on the Angular2 framework . We will talk about the Angular1 drawbacks, describe the main changes in the new version of the framework and, most importantly, share our impressions of the new version of the software.
First of all a few words about us. We are a boutique IT company. As a basic framework for the front-end we selected Angular1, when it was already quite mature (version 1.2+). Not so long ago (just a month before release) we decided to try Angular2 on a new small project. It’s not like we have become experts in Angular2, but while impressions are still fresh, it would be better to share them.
So, let’s look at Angular1 first. It seems to me, Angular1 brought a lot of new ideas, had quite a low threshold of entry and was well suited for building complex client applications. Perhaps that is why it has quickly gained popularity and became the number one framework. At the same time Angular1 had quite a lot of «shifty» features. Here are some of them:
What is the difference between “factory” and “services”?
- What are “controllers” for, if there is a “directive”?
- Much too complicated directive mechanism
- $scope hierarchy seems to be a sensible idea, but only as long as you work with a relatively simple application
Not so long ago Angular2 was released and it is clear now that its developers managed to get rid of all of these problems.
Below is the brief overview of the changes.
Remained almost unchanged:
- DI
- Filters (now called pipe)
- Modules
- Services
Removed:
- Controllers (use components)
- $scope (use components)
- Excessive mechanism of services creation
Added:
- New language – typeScript
You can still write in JavaScript itself. I would not advise you to use ES5, and have not had a chance to test ES2015 unfortunately. I see no reasons not to write in typeScript, because:
– Typed languages force you to determine the correct entity, find errors at the compiling stage and simplify development environment.
– Application recompiled quickly (1 – 2 seconds).
– Angular documentation and most of the questions on stackoverflow are in typeScript.
- The new syntax in the mark-up
Now, the framework uses the [] data and () to bind listeners. Initially this change somewhat confuses, but you quickly get used to it. Here are two important advantages of the new method:
– Visually divided data and listeners.
– The development environment (from JetBrains) can now give you some hints.
Changed:
- Directives
Directives (now called components) were transformed radically. Implementation has been drastically re-engineered and simplified (without loss of functionality).
- The principle of the app-building
The app now is a components tree. You begin to think in terms of components and try to break everything into components that can be used in different places. It’s really convenient.
And finally impressions from using Angular2:
- As an app grows it’s complexity does not increase so much because of the typeScript and the component decomposition.
- Assembling the project becomes more complicated, but webPack copes well with this problem.
- Browser debugging is so-so.
- Descriptions of the errors leaves a lot to be desired. Try to move in small iterations to make it’s easier to understand the cause of the error.
- The component library is not as large as that of Angular1, but the main things are already implemented.
- Moving an existing project to Angular2 seems too complicated – it is better to be left on Angular1
- It’s better to learn gradually while developing small admin apps
Let us summarize. In my opinion, Angular2 is quite different from Angular1. You will have to spend a few of weeks to grasp the changes. At first, a lot will seem strange and redundant, and, of course, the new framework has its drawbacks. However, the overall impression is positive. I do not see any reasons to stay on Angular1. Spend 1-2 weeks to learn the changes and you are ready for battle!
