Notice that I said just ‘stack’ and not ‘full-stack’. Angular and Node are the main components that I use in most of the applications I write nowadays. I use Angular for the front-end part and Node for the back-end which in almost all my applications, it acts like a proxy that connects to an external API or database, handles files or runs scripts locally.

Ok, what more?

Now, depending on the nature of the application, I add other technologies to the stack. For example for a PC application I might plug in Electron in the Node app. If I want to save information locally, I use Sequelize in conjunction with a database driver (e.g. sqlite3). If I put it directly on a server, then I may use MongoDB.

Moreover, you can do some pretty neat stuff with these technologies. For one of the applications I work on as my daily budget lifter I use quite a complicated stack. To give an idea on how far you can go, I will list the technologies here:

  • openFrameworks – C++ framework aimed mainly for media applications; I use it mostly for the openCV and video player capabilities
  • Awesomium – used to draw a web view in the C++ application and bind javascript functions to C++ functions
    • ofxAwesomiumPlus – an addon I contributed to, used to integrate Awesomium with openFrameworks
  • A web app using AngularJS and NodeJS connecting to a Drupal CMS API and managing a local sqlite3 database

As you can see, you can get really creative here. In the application I described above I needed complex REST capabilities, database management and a nice UI; Angular and Node were perfect for the task.

How exactly it works

A couple of years ago, I got tired of using jQuery for one of the projects I was working on and I was looking for alternatives. Angular’s popularity was booming at that time and I thought of giving it a try.

To begin with, I searched for tutorials online. Since it was quite different from jQuery, it felt a bit weird using it. Eventually I came across this great tutorial on YouTube explaining how to set up a MEAN stack application. It’s pretty much the same architecture I use today, but I improved it in many ways along the way.

To begin with, the Node part acts like a proxy for the Angular app meaning that all the REST calls go straight to Node and they are handled there. To put it in other words, Node is an API that Angular connects to.

Let’s write some code

Creating a server with Node:

Then a sample route in the API:

Having this route in the API will allow the Angular app to connect to it if set up correctly. On the Angular side I’m using a library called restangular. This library can set up a global connection to an API endpoint and then create factories to point to specific endpoints on that API. For example:

Now we can use the factory in the controllers:

These are pretty much the basics of the stack, but as I said above, you can get really creative and use these technologies in conjunction with others.

Conclusion

This was a very brief walkthrough for the Node and Angular stack that I’m using at the moment. It didn’t go into specifics too much and offered an overview on how can these technologies can be used.

What stacks are you guys using? Did you give Angular and Node a try? Let me know in the comments.