Contact Manager 2.0

This post is 4 years old. (Or older!) Code samples may not work, screenshots may be missing and links could be broken. Although some of the content may be relevant please take it with a pinch of salt.

I realised something. I really like working with AngularJS, Express and MongoDB - I think I have officially changed from the LAMP stack to the MEAN stack. I had a little bit of free time in the past week or so, hence I decided to revisit the contact manager that I introduced a few weeks ago and supercharged it a bit. The good news is that the codebase is also available on GitHub.

There are a few things that have changed in this version compared with the previous one - the major changes include:

  • the code is no longer using multiple controllers, only one
  • there's no differentiation between the backend and frontend server, they both live on the same port, hence eliminating the need for jsonp

You might ask, why am I using only one controller? The answer to this is simple - I have create a single page application where you can do the 'add', 'view', 'update' and 'delete' operations using modal windows, whereas before, each operation would have had it's own html page, with their own controller.

I mentioned modal windows. I am using angular-ui that essentially ports the Twitter bootstrap elements into Angular, so I can call a modal window easily from my controller. Sweet!

The code behind all of this is similar to the one explain in the previous (posts). Please, check out the source on GitHub and let me know your thoughts. Also, don't forget to modify the code to represent your environment - change all the paths to the right .js and .css files as well as make sure that the backend server runs on your preferred port (by default it'll start up on port 1222.) - to start up the server execute node app.js in the root folder. Here are a few screenshots as well.