Installing and Using the MEAN stack

发布于 - 最后修改于

The words forming the MEAN acronym are MongoDB, Express.js, Angular.js and Node.js. Merging these technologies together was quite a new thing when it started. In the last three or four years, JavaScript was the language that has gained significant traction from developers (not only Web developers), developer communities, and open source communities.

There are startups all around the world who are using this technology stack to deliver their first MVP.

Why do developers like the MEAN stack?

As I can see, there are four (main) reasons why developers choose to develop using the MEAN stack.

1. It is free, and doesn't require a license cost to develop an application. For a developer (freelancer or not) who wants to work on a project such as a Web page, a mobile application, or a Web service, it is the perfect choice. For startups, the initial costs are very important; they need to reduce their costs, so they try to use open source and free stuff.

2. Each element in the stack is JavaScript based. It can be a huge advantage to reuse the existing knowledge on the UI side as well as on the server side. In bigger software development teams, the two parts (front and back-end) are implemented using different technologies and in many cases, the developers are not familiar with the other parts' technology. Using the same technology on the whole platform is also an advantage from the people-management perspective, since developers can be swapped and can easily help out each other.

3. Large community support. Each of the technologies in the stack has a large and very active community, with fast responses to questions, bug reports and frequent releases.

4. It is modular. In case developers don't like Express.js, they can remove it from the stack and only implement the server side code using pure Node.js code. The flexibility of removing and adding parts to the stack makes it easy to use the MEAN stack for development.

Components

1. MongoDB is a NoSQL (Not only SQL) document store database, created by 10gen. It is open source, but has enterprise support. It is a schema-less database and it stores data in a BSON format (the binary version of JSON objects). Since the result of database queries are JSON objects, it is very convenient to use with the other technologies in the stack. There is no need for manual data mapping and type conversion after querying the database.

2. Express.js is a Web framework built for Node.js. It is supported by StrongLoop and it has a code generator tool, which offers a standard code and folder structure for developing your application.

3. Angular.js is an MVC JavaScript UI framework, which offers two-way binding, dependency injection, filters, UI components and easily testable code.

4. Node.js is JavaScript-based platform, designed to have an event driven architecture, and it provides a non-blocking, asynchronous execution environment that helps applications scale and deliver better performance.

Installation

On an Ubuntu(14.04.1) machine, first you will have to install Node.js, NPM (Node Package Manager) and MongoDB:

    greg@earth:~$ sudo apt-get install nodejs npm mongodb

Using NPM you will install express.js and express-generator, the tool for code generation (the -g flag of the npm install the package globally, not only for the local project):

    greg@earth:~$ sudo npm install express -g
    greg@earth:~$ sudo npm install express-generator -g

 

nstalling Angular is not needed, because its a client side JavaScript framework, it can be loaded from a CDN to the web-page.

First MEAN project

Using the express code generator you can create a minimal project to start with:

greg@earth:~$ express myFirstMeanApp

This will create a new folder named myFirstMeanApp, and it will create a basic directory structure for the project, having views, routes, bin and public folders. The naming is obvious.

greg@earth:~/mean/myFirstMeanApp$ tree
.
├── app.js
├── bin
│ └── www
├── package.json
├── public
│ ├── images
│ ├── javascripts
│ └── stylesheets
│ └── style.css
├── routes
│ ├── index.js
│ └── users.js
└── views
├── error.jade
├── index.jade
└── layout.jade

7 directories, 9 files

To run the application, you will have to install the dependencies and start the project:

    greg@earth:~/mean$ cd myFirstMeanApp
    greg@earth:~/mean/myFirstMeanApp$ sudo npm install
    greg@earth:~/mean/myFirstMeanApp$ ./bin/www

After the application starts, you can navigate to the http://localhost:3000/ and you will see the web-page below:

Express.js main page

You now have a MEAN development environment and also a project set up for development.

发布于 20 二月, 2015

Greg Bogdan

Software Engineer, Blogger, Tech Enthusiast

I am a Software Engineer with over 7 years of experience in different domains(ERP, Financial Products and Alerting Systems). My main expertise is .NET, Java, Python and JavaScript. I like technical writing and have good experience in creating tutorials and how to technical articles. I am passionate about technology and I love what I do and I always intend to 100% fulfill the project which I am ...

下一篇文章

Setting Up a Ghost Blog Platform