All That Angular: Framework & Ecosystem

The Angular framework and its ecosystem

So what is Angular? If it has angles or sharp corners, we call something angular. Kidding.

So Angular as a framework is an open source development platform by Google, used by millions. Some love it, some hate it. I used to hate it too but now I’m in love with it. Here I will write about developer experience with Angular but also its wide ecosystem.

So Angular is a component-based framework for building scalable web applications. It is built on TypeScript, it has a powerful Command Line Interface (NG CLI), RxJS integrated, excellent libraries for handling forms and many, many more. Angular is opinionated and offers very good architecture out of the box. In my humble opinion, opinionated is good because you and your teammates are going to work together on the solution and it is good to be on the same page. Also, if you switch projects, you would end up in a similar environment more or less.

Developer experience

So Angular definitely has a steep learning curve and it takes time to grasp all the angles of the framework. Before doing Angular, I was an Android developer and it took me about a year to really understand what am I doing. I have not worked with reactive programming before Angular and I remember how stupid I felt when I was working with Observables for the first time. It was the year 2016 and Angular (2) became a new thing. Not a lot of material back in the day, the documentation was confusing for me at the beginning and I did not have a lot of people to ask for help. Since then, the community has grown a lot, there are a lot of amazing courses on Angular online.

Nowadays, I really love working with RxJS. If you are not aware, RxJS stands for Reactive Extensions for JavaScript: an API for asynchronous programming with observable streams. Beside JavaScript, there is support for many other programming languages such as Java, .NET, Scala, Clojure, Swift, Python, Kotlin etc. So Reactive Extensions is a combination of the best ideas from the Observer pattern, the Iterator pattern and functional programming.

Even though working with RxJS could be super fun, as Ben Lesh (RxJS Lead) pointed out:

Do NOT Rx All The Things.

Once you figure out RxJS and since some of the best features of Angular use RxJS under the hood, you can do amazing stuff with a few lines of code. State management, form handling, HTTP request caching etc.

My advice is to be patient with RxJS. Once you do understand the power of it, you will fall in love with it.

But before tackling RxJS, you should get familiar with its building blocks: NG CLI, Components & Directives, Pipes, Services & Dependency Injection and Modules. Angular’s official documentation is a great place to start but, of course, you will learn the best if you try it out in your own project.

Beside all that, Angular has a very good support for powerful Animations, Deferrable Views, Internationalization, Accessibility, Web Workers, PWA etc.

With the knowledge of Angular, you can build native mobile applications and even desktop applications with frameworks/libraries such as Ionic, NativeScript and ElectronJS. More on that in the next topic

Angular ecosystem

As I already mentioned, Angular’s ecosystem is pretty wide. From state management libraries such as Akita and NgRx, great UI Components libraries such as Angular Material, DevExtreme, Kendo UI, Nebular, Taiga UI, AG-Grid and many more.

If you want to build Server-Side Rendering and Static Site Generation of Angular applications, you can use AnalogJS. Similar to other meta-frameworks such as Next.JS, Nuxt, SvelteKit and others, Analog provides a similar experience, building on top of Angular.

You can build native mobile applications with Ionic, NativeScript or native desktop applications with Electron. With Ionic, you are basically building a web application since it uses a web view under the hood for running your Angular code. NativeScript offers more native user experience with native UI components built for iOS and Android so it is a bit faster than Ionic. Also, it has a great marketplace where you can easily browse all the plugins that are available for the NativeScript development. And last but not least, with Electron you can build cross-platform desktop applications. Electron embeds Chromium and Node.js so you can write your JavaScript solution and ship it as native desktop app. I guess the most popular application built with Electron is MS Visual Studio Code.

You can find out more about the Angular ecosystem on their (old) documentation website.

But that does not end there. Since NestJS was heavily inspired by Angular, I would put it here too. NestJS is a progressive Node.js framework for building efficient, reliable and scalable server-side applications. As an Angular developer, you would be able to easily write backend code since the pattern is very similar to Angular’s with the use of decorators, pipes, RxJS and services & dependency injection.

Last but not the least, you can take a look at the Nx, tooling for maintaining and scaling monorepos. It has powerful integration with both Angular, NestJS but also React etc.

Conclusion

Angular isn’t going anywhere. The Angular team is actively working on improving the developer experience and with amazing features coming with each release, I really believe that developers are going to enjoy working with this amazing framework more and more.

My two cents, be patient and enjoy the process.

Hope you like this article. Like, share, subscribe if you do. 🙂

Have an amazing day!