E-Store

It's a MERN Stack E-commerce web application with all the major functionalities

Want to see live preview »

✧ View Demo ✧ Report Bug ✧ Getting Started ✧ Installing ✧ Author ✧

E-Store is an e-commerce web application that allows you to buy shoes & clothes online. It has a variety of categories, just visit the product listing page and you will see all the products, apply filters as per your need and in just a few clicks you can buy any products from the website.

Screens ( All screens are responsive along with Dark Mode)

• Homepage
• Product Listing Page with Filters
• Product Description Page
• Cart Management
• Wishlist/Favourites Management
• Checkout - Address Management
• Login / Logout
• Signup
• Order Summary

🚀 Features

• Login/Signup User Account
• Product Sorting Based on Price, Ratings, Namings
• Product Filters Based on Gender, Category, Grid View
• Products Pagination (Default 6 Products Per Page)
• Products Pagination Change Button (can set 4 products, 6 products or 8 products per page)
• Wishlist Add/Remove Items
• From wishlist to directly Add-to-Cart feature
• Cart Add/Remove Items
• Cart Update Quantities
• Address Management
• Order Summary
• Coupons are provided for the discount
• Order details of all ordered item
• Dark mode is available

Glimpses of E-Store 🙈 :

Test Coupon Codes

MASAI10        (for 10% Off)

MASAI20        (for 20% Off)

MASAI30        (for 30% Off)

MASAI40        (for 40% Off)

MASAI50        (for 50% Off)

MASAI60        (for 60% Off)

Demo

Getting Started

This project was built using React v 18.2.0, Redux v 4.2.0, Chakra UI, CSS, JavaScript, Rest API, Node JS, Express and MongoDB. It is an e-commerce web application and for running on your local environment you should follow these guidelines.

Prerequisites

• NPM
• Node JS
• MongoDB

Setup

The project repository can be found in E-Store-Front-End- GitHub link and E-Store-Back-End- GitHub link or just clone the project using this command.

Using HTTPS

# git clone https://github.com/murali0101/E-Store-Front-End-.git

# git clone https://github.com/murali0101/-E-Store-Back-End-.git

• Open terminal on your workspace with

cd /home/workspace/E-Store-Front-End-.git

Install

Install NPM

Check that you have node and npm installed

To check if you have Node.js installed, run this command in your terminal:

node -v

To confirm that you have npm installed you can run this command in your terminal:

npm -v

To confirm that you have MongoDB installed you can run this command in your terminal:

mongo -v

To install all the dependences of the project, run the following command:

cd E-Store-Front-End-

npm install

cd ../

cd E-Store-Back-End-

npm install

To run the application got to the client folder and run the following command:

npm start

Environment Variables

To run this project, you will need to add the following environment variables to your .env file in server folder

MONGO_USER_NAME

MONGO_PASSWORD

MONGO_DB_NAME

JWT_SECRET_KEY

Tools used on this project

• Visual Studio Code
• create-react-app template
• MongoDB compass