E-Commerce Site using MERN Technology

Abstract

Today most people use technology. Manage their life and take care of their belongings. Most of my generation buys clothes, food and electronics from e-commerce sites. Using MERN Stack technology, including MongoDB, Express. We are building an e-commerce application with JS framework, React.JS library and Node.JS platform. The program has many views for users and administrators, is efficient and includes a payment gateway for deductions. From this site, we can buy T-shirts in different types and styles according to customer satisfaction. In this project, we have the option to add and remove many items. For the website, we have created functions such as managing products and categories, adding new products and creating an admin dashboard. Customers can easily add the products they purchased to the cart. Payments are made based on items in the shopping cart and customers can pay using Stripe.

Introduction

I. INTRODUCTION

We can all agree that technology is now important for online commerce. Most of the people in the world showed interest in online shopping. Small businesses and grocery stores still work offline. Most of us will have a bad experience with this type of sale. For example, if a customer needs an item quickly and then runs to the store to see that the item is out of stock, he or she will have a bad experience. The seller may have the item in the offer, but the buyer may not know it. Also when shopping online. Customers can choose from a variety of products based on their preferences and price, and compare prices from one store to another by shopping online. To search and buy products in any store, an e-commerce application should be developed that will solve the problems and disadvantages of offline stores. Today, e-commerce sites like Flipkart, Amazon, and Myntra have the flavour that people use to easily buy what they need. Using these websites, people can shop from home. Finally, we can differentiate the price of the product as we can see that physical purchases will cost slightly more than online purchases. MERN group will be your best choice to help us build the most effective and efficient website for this type of e-commerce.

II. BRIEF LITERATURE SURVEY

Through our research on various e-commerce shopping websites, we have gained valuable insights. We observed that consolidating all products and services related to events into a single web application can effectively address the challenge of purchasing items from multiple sources, providing customers with a convenient way to manage and celebrate their events. In particular, we drew inspiration from the website www.event.com, which showcased creative ideas for website design. Another noteworthy website, www.eventpro.com, introduced us to the concept of integrating a catering booking feature into our own web application. Additionally, during our survey, we discovered the importance of incorporating advanced registration methods, such as barcode technology, to facilitate a smooth and efficient registration process for customers. These features have the potential to greatly enhance the usability and effectiveness of our web application in the future. Furthermore, our survey revealed that many individuals are required to install specific mobile applications for different events, such as birthday parties. To address this, we propose the development of an online web application that can be accessed through a browser, eliminating the need for additional memory usage on mobile phones. Considering the increasing preference for online platforms, an events hub application tailored for e-commerce shopping aligns well with the evolving needs and preferences of today's consumers.

III. OBJECTIVE

The aim of this project is to create a web application that makes it easy to sell products and find interesting clothes. For the e-commerce site application, the administrator will include categories that may be of interest to users, such as summer discounts and winter discounts. In addition, customers can search for their favourite products.

They can buy quickly by adding them to the cart, they can change their quantity by clicking the "+" and "-" symbols. They can once again see the end of the product added to the cart. With the help of a payment gateway, debit card, credit card and internet banking payments are all possible.

If you order something from the online store, you will receive information about where and when the product will be delivered. Electronic commerce, often referred to as electronic commerce, is the process of buying and selling goods over the Internet and transferring information and money to complete the transaction.

E-commerce was not well known at first, but with the increasing use of mobile phones and more people's interest in shopping online, e-commerce has become very popular. E-commerce categories: E-commerce models are generally divided into four categories. B2C (Business to Consumer) started. This is an online company and using this model we are able to deliver products to customers. B2B (Business-to-Business) stands for commerce between large companies, institutions and businesses; Today, most e-commerce falls into this category.

Third, C2B (consumer business). This form of online marketing allows people to sell their products for business. People will use this online job to finish the job at the scheduled time. If you decide that you do not like the product after ordering and before the product arrives, you can easily cancel your order. Consumer to Consumer (C2C).

This e-commerce will encourage customers and buyers by enabling customers to exchange products and earn money by paying transaction fees.

Large Business: E-commerce gives you the opportunity to connect with customers around the world; You can buy everything from the comfort of your home. People are used to buying only on their mobile devices these days. So it will be useful for online shopping.

Comprehensive Product Range: In this huge world, buyers can buy many products from many places.

 For example, we can buy electronics from Russia, shoes from Japan, clothes and foreign goods from London.

IV. METHODOLOGY

There are many applications for building web applications and in this study we adopt MERN technology to create web applications.

1. MERN: React Js Nodejs for MongoDB Express. These are the four technologies that help us create or improve this website. MongoDB:  is an open source cross-platform program. It falls under the category of NoSQL databases. It is a data-driven database. It uses JSON formatted data and optional Schemas  data transfer, which means we can put the data in separate files. Large files can be distributed over multiple application connections * It is possible to store data at high speed as it relies only on sensors. It is a horizontally scalable database so it can process data which makes it easy for us to distribute data across servers.
2. NodeJS: It is a runtime JavaScript environment that runs outside of web pages. Used for server-side applications only. NodeJS is open source and free. NodeJS uses asynchronous programming by default. NodeJS always stores data in JSON format.
3. Express JS: is a well known library for navigating node.js. Robust has some router-like methods that help to perform curd tasks such as placing, receiving, broadcasting and cancelling routing requests. It will focus on high performance. It is an HTTP helper as it redirects, catches.
4. ReactJS: It is a JavaScript library developed by Facebook. React is mainly used as a UI which means it is mainly used on the client side. There are React-dom, React-router-dom etc which can help to build the front end of any application. There are many libraries such as 6 one.

Use
The MERN stack includes MongoDB, Express.js, React.js, and Node.js, which provide powerful tools for building web applications. MongoDB is an open, cross-platform NoSQL database.

It provides data flexibility and the ability to distribute large amounts of data across multiple applications by leveraging JSON-formatted data with an on-demand schema. Indexing capabilities ensure fast data retrieval. Node.js is a JavaScript runtime typically used for server-side applications. It is open source, free, and uses asynchronous programming by default.

Node.js stores data in JSON format and provides connectivity with other components of the MERN cluster. Express.js is a popular Node.js library for programming.

It provides resource efficiency, high performance, and HTP access capabilities such as retransmission and caching. Developed by Facebook, React.js is a widely used JavaScript library for building user interfaces (UIs) in external applications. React.js can quickly render web pages with features like virtual DOM.

Its strong foundation and strong community support make it the first choice for frontline development.

Web Application Structure: A web application follows a basic structure that includes front-end, back-end, and database components.

B.  Back-End (Server Side)

1. Model: The database model is defined by the Mongoose library, which is easy to store data.
2. Router: Express.js for routing, performing CURD operations, and defining routes for web applications.
3. Controller: Defines the functions used in the controller, router, and middleware.
4. Database: The web application uses MongoDB as the database and the Mongoose library provides connectivity and data manipulation. Databases store user-entered information and make it easy to find and store.

VI. TECHNOLOGY USED

A. React.js

React.js, also known as React, is a JavaScript library used to create user interfaces (UI) for web applications. It is an open-source library developed by Facebook and is widely favoured by developers for its simplicity, efficiency, and component-based structure. React.js enables the development of reusable UI components that can be combined to build complex and interactive interfaces. It utilises a virtual DOM (Document Object Model) to efficiently update and render UI components, enhancing performance by minimising unnecessary re-rendering.

B. Express.js

Express.js, commonly referred to as Express, is a lightweight and speedy web application framework designed for Node.js. It simplifies the process of building web applications and APIs by providing a comprehensive set of features and utilities. Express.js is renowned for its simplicity and flexibility, allowing developers to create server-side applications and handle HTTP requests effortlessly. It offers a streamlined middleware system that allows developers to add functionality to their applications by chaining together middleware functions. With Express.js, developers can define routes, handle various HTTP methods, and manage parameters and query strings. Additionally, it supports the creation of custom middleware functions to handle authentication, logging, error handling, and more.

C. MongoDB

MongoDB is a widely adopted open-source NoSQL database management system that offers a flexible and scalable approach to data storage and management. It is designed to handle large volumes of data and supports dynamic and schema-less document storage. In MongoDB, data is stored in the form of documents, similar to JSON objects. These documents can have diverse structures and fields, providing developers with a high degree of flexibility and adaptability. This enables easy evolution of data models as application requirements change over time.

D. Node.js

Node.js is an open-source JavaScript runtime environment built on Chrome's V8 JavaScript engine. It allows developers to execute JavaScript code outside of a web browser, enabling the creation of server-side applications. Node.js follows an event-driven, non-blocking I/O model, making it highly efficient and suitable for developing scalable and high-performance applications. It facilitates handling multiple concurrent requests without blocking execution, enabling the development of real-time applications and enhancing overall responsiveness.

VII. FUTURE SCOPE

The scope and benefits of e-commerce are immeasurable.

1. Less Price: We can compare prices on e-commerce sites from one site to another. This way, we can quickly decide where to get the product at a low price and have a general idea of  how much money we can spend on certain products.
    More Time to "Sell": In a physical store, the seller cannot provide all the information about the product; However, with an online store, customers can get all the information about the product and read reviews from other previous customers. buy goods. If the product is good, there will be many opportunities to buy it that way.

VIII. LIMITATION

There are four limitations:

1. Security: Users often express concerns about sharing personal information with website owners, which poses security risks when shopping online.
2. Tax Implications: E-commerce is subject to taxes such as Goods and Services Tax (GST), which can vary depending on the user's location. These taxes are usually higher compared to brick and mortar stores.
3. Delayed Delivery: A common problem in e-commerce is the uncertainty of on-time delivery due to the distance of the user from the organisation from which the order is placed.
4. Technology Cost: Building an eCommerce website requires a lot of money as it requires careful consideration of the potential and use of security systems.

IX. ACKNOWLEDGEMENT

We acknowledge and express our profound sense of gratitude to all those who contributed in this field to prepare this research paper. We would like to thank the developers for developing the block & circuit diagram.

Conclusion

This research article provides an overview of the disadvantages of electronic commerce and the use of MERN techniques in Web application development. The e-commerce application is designed to provide full functionality, including user authentication, administrator authorization, shopping cart management and payment sharing. The whitepaper demonstrates the application\'s great potential in the textile industry while eliminating intermediaries and enabling direct sales to consumers. Small businesses can present and sell their products online using the advantages of MERN technology.

References

[1] Chanana, N., & Goele, S. (2012). Future of e-commerce in India. International Journal of Computing & Business Research, 8. [2] Hoque, S. (2020). Full-Stack React Projects: Learn MERN stack development by building modern web apps using MongoDB, Express, React, and Node.js. Packt Publishing Ltd. [3] Rossi, G., Schwabe, D., & Lyardet, F. (1999). Web application models are more than conceptual models. International Conference on Conceptual Modelling. [4] Niranjana Murthy, 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.

Copyright

Copyright © 2023 Prof. Mr. Devendra Singh Mohan, Manya Dwivedi, Kashish Kumari, Abhishek Sharma. This is an open access article distributed under the Creative Commons Attribution License, which permits unrestricted use, distribution, and reproduction in any medium, provided the original work is properly cited.