Angular is one of the most popular front-end frameworks, and in the last few years, it has been either gaining or losing popularity. One possible reason for this is because of the type of audience it is intended for and the way the programming languages have switched over the last years.
So today, we will try to answer the question: Is Angular only intended for developers coming from backend technologies like Java, and why would someone prefer it over React or Vue?
I started my journey with Java technologies back in 2014. I was used to OOP (Object-oriented Programming) and kept learning more and more about backend technologies. Then, my first professional frontend touch came with AngularJS and the implementation of a hybrid mobile application. In the last few years, I had the opportunity to work with the three main frontend frameworks – Angular, React and Vue. In this blog post, I will try to give my reasons why I like Angular.
Let’s also try to find out if you also like Angular and what kind of developer you may be.
Angular: A Full Framework
Since its beginning, Angular has been the most comprehensive front-end framework. We can compare it with the Spring Framework for Java or the ASP.NET in C#. It includes inside itself all the tools you will need to develop your application. From the view perspective and implementation of the components, through dealing with HTTP requests to some back-end service, adding translations layer for different languages, implementing forms and routing, and finally testing your application.
Another advantage of this approach is that the documentation is extensive and in one place. It includes documentation and an API reference guide for all the components together with a reliable startup application companion.
However, having such comprehensiveness also comes with certain drawbacks. For example, one of the cons of Angular is the additional complexity to the learning process for beginner developers. Jumping into the framework and learning your way of writing front-end applications can be a wrong decision long term. As a beginner programmer, most probably, you will not go into details of the core concepts, e.g. how JavaScript, semantic HTML, CSS positioning, etc., work. But then again, this is the same also for the other frameworks.
Do you like the flexibility of choosing all the tools you will need for your project? Or do you like the full feature frameworks and tools to start doing your job right away without the need to take out inconsistencies between them?
TypeScript
TypeScript, a strict syntactical superset of JavaScript, comes out of the box with Angular. It was originally developed by Microsoft to add strong type and compile-time checks to JavaScript. The similarities with C# and Java make it more of a homecoming. Many software developers use TypeScript as it is a preferred choice for large-scale enterprise projects.
So, do you like finding issues in your code before delivering it on runtime? Or maybe you would like to be able to do refactoring more easily in your enterprise project? If some of the answers are yes, then you may like to use TypeScript on top of JavaScript.
Object-Oriented Programming Principles
And while we talk about TypeScript, we cannot skip the mention of implementing Object OP principles as part of our frontend project.
For example, the polymorphism technique by creating custom form components by implementing ControlValueAccessor interface, life cycle interfaces like OnInit, OnDestroy. Of course, you can write your component without these interfaces (still because of the nature of JavaScript), but they prevent you from misspelling method names or using the wrong input and output.
Plus, we also have encapsulation of our data, inheritance, e.g. if we would like to implement components with similar behaviour, etc.
Angular Style Guide
The Angular Style Guide is packed with helpful advice and best practices for good application architecture, e.g. consistency across company-level projects. Usually, each team can define its own style for implementing projects. This is also normal when you are in a team and start several projects simultaneously. Based on their hands-on experience, the most senior team members will be able to define a good directory structure, a good style for defining components, state, services, etc., for React or Vue projects. But outside of this team, another one can define styles independently, which may cause performance issues in the long run. Thus, having the same style between company teams provides tremendous efficiency.
Dependency Injection
Dependency injection (DI) is a typical technique that we are already familiar within most of our backend projects in Java or C#. DI is not something that you choose to add to your front-end project but something that is part of the Angular Framework and will also become a part of your project.
Another benefit that we are familiar with is to change the implementation of service without changing the dependent classes. You can find such an example with different implementations of a Logger in the Angular documentation on how you can achieve this.
Would you like to separate your view-specific logic from your API calls, transformations, state management, etc.? Would you like to have your dependencies clearly defined and injected on your request?
Testing in Angular
In Angular, easy to perform testing is implemented as part of the framework. We know that testing should be part of every software development project that we would like to maintain over a long period of time. Angular included the testing tools within the framework by adding Karma and Jasmine. To be able to test the modules and components, we have a specific testing library provided by the Angular community.
TestBed and @angular/core/testing are the tools that you can use for mocking and testing your components. And as we mentioned mocking, you can use the dependency injection capabilities to pass mocked dependencies to your components.
Do you like writing clean, testable code? Services and components following single responsibility principle and are easy to test?
Reactivity
Angular relies on RxJS (a reactive programming library) as part of the framework, and as a result of HTTP requests, reactive changes of the router paths and data, async results as part of the templates, etc.
Still, reactivity is something that is not part of every Java project but essential for Angular. If we move the HTML and CSS away, this may be the next challenging part to get familiar with if you don’t have experience with RxJava (or a similar Reactor package) or Reactive (formerly Rx.NET) package of C#. Hopefully, asynchronous programming will not be a problem for you to get familiar with. Just try not to do an extensive chain of synchronous computation code as you may be tempted to do in your backend project.
Conclusion
Naturally, like any other software development framework, Angular has numerous benefits but also comes with some disadvantages. In fact, Angular is not the silver bullet for all, as most front-end developers might think when considering the framework. Angular doesn’t give you the freedom of doing things your way. And this is the correct behaviour if you aim for a large-scale enterprise project.
Also, Angular is not a framework for beginner programmers. However, this might be inevitable when you have a team, and you are looking for additional team members. In this case, Senior developers should take the responsibility of showing the proper path of development to Junior developers.
If you’re still looking for experienced Angular developers, our Dreamix team would be happy to be part of your next successful software project!
Book free consultation and a Dreamix representative will contact you directly.
