See discussions, stats, and author profiles for this publication at: https://www.researchgate.

net/publication/353481574

E-Commerce web Application by using MERN Technology

Article in International Journal for Modern Trends in Science and Technology · June 2021
DOI: 10.46501/IJMTST0705001

CITATIONS READS

8 15,420

6 authors, including:

Vikas Sharma
Agriculture Victoria Research Centre Melbourne Australia
17 PUBLICATIONS 88 CITATIONS

SEE PROFILE

All content following this page was uploaded by Vikas Sharma on 27 July 2021.

The user has requested enhancement of the downloaded file.

 As per UGC guidelines an electronic bar code is provided to seure your paper
International Journal for Modern Trends in Science and Technology, 7(05): 1-5, 2021
Copyright © 2021International Journal for Modern Trends in Science and Technology
ISSN: 2455-3778 online
DOI: https://doi.org/10.46501/IJMTST0705001
Available online at:http://www.ijmtst.com/vol7issue05.html

E-Commerce web Application by using MERN

Technology
1 1 1 1 1
Nagothu Diwakar Naidu | Pentapati Adarsh | Sabharinadh Reddy | Gumpula Raju | Uppu Sai Kiran | Vikash
2
Sharma

1UG Student, Department of Computer Science, Lovely Professional University, Punjab

2Department of Computer Science Engineering, Lovely Professional University,Punjab

To Cite this Article

Nagothu Diwakar Naidu., Pentapati Adarsh., Sabharinadh Reddy., Gumpula Raju., Uppu Sai Kiran & Vikash Sharma.
E-Commerce web Application by using MERN Technology. International Journal for Modern Trends in Science and
Technology 7, 1–5 (2021).

Article Info
Received on 27-March-2021, Revised on 20-April-2021, Accepted on 24-April-2021, Published on 29-April-2021.

ABSTRACT
In today's generation, most people are using technology for leading their lives and fulfilling their daily
needs. In this generation most of us using E-commerce websites for shopping for clothes, groceries, and
electronics [1]. We have developed one E-commerce web application by using MERNstack technology as it
contains MongoDB, Express.JS framework, React.JS library, Node.JS platform. This application is fully
functional with different views for user and admin and it also has integrated with payment gateway for
checkout. By using this website we can buy different types of t-shirts and we can choose different styles of
t-shirts based upon customer interests. In this project, we can add different products and can delete them
also. We have developed administrative functions for the website such as create a product, create categories,
Admin dashboard, Manage products, Manage categories. For customersrs, they can quickly add their items
to the cart. Based on the items in the cart then the bill gets generate and the customer can pay by using stripe
[2].

KEYWORDS: JavaScript, Software Stack, Framework, Library, Performance Analysis, React.js, MongoDB,
Node.js, Express.js

I. INTRODUCTION customers can select a wide range of products

We all know that technology has become an based upon their interests and their price also, one
essential tool for online marketing these days. If we can compare prices also from one store to another
see all over the world most of the people are by using online shopping [3].
showing interest to buy things in online. However, By encountering the all problems and
we can see that there are many small shops and weaknesses of the offline shopping system,
grocery stores are selling their things offline. With creating an E-commerce webapplication is
this type of selling most of us will face bad necessary for searching and shopping in each
experience. for instance, in some shops seller has shop. These days we have seen so many
the product to sell in the offer but the buyer may e-commerce websites are created like Flipkart,
not know about it, or the customer may need the Amazon, Myntra one can easily buy their necessary
product urgently then he will go to the shop, but products by using these websites. By using these
the product is out of stock, in that case, he will face types of websites one can buy their products by
bad experience. Moreover, in online shopping staying in their home. Eventually, we can see the

1 International Journal for Modern Trends in Science and Technology

difference between the prices of products also as if websites or some electronic medium, in this type,
we see the cost of the product will be slightly high consumers can set their price tag to their work
in offline shopping when compared to online The best example of this type of work is freelancing.
shopping. 4. C2C(Consumer To Consumer)
For creating these types of E-commerce web This type of E-commerce connects consumers to
applications MERN stack will be the best option consumers to exchange their goods and make their
that can help us for creating the most effective and money by charging transactions it will motivate
powerful web applications. buyers and consumers [5].

II. PROBLEM STATEMENT ADVANTAGES:

The purpose of this project is to makes a web 1. A HUGE MARKET:

application which will be easier to find interesting E-commerce will give you an option to reach
clothes and easier to sell goods. This E-commerce customers all over the world, you can buy anything
web application admin can add some categories that you want to from your home. Nowadays people
like summer sales, winter festival, etc. which will are used to doing shopping with their mobiles only.
by attracting customers. Customers also can So, it will add an advantage for E-commerce.
easily search for their favorite goods. They can also
buy them easily by just adding to the cart and they 2. WIDE PRODUCT VARIETY:
can increase or decrease by clicking on the "+" sign In this large world, customers can buy different
and "-" sign. After adding they can check the total types of products from different places, we can buy
amount of the thing which have been added to the electronics from Russia, shoes from japan, clothes
cart. A successful payment gateway way enabled so from London and good old international products,
payment can be done by debit card, credit card, the depth and advantage of E-commerce is
and net banking. uncountable.

3. TRACKING:
III. E-COMMERCE If you order any product in e-commerce you will get
Definition: the details of where the product is shipping and
E-commerce is also known as electronic commerce, when it will reach you, you can cancel the product
it is the process of buying and selling products also if you don't like that product after order.
through the internet, and also the transfer of
money and the data to complete the process of 4. LESS PRICE:
buying or selling a product [4]. In E-commerce websites, we can compare the
In the early days, e-commerce was not that famous prices of products from one website to another
but after increasing the use of mobile phones website. In that way, we can easily know that
everyone was choosing the interest in buying where we will get the product for a lesser price and
things online so, it became popular. we will get the basic idea that how much money we
Types of E-commerce: can spend to buy a particular product.
There are mainly four types of E-commerce
business models 5. MORE CHANCES TO “SELL”:
1. B2C (Business to consumer). In the physical stores' merchant can not give the
It is a business based upon the internet, By using full information about the product, but in the
this model we can sell products to the end-user. E-commerce store customer can get full
2. B2B(Business to business) information about that product and he can see the
It is a business that will happen between large reviews of another customer who bought that
companies, organizations, and businesses, these product previously. In this way, if the product is
days most of e-commerce falls in this category. good it will get more chances to get that product [6].
3. C2B(Consumer to Business)
This type of E-commerce allows that the DISADVANTAGES:
individuals can sell their goods to Companies 1. SECURITY:
In this type of E-commerce, individuals will assign Even though E-commerce providing more benefits
work to complete in the given time through to customers. People are having fear about giving
their data to website owners, so it will give security

2 International Journal for Modern Trends in Science and Technology

issues when we use e-commerce websites for * NodeJS uses asynchronous programming by
shopping. default.
* NodeJS will always store the data in only JSON
2. TAX: format.
If we want to buy a product from e-commerce we ExpressJS:
will have to pay taxes like GST, it will be different It is a famous Library in node.js used for routing. It
from place to place based upon your distance has some methods like a router which help to do
between you and the product, it will be high when curd operations like put, get, post, and delete
compared to buy in physical stores. request
* Robust routing
3. DELAYING IN DELIVERY: * It will focus on high performance
If we order a product in e-commerce, the order may * It is an HTTP helper like it will redirection,
or may not reach you on time, this is one of the catching.
common problems in e-commerce, it will take ReactJS:
time-based upon your distance between you and React is a library of javascript which is created by
the organization from where you ordered. Facebook. React is mainly used as a UI which
means
4. TECHNOLOGY COST: Maximum it is used for client-side applications.
To create a website will take so much amount, one There are so many libraries like React-dom,
needs to spend so much money on building an React-router-dom, and many more to help to build
e-commerce website because he needs to check all the frontend of any application.
the possibilities and provide a good security system * The rendering of the page will be much faster
to that website. than others because it has virtual Dom.
* uses a stable code.
IV. RESEARCH AND DEVELOPMENT * It has a strong community followed [7].

There are so many applications to build a web

V. WEB APPLICATION STRUCTURE:
application and, in this research, we have taken
MERN technologies to use for building a web
application.
Front End (Client-side)
MERN:
E-commerce Database
MERN stands for MongoDB Expressjs Reactjs
Back End (Server-side)
Nodejs. These are the four technologies that help
us to construct or to build this web application.
MongoDB:
Home
It is an open-source cross-platform program. It
Admin Dashboard
comes under the NoSQL database classification. It
Front End Cart
was a document-oriented database. It uses JSON
User Home
format documents with optional Schemas
Dashboard
* Data Flexibility available means we can any every
data in a separate file
Cart
* Large data can be distributed into several
connected applications * High
speed of fetching of data possible because it only
Database MongoDB
depends on indexing.
* It is a horizontally scalable database so it can
handle the data make us easy to distribute to
Models
serval machines.
Back End Routes
NodeJS:
Controllers
NodeJS is a runtime javascript environment that
[8].
works outside the web page. It is mainly used for
server-side applications.
These are some import modules or parts to be
* NodeJS is open source and it is free of cost.
described

3 International Journal for Modern Trends in Science and Technology

FRONT-END:

Home Page:
The home page of the web Application mainly
contains a list of the t-shirts which are saved in the
database. And there some options that will be in
the menu bar if the user does not sign in/login in
yet then "Sign in" and "Sign up" options will be
there. The home page will show you all types of
T-shirts and they will be displayed to customers,
for example, this homepage has types of T-shirts
such as Doggy T-shirt, Coffe T-shirt, friend T-shirt,
If we want to add another type of T-shirts we can
simply add a wide range of T-shirts, we can give
different prices for different t-shirts based upon Dashboard:
their quality, customers have the facility to add the This page will be different for the user. Admin
product to the cart which they like, the customer Dashboard will have a chance to create some
will have another facility to contact the admin if he categories and can add products to those
has any issues regarding products, prices, and any categories, as well as admin can delete products
other issues all these things have appeared preview and he can change prices also.
image is mentioned below:

BACK-END:
Models:
Sign in and Sign up Here we define the structure of the data that
should in the database. By using some models
These two-option redirect to the page where the which help to store the data in the database like
user can find a form to fill either to create an mongoose, it is one of the famous libraries in
account or to sign in to an account. NodeJS.
Creating the schemas by mongoose with can
Cart mentions the names and type of the data.
After selecting any product users can see their
product on this page and here the payment will be Routers:
carried on. Stripe Payment is included for the cart All the work related to the routing of the pages was
which was a third-party tool that helps users to done here. ExpressJS is a popular library form
done payment by some debit cards, credit cards, routing. CURD operations and routing-related code
UPI's. are saved in this folder.

4 International Journal for Modern Trends in Science and Technology

Controllers: [7] Hoque, S. (2020). Full-Stack React Projects: Learn MERN
stack development by building modern web apps using
In controllers, the definitions of the functions
MongoDB, Express, React, and Node. js. Packt Publishing
which are declared in the routing will be stored and Ltd.
also the codes of the middleware are stored in this [8] Rossi, G., Schwabe, D., & Lyardet, F. (1999, November).
folder. Web application models are more than conceptual models.
In International Conference on Conceptual Modeling (pp.
In the controller phase, the function definitions of
239-252). Springer, Berlin, Heidelberg.
the function which are declared in the Routers will
be done. We are having some middleware also
defined here.

DATABASE:
Data that is entered by the users will be stored in
the database. There are so many databases are
been used nowadays. In this project, we have
MongoDB as a database.
Using the mongoose library, we can connect to
MongoDB. There are so many methods in this
library to create schema and also to save the data
in the database.

VI. CONCLUSION
The main them is to build an e-commerce t-shirt
selling web application with all three i.e., Front
end, back end, and database. This web application
is a fully pledged working web application right
from the login authentication, admin
authorization, add items to cart, using payment
gateway. It can be used by any textile industry on
either a small scale or a larger scale. The web
application is easy for them to access and without
any effort categories can be created and products
can be added by them. It will be very attractive for
the customer to see the products by sitting at home
or office. It will be very helpful for the small-scale
industries without selling to wholesales, large
retails mediators they can directly sell to the
customer by saving money for both.

REFERENCES
[1] Chanana, N., & Goele, S. (2012). Future of e-commerce in
India. International Journal of Computing & Business
Research, 8.
[2] Mai, N. (2020). E-commerce Application using MERN stack.
[3] Ullah, S. E., Alauddin, T., & Zaman, H. U. (2016, January).
Developing an E-commerce website. In 2016 International
Conference on Microelectronics, Computing and
Communications (MicroCom) (pp. 1-4). IEEE.
[4] King, D. N., & King, D. N. (2004). Introduction to
e-commerce. Prentice Hall.
[5] Nemat, R. (2011). Taking a look at different types of
e-commerce. World Applied Programming, 1(2), 100-104.
[6] Niranjanamurthy, M., Kavyashree, N., Jagannath, S., &
Chahar, D. (2013). Analysis of e-commerce and
m-commerce: advantages, limitations and security
issues. International Journal of Advanced Research in
Computer and Communication Engineering, 2(6),
2360-2370.

5 International Journal for Modern Trends in Science and Technology

View publication stats