The Component Approach and Typescript in AngularJS 2.0 for Large Teams Developing Complex Apps

6 min.

AngularJS 1.x. was not a big project supported by a large company. It was developed by a single person and later picked up by Google. When it was first created, web development wasn’t as complicated as it is today, and large apps were a rarity. Now web apps are huge, so the old framework became obsolete. When teams are large already and always growing, someone else’s code is hard to understand and change. Besides, with time new requirements to web development itself appeared, so much that a simple upgrade would not be enough to cover them, and practically a new framework had to be developed to meet those changes.

The Component Approach

In my opinion, the biggest and best improvement in the new framework is the component approach. For beginners AngularJS 1.x. was not an easy level to start: directives had too many setups that were redundant, with five services while all you need is only a few. As a result, developers had a lot of unnecessary problems with using them and questions about what they are for.

The basis of the component approach is the promise that components can be developed independently of each other. This makes the framework perfect for developing in teams where developers work on different parts of the app. Of course this is the cornerstone of good architecture that makes it easier and faster to change code.

AngularJS 1.x. was not created with this goal in mind. Too much syntax and methods of directives coding, as well as how they were connected, did not promote coding different parts independently. In the last few years, apps grew bigger, causing longer development schedules, bigger teams, where a lack of a unified coding style, especially in situations where one person had to understand someone else’s code, slowed everything down, causing more bugs and expenses. Meeting deadlines became problematic.

In AngularJS 2.0, organized syntax and multiple methods of data transfer, as well as isolated components don’t make developers rely on the framework as much and facilitate writing apps. If I know correctly, AngularJS 2.0 documentation can fit on a few pages, it’s that self-explanatory and easy. The basis of the app can be written super-fast. The rest of functionality is up to developers, since simple tools are given to them, and with their help they can make the app more complicated.

AngularJS 1.x. lacked in that department. Now developers are able to write more supported code, with an ability to reuse components. To a degree it’s an imposed philosophy but you can’t escape it. The most optimistic prognosis it that developers will write faster and better, but we yet have to try it out in practice.


Some people don’t like Typescript. First of fall, as a language, Typescript code without comments is more readable, understandable and documented. A lot of Typescript functionality trickles down to the new standard of JavaScript because they closely work together. I think that one of the reasons why developers first chose Typescript was they needed a standard that evolved fast. So they safeguarded themselves by taking a standard that had JavaScript features in it. Besides, AngularJS 2.0 syntax allows for writing code in OOP style more understandable for the backend team because it is native to them. In a sense, it makes the category of developers embracing it larger. On the other hand, Typescript is more typified, not that it saves developers from some types of errors, but because it’s more self-documented and allows for developers to figure out others’ code logic faster. The main pluses of AngularJS 2.0 are philosophy and architecture, the language itself and its simplified usage. These factors together help work better in big teams to develop large and complicated apps.

Comparison with ReactjS

At first glance AngularJS 2.0 and ReactJS are different only minimally. It’s almost hard to tell them apart and recommend one over the other. React is a library with many components that bring it closer to AngularJS. But I think AngularJS trying to position itself as a framework makes its creators dictate (not strictly but directly) what the app should look like. AngularJS 2.0 gives developers a lot of information about each development stage. From the point of view of documentation, it’s great, spanning all app developmentstages (inquiries, page-proofs, accessibility, and so on). Also, when we can safely say that the technology behind AngularJS and ReactJS is mostly the same, the AngularJS community is much bigger with about a million contributors who will migrate to AngularJS 2.0, so any question can be answered professionally and the best solution form hands-on experts can be chosen. AngularJS 1.x also boasted an impressive community, where you could get standard plug-ins and general support, and the AngularJS 2.0 version will surely provide just as many expert tips.

Migrating from Version 1 to 2

On big projects the migration process will probably prove to be expensive. If the project was written considering the latest versions of AngularJS 1.x. and written in a good style, the changes will not be that great. The biggest changes will be in syntax rather than semantics, something that makes you redo the whole app. The issue here is rewriting a large app itself because they are expensive to redo per se. Small apps will be easier, faster and cheaper to migrate.

Before you consider migrating, think about the following points. Many developers are naturally attracted to new trends and are happy to make an upgrade for the sake of an upgrade. But despite all the advantages of a possible gain in productivity and the ability to use the latest technology, the main factors for the decision to transfer a large project to a newer version, in my opinion, are the answers to the following questions:

  • For how long will the project be developed?
  • Are serious changes planned?
  • How complex will the ongoing support for the project be?
  • How much will the team membership change during this time?

Maybe in a couple of years, the time spent with new people in the team joining and supporting a huge project developed with the old technology, will turn out to be much more expensive than an upgrade made in good time. Now it is already possible to say that the entry threshold for AngularJS 2.0 is much smaller than for AngularJS 1.x.

With regard to the migration process, AngularJS 2.0 developers took care of that by providing a module upgrade accompanied by relevant documentation as part of the framework, making it possible to do an incremental upgrade. Another tip is not a great mystery but often overlooked: first, it is highly recommended to do a self-check with Angular Style Guide before starting the upgrade process. Much of the upgrade’s difficulty will depend on the degree of coupling of project components and how frequently methods and directives unique to the first version of the framework were used.

In any case, the decision should be based on the specific features of the project and current team capabilities.