MAX Fashion Clone

It's a clone of famous E-commerce website MAX Fashion using MERN Stack with all the major functionalities.

🖥️ Tech Stack

Frontend:

Backend:

Deployed On:

Want to see live preview »

MAX Fashion Clone is MERN Stack e-commerce web application that allows you to buy clothes & accessories, online with payment gateway integration. 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. This project is just for educational purpose.

Screens ( All screens are responsive for any media device)

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

🚀 Features

• Login and Signup User Account
• JWT (JSON Web Token) Authentication and BcryptJS Password Hashing
• Product Filters Based on Price, Size and Brand
• Product Sorting Based on Price and Name
• Product Filtering and Sorting work together
• Filters persist on page refreshing and pasting URL on new tab
• products can be shared directly via link
• Wishlist Add and Remove Items
• Cart Add and Remove Items
• Cart Update Quantities
• Address Management
• Order Summary
• Coupons are provided for the discount
• Responsive for all type of Media devices

Glimpses of Max-Fashion-Clone 🙈 :

Test Coupon Codes

MAX5 (for 5% Off)

MAX10 (for 10% Off)

Demo

Click here to see the presentation video of this project

Getting Started

This project was built using React, Redux, Chakra UI, HTML, CSS, JavaScript, Rest API, Node JS, Express and MongoDB with JWT and RazorPay integration. 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 GitHub link or just clone the project using this command.

Using HTTPS

# git clone https://github.com/jksingh1504/max-fashion-clone

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 client/max-fashion-clone

npm install

cd ../../

cd server

npm install

To run the application got to the max-fashion-clone 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

PORT

MONGO_URL

Tools used on this project

• Visual Studio Code
• MongoDB compass

Contact

If you want to contact me, you can reach me through below handles.

© 2022 Jyoti Kamal Singh

Show your support

Give a ⭐️ if you like this project!