At AmberBit we use AngularJS, and it is slowly becoming our second framework of choice after Rails. We won’t run away from Ember either, but Angular is significantly easier to pick up, and to introduce incrementally in existing projects. Oh, and there are some awesome libraries out there that make it even more productive.

1. ui-router - a proper router

Let’s face it, the built-in Angular router is not so great. It will do the job for simple apps, and can be a good choice when you are just starting to shift application logic from back-end to front-end. It preserves stateless view on the URLs that you may already have. This, however, introduces limitations that a front-end applications do not need to borrow from back-ends. ui-router is great replacement for the built-in router, that is using state machine. Before new, more powerful, default AngularJS 2.0 router is out, ui-router is a must-have!

2. UI Bootstrap - Twitter’s CSS framework implemented in AngularJS

Twitter Bootstrap is a mature, easy to use and customize CSS and grid system framework that we use and love. Some of it’s components, however, require JavaScript to function. This includes modals, alerts or even some of button’s functionality. When you make a switch to AngularJS, you could stick to using jQuery-based Bootstrap JavaScript extensions, but you would soon learn that this is very impractical. Switch to UI Bootstrap to regain full power of Twitter Bootstrap, the Angular-way.

3. Ionic - cross-platform mobile development framework with AngularJS

As a rule of thumb, you should build your applications using native language and libraries, and that’s what we usually do. There are, however, certain classes of applications you might want to build using HTML5, and package them into native binaries. Tools such as PhoneGap are widely used in such cases. To use the power of AngularJS, you should try using Ionic.

4. angular translate - support multiple languages in one application

If you are building applications for European or international markets, you learn fast that people do not speak only English. To meet the local market needs, you often have to localize and translate the application. To extend Angular’s built in i18n/i10n functionality with supporting different national translations of your application’s texts, we highly recommend angular translate. You can even integrate it with translations stored in your Rails back-end (topic for separate blog post, I guess).

5. Angular Material Design - Google’s new fancy UIs on the web

With introduction of its upcoming Android L, Google wants to unify the user experience on the web, Chromebooks and mobile / tablet devices. They launched Material Design specification already, and there is at least one library - Polymer that embraced the concept. If you want to build the future apps for Google-branded devices in AngularJS, have a look at https://material.angularjs.org/.

Summary

These were my subjective picks, but I’d love to learn more. What would be yours?

Post by Hubert Łępicki

Hubert is partner at AmberBit. Rails, Elixir and functional programming are his areas of expertise.