Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/sahiltiwariiii/ecommerce-famous-mern-app

This is famous Ecommerce app
https://github.com/sahiltiwariiii/ecommerce-famous-mern-app

Last synced: about 2 months ago
JSON representation

This is famous Ecommerce app

Awesome Lists containing this project

README

        

---

# 🛍️ **Ecommerce-famous-MERN-app**

This is a **full-featured, modern, and scalable eCommerce app** built using the MERN stack (MongoDB, Express.js, React.js, and Node.js) 🌍. It includes an **admin dashboard** for managing products, categories, and users, along with a **payment gateway** integration 💳 for smooth transactions. The app offers a seamless shopping experience for users and an easy-to-manage backend for admins.

---

## 🚀 **Features**

- **🛒 Product Management**: Add, update, delete products with categories.
- **📊 Admin Dashboard**: Manage products, categories, users, and view sales analytics.
- **💳 Payment Gateway Integration**: Secure and fast checkout process using payment APIs.
- **🛠️ Full-Stack MERN**: Efficient backend with RESTful API, and responsive, interactive frontend.
- **🔍 Search & Filter**: Easily find products with search and filtering options.
- **✨ User Authentication**: Secure login and registration for users and admins.
- **📱 Mobile-Responsive**: Optimized for all device types (mobile, tablet, desktop).

---

## 🛠️ **Technologies Used**

- **Frontend**:
- [React.js](https://reactjs.org/) (for interactive UI)
- **Axios** for making HTTP requests 🌐
- **React-toastify** for elegant notifications 🔔
- **Redux** for state management 🧠
- **React-router-dom** for dynamic routing 🛣️

- **Backend**:
- [Node.js](https://nodejs.org/) + [Express.js](https://expressjs.com/) (for REST API)
- **MongoDB** for database 💾
- **JWT** for authentication and authorization 🔐
- **bcryptjs** for password hashing 🔑
- **Multer** for image uploads 🖼️

---

## 🖥️ **Screenshots**

Here are some glimpses of the application:

### User Dashboard
![User Dashboard](https://github.com/user-attachments/assets/db45526d-9461-40c5-bed9-a19b7a9da9c9)

### Admin Product Management
![Admin Product Management](https://github.com/user-attachments/assets/5f1c31c9-255d-4f84-82e3-573aec3d5228)

### Payment Page
![Payment Page](https://github.com/user-attachments/assets/3c902798-4260-4f62-9ced-e3e35e80407f)

---

## 🏗️ **Installation & Setup**

To run this project locally:

1. **Clone the repository**:
```bash
git clone https://github.com/sahilTiwariiii/Ecommerce-famous-MERN-app
```

2. **Install frontend dependencies**:
```bash
cd frontend
npm install
```

3. **Install backend dependencies**:
```bash
cd backend
npm install
```

4. **Set up environment variables**:
- Create a `.env` file in the root of the backend folder and add:
```
MONGO_URI=your_mongoDB_connection_string
JWT_SECRET=your_jwt_secret_key
STRIPE_SECRET_KEY=your_stripe_secret_key
```

5. **Run the application**:
- Run the backend server:
```bash
cd backend
npm run server
```
- Run the frontend server:
```bash
cd frontend
npm start
```

---

## 🌟 **Key Packages**

- **Axios**: Simplified HTTP requests and APIs integration.
- **React-toastify**: Customizable toast notifications for a better UX.
- **Redux**: Efficient state management.
- **Multer**: File handling middleware for image uploads.
- **Stripe**: Payment gateway integration for processing secure payments.
- **JWT**: Securing routes with token-based authentication.

---

## 👨‍💻 **Author**

**Your Name** - [GitHub](https://github.com/sahilTiwariiii)
Frontend Developer & Full-Stack MERN Developer with experience in building scalable web apps and modern eCommerce solutions.

---

## 📸 **More Screenshots**

At the end, here are more visuals showcasing different parts of the application:

![Checkout Page](https://github.com/user-attachments/assets/bd716123-4fa7-43f6-8a17-ea0dca551962)
![Product List](https://github.com/user-attachments/assets/7f7727cb-b4aa-43b3-b1d9-5e5f012854a9)
![Cart Page](https://github.com/user-attachments/assets/ff579bb6-9736-47a0-a9a5-f1a91e29c20e)

---

## 🎯 **Future Enhancements**

- Add product reviews and ratings ⭐
- Implement advanced search and filter options 🔍
- Integrate email notifications for order status updates 📧

---