Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/menathndgd/mern-ecommerce
A full-featured eCommerce platform built using the MERN stack, providing a seamless shopping experience from browsing to checkout.
https://github.com/menathndgd/mern-ecommerce
Last synced: about 1 month ago
JSON representation
A full-featured eCommerce platform built using the MERN stack, providing a seamless shopping experience from browsing to checkout.
- Host: GitHub
- URL: https://github.com/menathndgd/mern-ecommerce
- Owner: MenathNDGD
- Created: 2024-08-26T17:02:48.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-09-17T13:19:05.000Z (4 months ago)
- Last Synced: 2024-09-17T16:36:12.918Z (4 months ago)
- Language: JavaScript
- Size: 8.39 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🛒 MERN E-Commerce Website
Welcome to the **MERN E-Commerce Website**! This project is a feature-rich e-commerce application built using the powerful MERN stack, complete with an intuitive user-facing store and an all-encompassing admin dashboard.
## ✨ Features
### 🌟 User Frontend:
- **🔒 Secure Authentication**: Register, login, and manage user profiles effortlessly.
- **🛍️ Product Exploration**: Browse and search through an extensive product catalog with advanced filtering options.
- **🛒 Shopping Cart**: Add products to your cart, modify quantities, and proceed to a hassle-free checkout.
- **💳 Seamless Payments**: Make secure payments using Stripe integration.
- **📦 Order Management**: View order history, track deliveries, and manage returns with ease.
### ⚙️ Admin Dashboard:
- **🛠️ Product Management**: Add, update, or delete products with a user-friendly interface.
- **📂 Category Management**: Organize products into categories for better navigation.
- **📑 Order Management**: View, process, and update orders efficiently.
- **👥 User Management**: Manage user roles and access levels.
## 🛠️ Tech Stack
- **MongoDB**: Robust NoSQL database for storing all application data.
- **Express.js**: Fast and minimalistic backend framework.
- **React.js**: Modern frontend library for building dynamic user interfaces.
- **Node.js**: JavaScript runtime environment for running the backend.
- **Stripe**: Integrated payment gateway for processing transactions.
- **JWT**: JSON Web Tokens for secure user sessions.
## 🗂️ Folder Structure
```plaintext
/
|-- admin/ # React.js admin frontend code
|-- backend/ # Node.js backend code (Express.js)
|-- frontend/ # React.js frontend code
|-- .gitignore # Files and folders to be ignored by Git
|-- README.md # Project documentation
```
## 🤸 Quick Start
Follow these steps to set up the project locally on your machine.
**Prerequisites**
Make sure you have the following installed on your machine:
- [Git](https://git-scm.com/)
- [Node.js](https://nodejs.org/en)
- [NPM](https://www.npmjs.com/) (Node Package Manager)
**Cloning the Repository**
```bash
git clone https://github.com/MenathNDGD/MERN-Ecommerce.git
```
**Installation**
Install the project dependencies using npm:
```bash
npm install
```
**Set Up Environment Variables**
/admin/.env
```env
VITE_BACKEND_URL = "http://localhost:4000"
```
/backend/.env
```env
MONGODB_URI =
CLOUDINARY_API_KEY =
CLOUDINARY_SECRET_KEY =
CLOUDINARY_CLOUD_NAME =
JWT_SECRET =
ADMIN_EMAIL = "[email protected]" #For testing only
ADMIN_PASSWORD = "admin@123" #For testing only
```
/frontend/.env
```env
VITE_BACKEND_URL = "http://localhost:4000"
```
Replace the placeholder values with your actual Appwrite credentials.
**Running the Project**
**Admin Dashboard Running On:**
```bash
cd admin
```
```bash
npm run dev
```
**Backend Running On:**
```bash
cd backend
```
```bash
npm run server
```
**Frontend Running On:**
```bash
cd frontend
```
```bash
npm run dev
```
Open [http://localhost:5174](http://localhost:5174) in your browser to view the admin dashboard.
Open [http://localhost:400](http://localhost:400) in your browser to run the backend.
Open [http://localhost:5173](http://localhost:5173) in your browser to view the frontend project.