Contact Manager 2.0

I’ve realised something. I genuinely enjoy working with AngularJS, Express, and MongoDB. I’ve officially jumped from the LAMP stack to the MEAN stack. I had some free time this past week, so I went back to the contact manager I built a few weeks ago and gave it a proper upgrade. The codebase is up on GitHub.

Here’s what changed from the previous version:

• The code no longer uses multiple controllers. Just one.
• There’s no split between backend and frontend servers. They share the same port, which kills the need for jsonp.

Why a single controller? I turned the whole thing into a single page application. Add, view, update, and delete all happen through modal windows now. Before, each operation had its own HTML page and its own controller.

About those modals: I’m using angular-ui, which ports Twitter Bootstrap elements into Angular. Calling a modal from a controller becomes trivially easy.

The underlying code is similar to what I explained in the previous posts. Check out the source on GitHub and let me know what you think. Make sure to update the paths to point at the right .js and .css files for your environment, and confirm the backend server runs on your preferred port (it defaults to port 1222). To start the server, run node app.js from the root folder. Here are a few screenshots.