🚀 MERN E-Commerce App Deployment Pipeline

Welcome to the CI/CD Pipeline for a MERN E-Commerce Application! This repository demonstrates a complete DevOps workflow using Docker, GitHub Actions, and Render for deploying a full-stack MERN (MongoDB, Express, React, Node.js) app.

---

📦 Project Structure

📦E-Commerce-App-Deployment-Pipeline-
├── backend/                         # Express.js backend
│   ├── config/                      # Configuration files (DB, env, etc.)
│   ├── controllers/                 # Route controllers
│   ├── middleware/                  # Express middleware
│   ├── models/                      # Mongoose models
│   ├── routes/                      # Express routes
│   ├── utils/                       # Utility functions
│   ├── .env.example                 # Example environment variables
│   ├── Dockerfile                   # Backend Dockerfile
│   ├── package.json
│   └── server.js                    # Entry point
├── frontend/                        # React.js frontend
│   ├── public/
│   ├── src/
│   │   ├── assets/                  # Images and static assets
│   │   ├── components/              # React components
│   │   ├── pages/                   # React pages
│   │   ├── redux/                   # Redux store, slices, actions
│   │   ├── utils/                   # Utility functions
│   │   ├── App.js
│   │   └── index.js
│   ├── .env.example                 # Example frontend env variables
│   ├── Dockerfile                   # Frontend Dockerfile
│   └── package.json
├── .github/
│   └── workflows/
│       └── ci-cd.yml                # GitHub Actions workflow
├── .gitignore
├── docker-compose.yml               # Docker Compose for local dev
└── README.md

---

📌 What This Pipeline Does

✅ Automatically builds both frontend and backend Docker images
✅ Pushes images to Docker Hub
✅ Triggers Render deployments using deploy hooks
✅ Skips manual approval for fully automated deployment
✅ Uses GitHub Actions for CI/CD pipeline

---

🛠️ Technologies Used

• ⚙️ GitHub Actions – CI/CD automation
• 🐳 Docker – Containerization
• ☁️ Render – Cloud deployment
• 💾 MongoDB Atlas – Cloud database
• 🌐 Node.js & Express.js – Backend
• 🧠 React.js – Frontend

---

🌐 Live Demo Links

• 🔗 Frontend: Live Frontend on Render
• 🔗 Backend API: Live Backend on Render

---

🚦 CI/CD Pipeline Flow Diagram

🔁 Workflow Stages

1. Push to main branch
2. ✅ CI: Install, Lint, and Build code
3. 🛠️ Docker Build for Frontend & Backend
4. 📦 Push Docker Images to Docker Hub
5. 🚀 Trigger Deploy Hooks on Render

💡 Want to try it yourself? Fork this repo and set your own Docker & Render secrets!

---

🔐 Secrets Configuration (GitHub → Settings → Secrets → Actions)

Secret Name	Description
DOCKER_USERNAME	Your Docker Hub username
DOCKER_PASSWORD	Docker Hub access token/password
RENDER_DEPLOY_HOOK_FRONTEND	Render deploy hook for frontend
RENDER_DEPLOY_HOOK_BACKEND	Render deploy hook for backend

---

✅ Workflow Badge

Display this badge in your repo to show the pipeline status:

📸 Screenshots

✅ GitHub Actions Pipeline Passed

🖥️ Live Frontend on Render

• 🔗 Frontend: Live Frontend on Render

🧠 Backend API Connected to MongoDB

🤝 Author

Made with ❤️ by Rajeev Kumar (Elone Rajeev)

• 📧 Email: [email protected]
• 💼 LinkedIn
• 🧑‍💻 GitHub
• 🌐 Portfolio

---

📄 License

This project is licensed under the MIT License.

🔄 Always feel free to contribute or suggest improvements!