Miska Pho is a comprehensive e-commerce and enterprise management solution tailored for a Vietnamese restaurant. This project demonstrates modern full-stack development using the MERN ecosystem, now fully containerized and integrated with automated delivery pipelines.
It features real-time menu synchronization, secure end-to-end online payments, and a robust administrative control panel.
The project is architected as a Monorepo, cleanly decoupled into three specialized modules:
/frontend: The customer-facing single-page application (SPA). Allows users to browse dishes, manage a dynamic shopping cart, and book tables./admin: A secure portal for restaurant owners and staff to manage real-time orders, track inventory, and handle table reservations./backend: The central nervous system. A RESTful API handling stateful operations, JWT authentication, Stripe payment webhooks, and database mutations.
- Customer Web App: https://miska-pho-frontend.vercel.app/
- Administrative Panel: https://miska-pho-admin.vercel.app/
This ecosystem is fully dockerized. To spin up the entire application infrastructure locally—including Frontend, Admin Dashboard, and the Backend API Server—without setting up local runtimes, execute:
# Clone and navigate to root, then run:
docker-compose up --build
- Customer Application:
http://localhost:3000 - Admin Dashboard:
http://localhost:3001 - Backend API Base:
http://localhost:5000
The repository runs an automated DevOps Pipeline powered by GitHub Actions upon every push to the main branch:
- Continuous Integration (CI): Automates dependency installation, workspace validation, and static compilation checks.
- Continuous Delivery (CD): Leverages multi-registry targets to build, tag, and publish highly optimized Docker images concurrently to:
- Docker Hub Registry
- GitHub Container Registry (GHCR)
- Stateless authentication implemented via JSON Web Tokens (JWT) secured in HTTP-only context.
- Role-Based Access Control (RBAC) mechanisms separating Customer actions from Admin escalation paths.
- Cryptographic password protection using multi-round bcryptjs salting.
- Full Stripe API integration supporting atomic credit card transactions.
- Asynchronous Webhook-ready logic for secure, server-side payment verification and state durability.
- Hybrid checkout supporting both Online Payment settlement and Cash on Delivery (COD) workflows.
- Dynamic media abstraction and asset optimization handled via Cloudinary CDN.
- Automated multi-part image uploads for menu systems utilizing Multer stream middleware.
- Deterministic booking logic structured to calculate and prevent overlapping time/table reservations.
- Reactive state flow allowing explicit Admin approval, modification, or cancellation.
- Frontend Ecosystem: React.js, Tailwind CSS, React Router DOM, Axios Client.
- Backend Runtime: Node.js, Express.js REST Framework.
- Database Infrastructure: MongoDB Atlas Cloud Instance cloud cluster via Mongoose Object Data Modeling (ODM).
- Infrastructure & Deployment: Docker, Docker Compose, GitHub Actions (CI/CD), Vercel.