MEAN Introduction + Learning Materials

Move over LAMP, a next generation Web Development stack is about to take over and it’s called the MEAN stack. So what is the MEAN Stack you ask and what are the benefits? The MEAN Stack is made up of MongoDB as the database, Express as the backend, AngularJS as the frontend and Node.js as the platform. The main benefit is that everything is based on JavaScript/JSON.

“Having one, standalone language makes development a lot easier. MongoDB stores JSON like objects (actually, they are BSON – Binary JSON objects), which can be served easily from Node.js and Express, either with the native MongoDB driver or with third party drivers, such as Mongoose. Further to this, it’s incredibly straight-forward to pass a JSON object to AngularJS and store it as a variable in the $scope for example. This also means that there is no differences between the objects that are stored & returned by the backend and the objects used by the frontend. You have a very nice, self-contained storage & display mechanism throughout your application, all using the same data, and most importantly, the format of your data is the same.” – Tamas Piro

So with that introduction out of the way, let’s get started. Feel free to list any other reference material’s that I may have missed in the comments.

The Basics

I am going to start with some basic learning references for AngularJS, Node.js, MongoDB & Express to serve as a refresher or help get you started. Feel free to skip this section if you are already familar with them. Also, this is a very basic list and there is a vast amount of learning resources out for each of these technologies alone, so by no means will this have covered everything.

AngularJS:

http://toddmotto.com/ultimate-guide-to-learning-angular-js-in-one-day/

http://www.thinkster.io/pick/GtaQ0oMGIl/a-better-way-to-learn-angularjs

http://egghead.io

MongoDB:

http://www.mongodb.org/about/introduction/

http://docs.mongodb.org/manual/installation/

http://docs.mongodb.org/manual/tutorial/getting-started/

Express:

http://blog.modulus.io/nodejs-and-express-create-rest-api

http://net.tutsplus.com/tutorials/javascript-ajax/introduction-to-express/

http://coenraets.org/blog/2012/10/creating-a-rest-api-using-node-js-express-and-mongodb/

Node.js:

http://nodeschool.io

http://nodetuts.com

Learning MEAN

So now that your familar with the underlying technologies, let’s get started with a few articles that give you a broad overview of exactly what the MEAN stack is.

Overview:

http://tamaspiros.co.uk/2013/09/19/what-is-the-mean-stack/

https://thecodebarbarian.wordpress.com/2013/04/29/easy-web-prototyping-with-mongodb-and-nodejs/

Now your ready to get up and running, there are a few ways to get started depending whether you want to develop on your local machine, on a virtual machine or in the cloud, these tutorials will get you set up on which ever one you decide to choose.

Setting Up/Installation:

Local Machine:

http://www.mean.io (Recommended Way)

https://thecodebarbarian.wordpress.com/2013/07/22/introduction-to-the-mean-stack-part-one-setting-up-your-tools/ (Manual/Using Windows)

Cloud:

http://blog.marketto.it/2013/09/17/free-server-for-mean/

Virtual Machine:

https://github.com/cmoudy/mean-vagrant (VirtualBox and Vagrant needed)

Okay now your all set up and know the basics but your thinking how exactly do I create an application utilizing all these pieces together? Well don’t worry, a good amount of tutorials have been made that will run you through making apps using the MEAN Stack. I would suggest starting with the top one and working your way down, the top one is in my opinion by far the best and most comprehensive MEAN tutorial available currently.

Tutorials

http://www.thinkster.io/pick/GUIDJbpIie/angularjs-tutorial-learn-to-build-modern-web-apps

http://act2.me/letshavelaunch/

https://thecodebarbarian.wordpress.com/2013/07/29/introduction-to-the-mean-stack-part-two-building-and-testing-a-to-do-list/

Four Part Tutorial showing how to make a Contact Manager

http://tamaspiros.co.uk/2013/06/27/contact-manager-written-in-angularjs-express-and-mongodb-episode-1/

http://tamaspiros.co.uk/2013/07/01/contact-manager-written-in-angularjs-express-and-mongodb-episode-2/

http://tamaspiros.co.uk/2013/07/04/contact-manager-written-in-angularjs-express-and-mongodb-episode-3/

http://tamaspiros.co.uk/2013/07/18/contact-manager-2-0/

Other Various Useful Tutorials

http://briantford.com/blog/angular-express.html (Covers 3 out of the 4, no Mongo)

http://pixelhandler.com/blog/2012/02/09/develop-a-restful-api-using-node-js-with-express-and-mongoose/ (Covers 3 out of the 4, no AngularJS)

http://www.ewal.net/2013/09/24/bitcoin-command-fun-with-angularjs/ (Written in CoffeeScript)

http://www.breezejs.com/samples/zza (MEAN + Breeze.js)

So now you should have a good idea how to utilize the MEAN Stack to create a web application. Go get started with one if you like! That doesn’t mean the learning should stop though. Going forward, continuously engage yourself in gaining a more thorough understanding of each the individual technologies and all the various features they offer to be able to fully utilize them when creating your app.

Comments