You are on page 1of 52

Project Report on

ONLINE-SHOPPING
WEBSITE
A Project Report submitted in the partial requirement for the award of the degree of
BACHELOR OF TECHNOLOGY
( B.Tech. )

In
COMPUTER SCIENCE & ENGINEERING

Samaksh Kumar (20001001098)


Puneet Sharma (20001001088)
Nikhil (20001001073)

Under the supervision of


Dr. Jitender Kumar Bhardwaj
(Assistant Professor, CSED)

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING


Deenbandhu Chhotu Ram University of Science and Technology,
Murthal, Sonepat-131039
DECLARATION

I hereby declare that the project entitled “Online-Shoppimg Website” submitted by


us in partial fulfillment of the requirement for the award of BACHELOR OF
TECHNOLOGY Degree in COMPUTER SCIENCE AND ENGINEERING,
comprises our original work and due references have been made in text to all other
material used.

Signature of the Students:

Samaksh Kumar(20001001098)

Puneet Sharma (20001001088)

Nikhil (20001001073)

Place: DCRUST, Murthal


Date:

1
CERTIFICATE

This is to certify that the project entitled “Online-Shoppimg Website” is the


bonafide work carried out by
Samaksh Kumar (20001001098)

Puneet Sharma (20001001088)

Nikhil (20001001073)

who are students of B. Tech, DCRUST, Murthal, during the year 2023 , in partial
fulfillment of the requirements for the award of the Degree of Bachelor of
Technology and that the project has not formed the basis for the award of any degree
earlier.

Signature of the Guide:


Name: Dr.Jitender Kumar Bhardwaj
Designation : Assistant Professor

Place: DCRUST, Murthal


Date:

2
ABSTRACT

The purpose of the project is to help the customers to find day to day users the products easily
at affordable and best price.It also helps the local venders to sell their product to the bigger
market which saves a lot of time and transportation cost. The project basically has the
following modules.
1. Home Page
2. Products Page
3. Product Detail Page
4. Sign in/Register Page
5. My Profile
6. Cart
7. Transaction Page
8. Contact
9. About

The app is only used in online mode with a suitable internet connection and cannot be used
offline.

3
ACKNOWLEDGEMENTS

Acknowledgement is the perfect way to convey heartiest thanks to all outstanding


personalities. We consider ourself fortunate to get the opportunity of doing a
project, yet the opportunity could not have been utilized without the guidance and
support of many individuals.
We register our immense gratitude to project guide Dr. Jitender Kumar Bhardwaj
(CSE Dept.), DCRUST.

We are highly indebted to “Dr. Jitender Kumar Bhardwaj ” for giving us a rare
opportunity to undertake this project.
We also extend our immense gratitude to “Dr. Sukhdeep Sangwan”(Head of
Computer Science Dept) for his kind help and support .

Finally, We would be failing our duties if We did not put on record our deep
sense of obligation to our parents and friends, who provided us with an
environment conducive to hard work.

4
Table of contents PAGE NO.

Title Page
Declaration of the Student 1
Certificate of the Guide 2
Abstract 3
Acknowledgement 4

CHAPTER NO. TITLE

Chapter 1. INTRODUCTION
1.1 Project Overview 7
1.2 Problem Statement 8
1.3 Feasibility Study 8-9
1.4 Feasibility Report 9

SYSTEM ANALYSIS AND


Chapter 2. DESIGN
2.1 System Analysis 10
2.1.1 Existing System 10
2.1.2 Proposed System 10
2.2 Requirement analysis 11-12
HARDWARE AND SOFTWARE
REQUIREMENTS
Chapter 3.
3.1 Hardware Specification 13
3.2 Software Specification 14

Chapter 4. IMPLEMENTATION / CODING


4.1 Visual Studio Code 14-21
4.2 Node.js 22-23
4.3 Express.js 23
4.4 MongoDB 24-25

5
Table of contents PAGE NO.

4.5 MVC Architecture 25-30


4.6 JSON Web Token 31
4.7 NodeMailer 31-32
4.8 Front End 32-36
4.9 Stripe 37

Chapter 5. CONTROL FLOW DIAGRAMS


5.1 Control Flow of the Website 38
5.2 Control Flow of the User 39

Chapter 6. IMPLEMENTATION
6.1 User Interface 40
6.2 Footer 41
6.3 Filter Used 41
6.4 Cart 42
6.5 Login Page 42
6.6 Shipping details 43
6.7 Payment 43
6.8 Order Placed 44
Chapter 7. GREEN IMPLEMENTATION 45-47
Chapter 8. LIMITATION OF APPLICATION 48
Chapter 9. OUTCOMES & LEARNING 49
Chapter 10. FUTURE PROSPECTS 49
Chapter 11. INSTALLATION 50
Chapter 12. CONCLUSION 51
Chapter 13. REFRENCE 52

6
1.1. Project Overview

The main objective of the project is to develop a web application which could help users find day
to day products and sellers sell their products online in this time of internet. The whole sales system
for your business is automated online. You will therefore save on staff, wages and other business
costs, which are usually an expense such as electricity, rent and heating costs. The money that you
have saved can then be used to develop your e-commerce website and product range further. E-
commerce websites will also help you expand your product offering faster than is normally
possible within an offline business situation.

7
1.2. Problem Statement

Problem statement is one of the basic and important phases of project phase. When the basic
problem is determined, it is documented and the symptomatic problem is analyzed, then the current
list of basic problem is completed. A system is simply a set of components that interact to
accomplish some purpose.
Major problems faced by users are:

The purpose of any e-commerce website is to help customers narrow down their broad ideas and
enable them to finalize the products they want to purchase. For example, suppose a customer is
interested in purchasing a mobile. His or her search for a mobile should list mobile brands,
operating systems on mobiles, screen size of mobiles, and all other features as facets. As the
customer selects more and more features or options from the facets provided, the search narrows
down to a small list of mobiles that suit his or her choice. If the list is small enough and the
customer likes one of the mobiles listed, he or she will make the purchase.

Therefore, by facing all these problems we personally feel that there is a need for e-commerce
website to save precious time and resources.

1.3. Feasibility Study

All projects are feasible given unlimited resources and infinite time. But the development of
software is plagued by the scarcity of resources and difficult delivery rates. It is both necessary
and prudent to evaluate the feasibility of a project at the earliest possible time.

Three key considerations are involved in the feasibility analysis.

Economic Feasibility:

This procedure is to determine the benefits and savings that are expected from a candidate system
and compare them with costs. If benefits outweigh costs, then the decision is made to design and
implement the system. Otherwise, further justification or alterations in the proposed system will
have to be made if it is to have a chance of being approved. This is an ongoing effort that improves
in accuracy at each phase of the system life cycle.

8
Technical Feasibility:

Technical feasibility centers on the existing computer system (hardware, software, etc.,) and to
what extent it can support the proposed addition. If the budget is a serious constraint, then the
project is judged not feasible.

Operational Feasibility:

People are inherently resistant to change, and computers have been known to facilitate change.

1.4. Feasibility Report

1. Technical feasibility:

The system is self-explanatory and does not need any extra sophisticated training to learn to handle
e-commerce website. As the system has been built by concentrating on the User ease to understand
Concepts, the application can also be handled very easily with a novice User. The overall time that
is required to train the users upon the system is less than half an hour.

The System has been added with features of online complaints and button interaction methods, which
makes the user the master as he starts working through the environment.

2. Financial Feasibility:

Time Based: It requires time to build this app but since it is going to benefit a lot of users it does
not matter much.

Cost Based: No special investment needed to manage the app. Investment requires only once at
the time of preparation. The software used in this project is freeware so the cost of developing the
tool is minimal and hence the overall cost.

9
2. System Analysis and Design

2.1. System Analysis

System Analysis is first stage according to System Development Life Cycle model. This System
Analysis is a process that starts with the analyst.

Analysis is a detailed study of the various operations performed by a system and their relationships
within and outside of the system. One aspect of analysis is defining the boundaries of the system
and determining whether or not a candidate system should consider other related systems. During
analysis, data are collected on the available files, decision points, and transactions handled by the
present system.

Logical system models tools that are used in analysis. Training, experience, and common sense
are required for collection of the information needed to do the analysis.

2.1.1. Existing System:

The existing system is Online .The limitations are:

Without Internet Connection website will not work.

2.1.2. Proposed System:

The Ecommerce website will work online only.

10
2.2. Requirement Analysis:

Requirement Analysis is a software engineering task that bridges the gap between system level
software allocation and software design. It provides the system engineer to specify software
function and performance, indicate software’s interface with the other system elements and
establish constraints that software must meet.

The basic aim of this stage is to obtain a clear picture of the needs and requirements of the end-
user and also the organization. Analysis involves interaction between the clients and the analysis.
Usually analysts research a problem by asking questions and reading existing documents. The
analysts have to uncover the real needs of the user even if they don’t know them clearly. During
analysis it is essential that a complete and consistent set of specifications emerge for the system.
Here it is essential to resolve the contradictions that could emerge from information got from
various parties. This is essential to ensure that the final specifications are consistent.

It may be divided into 5 areas of effort.

 Problem recognition
 Evaluation and synthesis
 Modeling
 Specification
 Review
Each Requirement analysis method has a unique point of view. However all analysis
methods are related by a set of operational principles.

They are

 The information domain of the problem must be represented and understood.


 The functions that the software is to perform must be defined.
 The behavior of the software as a consequence of external events must be defined.

11
The models that depict information, function and behavior must be partitioned in a hierarchical
or layered fashion.
 The analysis process must move from essential information to Implementation
detail

12
3. Hardware and Software Specifications

3.1. Hardware Specification:

1. C.P.U : Pentium iii or above

2. Memory : 2 GB RAM

3. Monitor : Mono/Color

4. Keyboard : Low profile, dispatch able type

5. I/O parts : a) Mouse

b) Monitor

6. Operating system :Windows 7 or above

3.2. Software Specification:

1. Front end : React

2. Development Environment : Visual Studio Code

13
4. Implementation / Coding
VISUAL STUDIO CODE
Visual Studio Code is a streamlined code editor with support for
development operations like debugging, task running, and version control. It
aims to provide just the tools a developer needs for a quick code-build-debug
cycle and leaves more complex workflows to fuller featured IDEs, such as
Visual Studio IDE

Installation

4.1 Download the Setup File


VS code can be simply installed on Windows 10 with the setup file. So we need to
download the setup file from the official website.

https://code.visualstudio.com/

After opening the website, click on the Download for Windows button. This will
download the VS code Setup Wizard on our system as an EXE file.

14
4.1.1 Run the VS code Setup Wizard
So the VS code Setup Wizard is downloaded successfully and we need to run it. Run
the file by referring to the screenshots provided below.

4.1.2 Close All Other Applications


At first, it recommends that we need to close all other applications before the VS code
installation starts. It is not mandatory.

15
4.1.3 Accept the License Agreement
In this step, read the license agreement and choose whether we accept it or not. But
the installation continues only after we accept the agreement.

16
4.1.4 Select the Installation Location
Choose the location in our system to install the VS Code. If we are not bothering about
the location, go with the default location. But, at least 203.4 MB of free disk space is
required in the selected location.

17
4.1.5 Placing the Shortcuts
As a default, the VS code shortcut will be placed in the Start Menu folder. We can
change the destination or skip creating shortcuts.

18
4.1.6 Selecting Additional Tasks
We get a bunch of additional tasks to be performed before the installation begins.
Choose tasks we prefer and continue.

19
4.1.7 Install VS code on Windows 10
So we have set up everything and the VS code can be installed on our Windows 10
system now.

20
4.1.8 Finish and Launch
After the successful installation, we can launch the VS code on our system.

21
4.2 Node Js
Node.js is an open-source and cross-platform JavaScript runtime environment.

22
Node.js is an open-source and cross-platform runtime environment built on Chrome’s V8
JavaScript engine for executing JavaScript code outside of a browser. You need to remember
that NodeJS isn’t a framework, and it’s not a programming language. It provides an event-
driven, non-blocking (asynchronous) I/O and cross-platform runtime environment for building
highly scalable server-side applications using JavaScript.

4.3. Express.JS
Express.js, or simply Express, is a back end web application framework for building
RESTful APIs with Node.js, released as free and open-source software under the MIT
License. It is designed for building web applications and APIs. It has been called the de
facto standard server framework for Node.js

[6]

Express is a node js web application framework that provides broad features for building
web and mobile applications. It is used to build a single page, multipage, and hybrid web
application. It's a layer built on the top of the Node js that helps manage servers and
routes.

23
4.4 MongoDB

MongoDB allows teams to choose their cloud provider of choice while providing database
management that streamlines every aspect of database administration. It's easy to get started with
MongoDB Atlas, and it's free.

[5]

24
[2]

4.5 MVC Architecture


The Model-View-Controller (MVC) is an architectural pattern that separates an application
into three main logical components: the model, the view, and the controller. Each of these
components are built to handle specific development aspects of an application. MVC is
one of the most frequently used industry-standard web development frameworks to create
scalable and extensible projects.

25
MVC Components
Following are the components of MVC −

Model-
The Model component corresponds to all the data-related logic that the user works with.
This can represent either the data that is being transferred between the View and Controller
components or any other business logic-related data. For example, a Customer object will
retrieve the customer information from the database, manipulate it and update its data back
to the database or use it to render data.

We created three schemas for this project-


1. Product
2. User
3. Order

They all have their own entities.


Entities of Product are-

26
1. Name
2. Description
3. Price
4. Ratings
5. Images
6. Category
7. Stock
8. No. of Reviews-
a) User
b) Name
c) Rating
d) Comment

Entities of User are-


1. Name
2. E-mail Address
3. Password
4. Avatar
5. Role
6. Created At

Entities of Order are-


1. Shipping Info{Address,City,State,Country,Pincode, Phone No.}
2. Order Items{Name,Price,Quantity,Image,Product}
3. User
4. Payment Info{Id,Status}
5. Order Status{Paid At, Item Price, Tax Price, Shipping Price, Total Price}

27
Controller
Controllers act as an interface between Model and View components to process all the
business logic and incoming requests, manipulate data using the Model component and
interact with the Views to render the final output. For example, the Customer controller
will handle all the interactions and inputs from the Customer View and update the
database using the Customer Model. The same controller will be used to view the
Customer data.

We used 4 controllers for this project-


1. Order Controller
2. Payment Controller
3. Product Controller
4. User Controller

Middleware-
Middleware is software that enables one or more kinds of communication or connectivity
between applications or application components in a distributed network. By making it
easier to connect applications that weren't designed to connect with one another, and
providing functionality to connect them in intelligent ways, middleware streamlines
application development and speeds time to market.

28
Middlewares are-
1. AuthenticatedUser.js -It checks whether the user is authenticated or not and check
what the role of the user(admin) is.

2. catchAsyncerrors.js
3. error.js- It handles cast error, mongoose duplicate error, wrong jwt error, token
expire error

29
4.6 JSON Web Token(JWT)-

A JSON web token(JWT) is JSON Object which is used to securely transfer information
over the web(between two parties). It can be used for an authentication system and can also
be used for information exchange.The token is mainly composed of header, payload, and
signature. These three parts are separated by dots(.).

4.7 NodeMailer-
Nodemailer is the Node.js npm module that allows you to send email easily.

Approach:
Include the nodemailer module in the code using require(‘nodemailer’).
Use nodemailer.createTransport() function to create a transporter who will send mail. It
contains the service name and authentication details (user ans password).
Declare a variable mailDetails that contains the sender and receiver email id, subject and
content of the mail.

30
Use mailTransporter.sendMail() function to send email from sender to receiver. If message
sending failed or contains error then it will display error message otherwise message send
successfully.

4.8 Front End-


Front-end web development, also known as client-side development is the practice of
producing HTML, CSS and JavaScript for a website or Web Application so that a user can see
and interact with them directly. The challenge Assistantd with front end development is that
the tools and techniques used to create the front end of a website change constantly and so the
developer needs to constantly be aware of how the field is developing. The objective of
designing a site is to ensure that when the users open up the site they see the information in a
format that is easy to read and relevant. This is further complicated by the fact that users now
use a large variety of devices with varying screen sizes and resolutions thus forcing the
designer to take into consideration these aspects when designing the site. They need to ensure
that their site comes up correctly in different browsers (cross-browser), different operating
systems (cross-platform) and different devices (cross-device), which requires careful planning
on the side of the developer.

React
React is a declarative, efficient, and flexible JavaScript library for building user
interfaces. It lets you compose complex UIs from small and isolated pieces of code
called “components”.

JSX
JSX is a syntax extension of JavaScript. It is used with React to describe what the user interface
should look like. By using JSX, we can write HTML structures in the same file that contains
JavaScript code.

31
Redux
Redux Toolkit is a set of tools that helps simplify Redux development. It includes
utilities for creating and managing Redux stores, as well as for writing Redux actions and
reducers. The Redux team recommends using Redux Toolkit anytime you need to use
Redux.

32
CSS (Cascading Style Sheet)

Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a
document written in HTML. CSS describes how elements should be rendered on screen, on paper,
in speech, or on other media.
CSS is among the core languages of the open web and is standardized across Web browsers
according to W3C specifications.

CSS saves a lot of work. It can control the layout of multiple web pages all at once. External
stylesheets are stored in CSS files.

JAVASCRIPT

JavaScript is a text-based programming language used both on the client-side and server-side that
allows you to make web pages interactive. Where HTML and CSS are languages that give structure
and style to web pages, JavaScript gives web pages interactive elements that engage

Common examples of JavaScript that you might use every day include the search box on Amazon,
a news recap video embedded on The New York Times, or refreshing your Twitter feed.

JavaScript is used on both Frontend and Backend. JavaScript is the mostly used programming
language native to the web browser

33
Comparison between Java , Python and Nodejs[3] :

34
Comparision between React , AngularJS and Angular2[1] :

35
4.9 Stripe-

Stripe is a payment services provider that lets merchants accept credit and debit cards or
other payments. It is used by some of the world’s largest companies, including Amazon
and Shopify. Stripe payments are best suited for business owners who do much of their
business online, as most of its unique features — such as its open application programming
interface and ability to accept more than 135 currencies — are primarily relevant to online
sales.

[4]

How do payments work with Stripe?


Stripe handles the six steps between a customer providing their card information and
learning that their payment has been accepted. The customer provides their card
information, either online or in person. Those card details enter Stripe’s payment
gateway, which encrypts the data. Stripe sends that data to the acquirer, which is a bank
that will process the transaction on the merchant’s behalf. In this step, Stripe serves as the
merchant (with the business owner as a submerchant). This means Stripe users don’t have
to set up a merchant account, which can be cumbersome. The payment passes through a
credit card network, such as Visa or Mastercard, to the cardholder’s issuing bank. The
issuing bank approves or denies the transaction. That signal travels from the issuing bank
through the card network to the acquirer, then through the gateway to the customer —
who sees a message telling them the payment has been accepted or declined.

36
5. Control Flow Graphs

5.1 Control Flow Graph of the Website

37
5.2 Control Flow Graph of the User

38
6. Implementation
6.1 This UI will be visible on opening the Web Application.
This is the UI of the application which opens up first when we open the web Application
in the web browser Here is a search tab which would show day to day products that the
users will be interested in buying.

6.2 Footer of the Website

39
6.3 Filters Used-

6.4 Cart

40
6.5 Login Page

41
6.6 Shipping Details

42
6.7 Order Placed

43
7. GREEN IMPLEMENTATION IN APPLICATION

Green computing (also known as green IT or sustainable IT) is the design, manufacture, use and
disposal of computers, chips, other technology components and peripherals in a way that limits the
harmful impact on the environment, including reducing carbon emissions and the energy
consumed by manufacturers, data centers and end-users. Green computing also encompasses
choosing sustainably sourced raw materials, reducing electronic waste and promoting
sustainability through the use of renewable resources.

• Use of NoSQL database that is MongoDB for my application

• Use of minimum permission required to run the application

• No use of third party and suspicious library for implementation of any feature in
the application

• Some optimization to avoid unnecessary loading of data in my application

• Use of GitHub for storing, tracking, and collaboration on my projects

Move off premises

Migrating workloads to a public cloud creates an instant return on sustainability efforts, with an
average 84% immediate reduction in carbon emissions as a result. This reduction results from a
combination of factors, including the fact that cloud data centers use less physical space and
resources than those on-premises; the use of more efficient servers and higher server usage; and
the fact that public cloud providers are themselves committed to sustainable infrastructure and a
reduced carbon footprint, which enhances and supports their customers’ efforts as well.

Consider serverless

Businesses can amplify that carbon reduction by selecting a database platform that aligns with
their energy goals. MongoDB is currently in 80-plus regions, with 12 of those regions being
powered by renewable energy as well as being low-carbon and/or zero-waste. Furthermore,
MongoDB Atlas Serverless instances are optimized to use the underlying infrastructure — RAM,
CPU, disks, network bandwidth — to its maximum before consuming additional cloud resources.
Currently, 60% of organizations globally have yet to adopt any serverless technology; however,
pushing to serverless not only helps to reduce carbon footprint but also can provide a competitive
advantage.

Consolidate your platform

Databases require management on many fronts, from transactional data and relational data to
search, analytics, graph use cases, time series, and more. Each of these facets is frequently handled

44
in its own separate database, necessitating management, monitoring, and resources. Not only is
this a technical pain point, but it can also affect the environmental goals of an organization and its
carbon footprint overall.

To start, fewer workloads result in a lower carbon emission total. Thus, simply paring down the
number of databases used is an easy way to reduce the consumption of resources and Assistantd
carbon emissions. MongoDB Atlas brings all of those requirements into a single, consolidated
database platform that solves for disparate and siloed databases and reduces resources and
consumption.

Strategize around prevention

The greenest energy is the energy that is never used in the first place. Toward that end,
organizations can work to shift their architectural strategy to be more mindful of carbon and energy
considerations, and adjustments can be made to reduce usage without affecting performance.

For example, about 40% of instances are at least one size larger than needed. Businesses can reduce
such excess consumption by avoiding over-provisioned databases. This change can be done easily
through automatic scaling with MongoDB Atlas cluster and storage auto-scaling, as well as with
Atlas Triggers, which allows users to schedule scaling events.

Another consideration is the consumption of non-production environments. Currently, more than


44% of total compute resources are being used in non-production environments like dev, testing,
staging, and pre-production. This consumption typically does not occur outside of work hours, and
it’s easy to pause these resources outside of peak hours in Atlas, either on-demand or with an Atlas
Trigger.

Continue to iterate

These major adjustments to the structure of your database architecture represent impactful steps
toward creating a sustainable database, but there are many, more granular ways to improve
database technology and better align with environmental goals. Implementing smaller changes will
chip away at carbon emissions and create significant impact over time.

Such easy-to-execute suggestions include the following:

Consider the impact of data transfer over longer distances and find new regions to house data.

Determine the proper location of data and leverage the flexibility to deploy in any region, which
grants more control over replication of data.

Use Atlas Global Clusters to ensure that data stays within a defined geography, thereby minimizing
the infrastructure required to deploy a globally distributed application.

Employ Atlas Data Federation to minimize the need to replicate data between cloud object storage
and Atlas by allowing users to query both sources from a single interface.

Leverage Atlas Analytics Nodes to offload workloads to separate nodes. And note that, with
MongoDB 6.0, you can manually size those nodes to trim even more resources.

Use analytic nodes that are deployed in more environmentally sustainable regions.

45
Leverage Atlas’s many dashboards and alerts to be proactively notified when system resources are
rising beyond acceptable thresholds.

Introduce an “eco mode” in your apps, giving users the ability to agree to potentially lower
response times in exchange for a positive environmental impact.

Avoid peak times for predictable workloads; schedule these during a time that will not drive
over-consumption.

Use data tiering; users can automate data lifecycles using Atlas Online Archive and reduce
exhaustion of resources
.

46
8. LIMITATIONS OF APPLICATION

• An online Internet connection is required to run this application. Users would not be able
to run this web application without active internet connection.

• Only the developer can access the adding products line not any simple users there is no
frontend user interface designed by us.

• No product recommendation based on previous order history because the model is based
on Machine Learning Algorithms but we haven't used any sort of ML in this project.

• No Authentication of products by the developers.

• No return of product is available.

47
9. OUTCOMES AND LEARNINGS

 Get to learn more about React, MongoDB and understand the implementation of CRUD
(Create,Read, Update, Delete) operation in database.

 Learn different types of Database Operation and their use cases in different situation.

 Learn how to integrate APIs in Web Applications and how to handle them.

 Different optimization techniques to make the project more efficient

 Understand more about the APIs and Express language and how to make our app more
efficient.

 Learn how to handle and fix different error.

 How to read official documentation of different NPM packages and also some of

 Technologies like MongoDB, Express.js, React.js.

10. FUTURE PROSPECTS

● We can add voice search for products.

● We can use ML Algorithms for future recommendations.

● We can give users an option to sell their own products online.

● Authentication of the product can be checked.

48
11. INSTALLATION OF PROJECT

1. Firstly install Visual studio to your System as explained in the introductory part of
Implementation and code .

2. Click on import project.

3. And import my project in it.

4. Open terminal in VS code

5. Run the command npm install to install all the packages that were required and are
present in the package.json file.

6. At last run npm start and you would see the project running on your localhost.

7. We will also be deploying this project in future then a user would be able to directly run
this project in any of the operating systems opening the browser.

49
12. CONCLUSION

The project exposed us to the latest technology in the area of Web Application
Development Thus, this project successfully demonstrated a web "Online Shopping
Website". I faced many challenges and problem during the development time. It was a nice
learning curve to work on Web Application Development .

We also acknowledged with great thanks to our project mentor "Dr. Jitender Kumar
Bhardwaj" for his most valuable suggestions & co- operations.

Development on MERN stack whatsoever We believe our time spent in research and
discovering it was well worth it and contributed to finding an acceptable solution to
implement features and fixing bugs in a fully functional Web Development Project . Two
main things that we’ve learned are the importance of our time-management skills and self-
motivation.

50
13. REFERENCES

References

[1]. React VS Angular Comparision : https://www.oodlestechnologies.com/blogs/reactjs-vs-sql-


comparison/

[2]. SQL vs NoSQL Comparision :


https://www.google.com/url?sa=i&url=https%3A%2F%2Fmedium.com%2Fanalytics-
vidhya%2Fdatabase-management-nosql-vs-sql-or-mongodb-vs-mysql-
cfa351caf25a&psig=AOvVaw0xklBSiZ0htTtaov7CVQCA&ust=1672685433466000&sourc
e=image s&cd=vfe&ved=0CBAQjRxqFwoTCKDRn_2Ep_wCFQAAAAAdAAAAABAD

[3]. Python vs Java vs Node.js Comparision : https://medium.com/quick-code/node-js-vs-java-vs-


python-how-to-choose-the-best-backend-tech-stack-82833df0bb4e

[4]. Stripe
Image:https://www.google.com/search?q=stripe&rlz=1C1CHBF_enIN958IN958&sxsrf=ALiCzs
aPGDKRmj8YcXkJMPn_Xyz6LKDUiQ:1672685421429&source=lnms&tbm=isch&sa=X&ved
=2ahUKEwjl2PXixqn8AhWG5XMBHVWFAYYQ_AUoAnoECAEQBA&biw=1536&bih=714
&dpr=1.25#imgrc=qqBtpCMBTLCptM

[5]. MongoDB
Image:https://www.google.com/search?q=mongodb&rlz=1C1CHBF_enIN958IN958&sxsrf=ALi
CzsaA-wXU6aeBHXtp5Xhscol50--
x7Q:1672685497191&source=lnms&tbm=isch&sa=X&ved=2ahUKEwih7YWHx6n8AhWV33M
BHfq0CYgQ_AUoAXoECAEQAw&biw=1536&bih=714&dpr=1.25#imgrc=HDEhreUTw_Uae
M

[6]. Express JS Image- https://www.tutorialspoint.com/expressjs/index.htm

[7]. Learning different concepts: https://www.codingninjas.com/

51

You might also like