Getting Started With Node.js, Express, MongoDB
Getting Started With Node.js, Express, MongoDB

Express is a Node.js web application framework that provides a robust set of features to develop rich web applications. Today we are going to deep dive in Node js Express Tutorial. If you want to know what is Node.js and why we use in server side technology, then please read my article

Node js Express Tutorial will use the NoSQL database like MongoDB to store the form values in the database, Express as the Web framework and Node.js as a platform. We will use NPM as a package manager for our dependencies and Git for version control for our code. 

Step: 1 [ Node js Tutorial ]

Create a project folder and go to that directory and put the following command in your terminal.

After answering all the data, in your root folder package.json file will be created. This file is a config file for our dependencies, so when we download new packages from Node Package Manager, package.json file will be automatically updated.

Step: 2 [ Node js Tutorial ]

Get the Express package from Node Package Manager by typing following command on terminal

Step: 3 [ Node js Express Tutorial ]

Create a file in root called “app.js.” This file is our main server file in which it bootstraps the node server, and also it serves some static files. Put the following code in it.

Now go to the terminal, and if you type node app, you will get hello world in a console.

If we do not want to restart the server manually then we can use one package called nodemon. It is kind of server that reloads every time we change the file.

Change the package.json file and add the following line in “scripts” object.

When you type in terminal “npm start”, it will bootstrap the server and when we change the files, it will automatically restart.

Step: 4 [ Node js Express Tutorial ]

If we want to set up a routing in our express app, then type following in it.

Restart the server. Switch to the chrome and hit: http://localhost:3000  We get “Hello Express” in the browser.

Step: 5 [ Node js Express Tutorial ]

First, create a directory in the root folder called “public.” Download bootstrap framework and move CSS and Javascript files to the public directory.

Also, create views directory in the root folder and then in future, we will put our whole HTML files.

For serving static files from our server, put the below code in the app.js file.

Go to http://localhost:3000/css/bootstrap.css  If CSS code is showing up in the browser, then we are on right way.

So, our whole app.js file will look like this.

Step: 6 [ Node js Express Tutorial ]

Here we are going to use “ejs” as a templating engine, so first, we need to download that through NPM

Now we need to update our app.js file to set the view engine.

Create one view file in views >> index.ejs and put the following code in it.

Step: 7 

Set up routes for our application. So first we need to use Router module provided by Express

Now we can create as many routes as we want.

Here we have defined itemRouter, so we can create routes from that, so we are creating following routes from the itemRouter module.

So, when we hit the URL like http://localhost:3000/items, the express will render the items.ejs view.

Now, we need to create items.ejs view and put just one line to check whether if it is running or not.

If you will see in the browser, Node.js Express Tutorial will be there. Now, create another view like singleItem.ejs in views folder and then put in that just Single Route. If you hit the URL like http://localhost:3000/items/single, then also we can see Single Route in our browser. So, first, we define our root router like /items and then from that we can give some another route from that route, so that way route handling is very easy in Node Express Tutorial application.

Step: 8 

We are going to separate our routes code from our app.js files. So, create routes folder in the src folder and in routes folder create a file called itemRoutes.js. Our path will look like src >> routes >> itemRoutes.js. Put the following code in it.

Here, we have exports itemRouter module so that app.js can include this router module and our application will not crash.

Now in app.js file, we need to require this file so that our code won’t break. Our app.js file will look like this.

In above code, we have required the itemRouter module and then use it in our application.

Step: 9 

Now, we need to create add item page, so in views folder, create one ejs file called addItem.ejs

Next step is to register this route in itemRoutes.js file, so put the following code in it

Switch to your browser and type http://localhost:3000/items/add

You will see one form, from which we can add new items.

Step: 10 

We need to setup a MongoDB database, so first we need to download a package called Mongoose in our application.

Require this package in our application by the following code.

Connect our application with the Mongo database.

Here, I have used MongoLab.  MongoLab’s MongoDB hosting platform is the fastest growing cloud Database-as-a-Service in the world. I am using sandbox account, which provides us 500MB data storage. Sign up and create a database and user as well.

They provide you one URI, which you have to connect via Mongoose API and then you are ready to go. I have created database called ‘aufinancex

Step: 11

If we want to send the post request to the server then we need to add one express middleware, which parses our data to json and we can get easily our request on the server side.

Include this body-parser in our main application file

Step: 12 [ Node js Express Tutorial ]

Now, create a  post route in the itemRoutes.js, put the following code in it.

Here, I have used Item model, which is not created yet, so let’s do it. Create a directory in src folder called models and go in then and create one file called Item.js  So, your directory structure will look like this. src >> models >> Item.js

In Item.js, I have defined Schema in which what fields are using that collection are defined. In our above example, I have just used an item, so define item object and also define collection name. At last export the Item model.

Step: 13

 

In this file, we have required that model and then use it to save the data.

We have passed the request got from form to the Item model’s constructor and then call save method on it. It will return a Promise, in our case, we are using bluebird library. If it resolves then we got redirect back to the index page and if fail then throw an error.

Step: 14 [ Node js Express Tutorial ]

Now, we need to get the data from the database, so you just need to put following code in the itemRoutes.js file

Also, we need to modify that item.ejs view to show the data.

Step: 15 [ Node js Express Tutorial ]

Create an edit route and edit view.

Create editItem.ejs file in the views directory

Also, update the index view to update edit link route

Step: 16 

Change the edit form action to update the data

Register the update route in itemRoutes.js file

So, finally, you can update the item, whichever you want.

Step: 17 

Now, remove functionality is remaining, which we will do and then call it a day.

Also, update the index view to update delete link route.

So our some final files will look like this.

Possible Errors

Please check all the dependency versions of yours with me. Mine package.json file looks like this.

2) If you have any warning like this,

(node:8996) DeprecationWarning: open() is deprecated in mongoose >= 4.11.0, use openUri() instead, or set the useMongoClient option if using connect() or createConnection()
Server is running on Port: 3000
Db.prototype.authenticate method will no longer be available in the next major release 3.x as MongoDB 3.6 will only allow auth against users in the admin db and will no longer allow multiple credentials on a socket. Please authenticate using MongoClient.connect with auth credentials.

Possible Solutions

Please connect the database with MongoDB client driver and you can get rid of this warning

For more info, please visit https://expressjs.com/en/guide/database-integration.html

Github Link:  Node js Express Tutorial

Steps to use this project from GitHub

1 COMMENT

  1. Literally Victor’s is not the simply cafe inside Philly in which the waitresses and waiters bring upon the society of singing. Significant Notice Restaurant does it … and they do it with dwell songs.

LEAVE A REPLY

Please enter your comment!
Please enter your name here