Skip to content

Latest commit

 

History

History
265 lines (214 loc) · 10.9 KB

README.md

File metadata and controls

265 lines (214 loc) · 10.9 KB

Shope Now E-Commerce Website

Overview

This is a full-featured e-commerce website built with the MERN stack (MongoDB, Express, React, Node.js). It provides various functionalities for users, admins, and delivery partners.

Features

User Features

  • Signup and Sign-In: Users can create an account and log in to their account.
  • Cart Management: Users can add products to their cart.
  • Profile Updates: Users can update their profile information.
  • Order Placement: Users can place orders online or choose cash on delivery.
  • Order Tracking: Users can track their order history and status.
  • Product Details: Users can view detailed information about products and see similar products.
  • Feedback: Users can provide feedback on products.

Admin Features

  • User Management: Admins can manage user accounts and their orders.
  • Banner Management: Admins can add and manage home page sliding banners.
  • Category Management: Admins can add and manage product categories.
  • Product Management: Admins can add, update, and delete products.
  • Coupon Management: Admins can add and manage discount coupons.
  • Order Management: Admins can manage user orders, including viewing, processing, shipping, and canceling orders.
  • User Feedback: Admins can view feedback provided by users.
  • Sales Reporting: Admins can view sales reports, including:
    • Total sales
    • Product sales
    • Sales per category
    • Monthly sales (bar chart, pie chart, line graph)
  • User Report: Admins can view:
    • Total orders per customer (bar chart)
    • Orders distribution (pie chart)
  • Delivery Partner Management: Admins can view the list of delivery partners.

Delivery Partner Features

  • Order Processing: Delivery partners handle product deliveries once orders are processed by the admin.
  • Order Status: Delivery partners can update the order status to shipped, delivered, or canceled.

Payment Gateway

  • Integrated Payment Gateway: Users can make payments online using integrated payment systems.

Technologies Used

  • Frontend: React, Ant Design, Axios
  • Backend: Node.js, Express.js, MongoDB
  • Authentication: JWT (JSON Web Tokens)
  • Payment Gateway: Integrated payment system
  • Charts and Graphs: Chart.js
  • Notifications: React Hot Toast

Images

Home Page

Homepage Homepage2

Contact Us

Contact Us

About Us

About Us

Products and Product Details

All products and filter page Category wise display Product view Product view feedback Similar products

Signup and Sign-In

Signup page Sign in page

Cart Page

Cart page

Checkout Page and Payment Page

Checkout page Payment card

User Profile

User dashboard

User Order History Tracking

User order page

Admin Features

Admin Dashboard Home Page

Admin home

User Management

User list

Banner Management

Banner setting

Category Management

Category list

Product Management

Product list

Coupon Management

Coupon list

Order Management

Order list

User Feedbacks

Feedbacks

Sales Reporting

Total Sales Report
Sales reports Sales reports Sales reports
Products Sales Report
Sales reports Sales reports Sales reports
Sales per category Report
Sales reports Sales reports Sales reports

User Report

User report bar

Delivery Partner Features

Delivery Partner Dashboard

Delivery Partner Orders

Installation

  1. Clone the Repository

    git clone https://github.com/your-username/your-repository.git
  2. Navigate to the Project Directory

cd your-repository
  1. Install Dependencies

Backend:

cd backend
npm install

Frontend:

cd ../frontend
npm install
  1. Set Up Environment Variables: Create a .env file in the root directory and add the necessary environment variables, such as database connection strings, API keys, etc.

In BackEnd .env:

PORT=8080
DEV_MODE=devlopment
MONGO_URL=YOUR_MONGO_URL
JWT_SECRET= YOUR_JWT_SECRET
BRAINTREE_MERCHANT_ID=YOUR_BRAINTREE_MERCHANT_ID
BRAINTREE_PUBLIC_KEY=YOUR_BRAINTREE_PUBLIC_KEY
BRAINTREE_PRIVATE_KEY=YOUR_BRAINTREE_PRIVATE_KEY
EMAIL_HOST:YOUR_EMAIL_HOST  (ex: smtp.gmail.com)
EMAIL_PORT:YOUR_EMAIL_PORT (ex: 587)
EMAIL_USER=YOUR_EMAIL_USER  (Your Email Id)
EMAIL_PASS=YOUR_EMAIL_PASS

In Frontend .env:

REACT_APP_API=YOUR_URL (ex: http://localhost:8080)
  1. Start the Application Backend:
cd backend
npm start

Frontend::

cd ../frontend
npm start
  1. Usage Access the website at http://localhost:3000. For administrative tasks, log in with admin credentials. Delivery partners can log in with their specific credentials.

Acknowledgements

Contact

For any questions or support, please contact: Gmail :hmaning45@gmail.com , LinkedIn : https://www.linkedin.com/in/mahaning-hubballi-76b796222/