Contact-Us Form using Node.js and Express

(  Create Website using Node.js, Mongodb, AngularJS and Express (deployed in Cloud) – Get Code for free  )

Live Demo at : https://www.spotdekho.com/contactus

Download code from here for free.

Please go through Simple Nodejs – Express Webpage for basic setup.

  1. Create an express project for contact-Us form.

Create an express project by executing command “express” in command prompt.

D:\projs>express contactus

  1. Install dependencies.

We will be using nodemailer to send emails, so first we need to update package.json file and then run  command “npm install” inside contactus folder.

Package.json file :

package.json

Run command npm install:

D:\projs\contactus>npm install

  1. Start webserver

We can test our webserver by running command “npm start” and opening url “localhost:3000” in browser.

I will recommend to use “nodemon” instead of “npm start”, as by using “nodemon” we don’t have to stop and start npm with each code change.  To use nodemon we need to install it first. Use below command to install nodemon.

D:\projs\contactus>npm install -g nodemon

Use “-g” as by providing g option nodemon is installed globally and can be used from any folder/subfolders.

Start web-server using nodemon :

D:\projs\contactus>nodemon
[nodemon] 1.11.0
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `node ./bin/www`

  1. Create ContactUs form

You can use below codes to create ContactUs form :

Contact Us form using nodejs, express

Save this file as contactus.jade in “view” folder.

contactus directory structure

5. We need to render contactus.jade when anyone calls contact-us page. For that we need to update index.js file and add lines as below:

Index.js file for contactus form

Now if anyone open http://localhost:3000/contactus will be able to see contactus form. We are now just left with adding contactus post action.

  1. Add action for Contactus “post”

As we are using nodemailer to send emails we need to add it in top of app.js file.

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var nodemailer = require('nodemailer');
var index = require('./routes/index');
var users = require('./routes/users');
var app = express();
.
.

After that we need to describe about contact us post action in app.js file :

contact us post action

To setup nodemailer transport, I have chosen Gmail and have created an application specific password.

That’s all your contactus form is ready. Just hit : http://localhost:3000/contactus

contactus_form

 

That’s all .. enjoy coding and let me know your inputs.

Live Demo at : https://www.spotdekho.com/contactus

Download code from here for free.

(  Create Website using Node.js, Mongodb, AngularJS and Express (deployed in Cloud) – Get Code for free  )

 

 

 

Want to sell products online for free in India ?

https://www.heenz.com 

Heenz.com is a marketplace, where one can become seller and can create his store and sell goods online for no charges, its 100% free. You can also just become a buyer and can buy products. If you want to buy something – here you will find interesting items, may be cheaper than in the store. Start buying and selling in the most easy way on Heenz.com.

We don’t provide delivery option, so make sure you are selecting products from city nearby, so that you can either pickup the product or seller agrees to deliver it to you . Enjoy Shopping !!!

 

 

2 thoughts on “Contact-Us Form using Node.js and Express”

Leave a Reply

Your email address will not be published. Required fields are marked *