Grocery Delivery: Full-Stack MERN Grocery Store with Live Order Tracking

Grocery Delivery is a complete online grocery store that covers the whole order journey: a customer browses and orders, a store admin manages the order, and a delivery partner brings it to the door. Customers browse products by category, search and filter by price, add items to a slide-out cart, and check out in three steps: address, payment, review. They can pay by card through Stripe or choose cash on delivery. After placing an order, they can follow it on a progress timeline and watch their delivery partner move on a live map. Store admins work from a dashboard showing orders, revenue, users and stock levels. They can add and edit products with multiple images, change order statuses, and assign each order to a delivery partner. Delivery partners have their own portal. They see the orders assigned to them, share their live location, and mark each order as packed and then out for delivery. To complete a delivery, they enter a one-time code (OTP) that only the customer has, which confirms the order reached the right person. Security comes first throughout. Sessions are kept in httpOnly cookies rather than browser storage, passwords are hashed with bcrypt, and prices, tax and delivery fees are always calculated on the server. Stock is reserved at the moment an order is placed, so items can't be oversold. The interface is fully responsive and tested on phone, tablet and desktop. Tech stack: React 19, Vite, Tailwind CSS v4, React Router, Node.js, Express 5, MongoDB with Mongoose, JWT, Stripe, Cloudinary, Leaflet with OpenStreetMap.

Features

• Stripe
• Cloudinary
• Cash on delivery
• GPS Location
• Admin panel
• Rider Dashboard
• Customer View
• Add to Cart
• Security and reliability

What's Included