Developing MEAN Application Part 1

MEAN stands for MongoDB, Express.js, AngularJS and Node.js. By using MEAN stack we can make end-to-end web application.

MongoDB    -    Database, used to store data

Express.js    -    Node.js web application framework, framework for Node.js so that
                          we do not have to deal with core Node.js

AngularJS    -    Frond-end framework

Node.js        -     Application Server, by using Node.js we can write back-end code in
                          JavaScript

I am considering that you have basic knowledge of each MEAN technologies. Here we are making end-to end web application using MEAN stack. In the part 1 of this tutorial we are doing server side coding that is Node.js, Express.js and MongoDB and test all our CRUD operation in Postman - REST Client. In the part 2 of this tutorial we will do the front end coding in AngularJS.

What we are making
We are making a very simple web application.

As you can see from the image, we can create user, edit user, delete user and get users. And these CRUD operation goes end-to-end. When we talk about end-to-end it means when we create user then it created a user entry in mongoDB database and when we delete user it also delete user from mongoDB database. Similarly on edit it edit user to mongoDB database and on refreshing the page it gets all users from mongoDB database.

So lets start

Open your IDE or editor you are using and create a new project and name it as MEAN_App.

Create a file app.js in your project.

you have to install express.js and mongodb npm package in your project. first create a package.json file. Open terminal and write command

     npm init

press enter 2-3 times and it will create a package.json file in your project.

Now you can install express.js in your project by below command.

npm install express --save

And mongodb npm package by below command.

npm install mongodb --save

This will install express.js and mongodb npm package in your project and you can see that, express and mongodb are added to your package.json file.

Now your project has 2 files and 1 directory

Now we can write code. First we create a connection to mongoDB database and write POST request.

write following lines of code in app.js

The above code does not create a database to mongoDB. It just create a connection to mongoDB database. We have to write a POST request for creating a database. And when POST request execute it create a database named MEAN_Demo and make a user entry to collection.

Now you have to start your mongoDB by tying below command in terminal.

mongod

Your mongoDB is started. Now you can run server by typing below command

node app

If node app command runs successfully then you will see the above output in terminal.

Now we will write a POST request. but before writing a POST request install body-parser npm package by typing below command in terminal.

npm install body-parser --save

This will install a body-parser npm package in your project. And you can see that in package.json file. Now we can write a POST request.

write below lines of code in app.js for POST request.

We have updated app.js file so we have to start the server again to see the changes.

So terminate node app process and run it again by typing node app command in terminal.

Now open Postman - REST Client

Click the image to see it in bigger size. By this POST request database named MEAN_Demo is created in mongoDB database. A user entry in user collection is also created. You can see that in Robomongo.

You just created a database and make a user entry. Similarly we can add another user to database using Postman - REST Client.

Now you can see in Robomongo, there will be two users.

Now we will write a GET request to get all users from database.

Write following lines of code in app.js for GET request.

We have updated app.js file so we have to start the server again to see the changes.

So terminate node app process and run it again by typing node app command in terminal.

Now go to Postman - REST Client

We have created a GET request and get all users from database in Postman - REST Client. Now we will write a PUT request to edit a user.

Write below lines of code in app.js

Above code update a user by _id. So we have to give user id in URL param and new name in request body.

We have updated app.js file so we have to start the server again to see the changes.

So terminate node app process and run it again by typing node app command in terminal.

Now go to Postman - REST Client

In above PUT request we are passing id of user in URL param and new name in body. Here we have updated the name of user deepak to piyush and you can see that in Robomongo.

As you can see from above image we have updated the user name deepak to piyush. Now we will write a DELETE Request to delete a user.

Write below lines of code in app.js

We have updated app.js file so we have to start the server again to see the changes.

So terminate node app process and run it again by typing node app command in terminal.

Now go to Postman - REST Client

We have deleted the user named piyush and we can see it in Robomongo.

As you can see from above image, we have deleted the user named piyush and there is only one user named chetan in mongoDB database.

We have completed all the CRUD operations that is create user, get users, update user and delete user. In the second part of this tutorial we will do the front end coding in AngularJS. Here is the link of second part http://nothingbeyondjavascript.blogspot.in/2015/06/developing-mean-application-part-2.html