A
MINI PROJECT REPORT
on
E-COMMERCE WEBSITE USING MERN STACK
BACHELOR OF TECHNOLOGY
in
COMPUTER SCIENCE AND ENGINEERING
Submitted by
(MIP-01)
Student Name : 187Y1A05D4
Under the Guidance
of
Mr.
Assistant Professor
DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING
MARRI LAXMAN REDDY
INSTITUTE OF TECHNOLOGY AND MANAGEMENT
(AUTONOMOUS)
(Affiliated to JNTU-H, Approved by AICTE New Delhi and Accredited by NBA & NAAC With ‘A’ Grade)
April 2021
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM i
CERTIFICATE
This is to certify that the project report titled “E-Commerce Website Using MERN Stack” is
being submitted by Ravula Gowtham Reddy (187Y1A05D4) in IV B.Tech II Semester
Computer Science & Engineering is a record bonafide work carried out by him. The
results embodied in this report have not been submitted to any other University for the
award of any degree.
Internal Guide HOD
Principal External Examiner
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM ii
DECLARATION
I hereby declare that the Major Project Report entitled, “E-Commerce Website Using
MERN Stack” submitted for the B.Tech degree is entirely my work and all ideas and
references have been duly acknowledged. It does not contain any work for the award of
any other degree.
Date:
Ravula Gowtham Reddy
(187Y1A05D4)
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM iii
ACKNOWLEDGEMENT
I am happy to express my deep sense of gratitude to the principal of the college Dr. K.
Venkateswara Reddy, Professor, Department of Computer Science and Engineering,
Marri Laxman Reddy Institute of Technology & Management, for having provided me
with adequate facilities to pursue my project.
I would like to thank Mr. Abdul Basith Khateeb, Assoc. Professor and Head, Department
of Computer Science and Engineering, Marri Laxman Reddy Institute of Technology &
Management, for having provided the freedom to use all the facilities available in the
department, especially the laboratories and the library.
I am very grateful to my project guide Mr. Prasad Banoth, Assoc. Prof., Department of
Computer Science and Engineering, Marri Laxman Reddy Institute of Technology &
Management, for his extensive patience and guidance throughout my project work.
I sincerely thank my seniors and all the teaching and non-teaching staff of the Department
of Computer Science for their timely suggestions, healthy criticism and motivation during
the course of this work.
I would also like to thank my classmates for always being there whenever I needed help or
moral support. With great respect and obedience, I thank my parents and brother who were
the backbone behind my deeds.
Finally, I express my immense gratitude with pleasure to the other individuals who have
either directly or indirectly contributed to my need at right time for the development and
success of this work.
CONTENTS
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM iv
S NO. TITLE PAGE NO.
ABSTRACT Vi
LIST OF FIGURES Vii
LIST OF TABLES Viii
SYMBOLS & ABBREVIATIONS IX
1 INTRODUCTION 1
2 E-COMMERCE 8
2.1 Definition 8
2.2 Types 10
2.3 Advantages 11
2.4 Challenges 11
3 MERN Stack 13
3.1 JavaScript 13
3.2 NodeJS 13
3.3 Express.js 19
3.4 MangoDB 20
3.5 ReactJS 21
3.5.1 Virtual-DOM
3.5.2 Component
3.5.3 Props and State
3.5.4 Pros and Cons of RactJS
3.6 MERN Stack in Website Development
3.6.1 Concept of Stack technology
3.6.2 Concept of MERN Stack
3.6.3 Highlights in MERN Stack
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM v
4 E-commerce Web Application 33
4.1 Home Page
4.2 Login System
4.2.1 Sign Up
4.2.2 Sign In
4.3 Dashboard
4.3.1 Admin Dashboard
4.3.2 User Dashboard
4.4 Shop Page
4.5 Cart Page
4.5.1 Cart CRUD
4.5.2 Payment Gateway
7 CONCLUSION AND FUTURE ENHANCEMENTS 43
8 REFERENCES 44
APPENDIX A 45
APPENDIX B 51
APPENDIX C 54
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,
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM vi
and electronics . We have developed one E-commerce web application by using MERN stack
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 customers, 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 .
LIST OF FIGURES
FIG. NO FIG. NAME PAGE NO.
1.1 Internet Of Things 4
1.2 Wireless Sensor Network (WSN) 5
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM vii
3.1 Arduino Atmega 328(UNO) 15
3.2 Arduino Ethernet Shield 16
3.3 ML8511 UV Sensor 16
3.4 DHT11 Temperature and Humidity Sensor 17
3.5 MQ3 Gas Sensor 17
3.6 Water Level Sensor 18
3.7 5V Solar Panel 18
3.8 Rechargeable Li Ion Battery 19
3.9 Architecture Of The Setup 19
3.10 Flow Chart Of The System 20
4.1 Essential Use Case Diagram 24
4.2 Class Diagram 25
4.3 Sequence Diagram 26
4.4 Activity Diagram 27
4.5 Collaboration Diagram 27
Smart Farm Using Renewable Energy Resources Circuit
4.6 Diagram 34
5.1 Block Diagram 33
5.2 Arduino Microcontroller 34
LIST OF TABLES
TABLE NO. TABLE TITLE PAGE NO.
3.1 Software Requirements 14
3.2 Hardware Requirements 14
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM viii
5.1 Summary 35
6.1 Above prescribed (favorable) levels 41
6.2 Below Threshold Level Use Case 42
SYMBOLS & ABBREVIATIONS
DOM : Document Object Model
ISO : International Organization for Standardization
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM ix
NPM : Node Package Manager
API : Application Program Interface
HTM : Hypertext Markup Language
L
HTTP : Hypertext Transfer Protocol
URL : Uniform Resource Locator
JSON : JavaScript Object Notation
JS : JavaScript
JSX : JavaScript XML
XML : Extensive Markup Language
MINI PROJECT REPORT (2018-2022 Batch) Dept. of CSE, MLRITM x
