Built to order

Online Grocery Store with Delivery Slots

This project builds a grocery-first online store where the delivery time slot is a first-class feature: customers pick from capacity-controlled slots, and the store packs per-slot queues so it never over-promises. It includes category browsing, a fast cart, an order-tracking timeline from placement to doorstep, and a store dashboard for inventory, slot capacity and sales. Suitable for B.E./B.Tech final-year projects in Computer Science, IT and Web Development.

Online Grocery Store with Delivery Slots — project thumbnail preview
More project photos (2)

The problem

Grocery is the hardest e-commerce category — products are perishable, baskets are large, and customers care deeply about when the order arrives. Generic e-commerce templates handle products and carts but not slot-based fulfillment, perishable stock or delivery-capacity planning. This project makes the delivery slot central: slots are capacity-controlled database entities with cut-off times, so the store never accepts more orders than it can deliver in a window. Around that sit a familiar storefront (categories, search, offers, unit pricing), a cart with bill computation, a customer order-tracking timeline, and a store dashboard showing inventory with expiry awareness, slot-wise packing queues and sales reports.

How it works

  1. The customer browses categories, adds items to the cart and proceeds to slot selection.
  2. Only slots with remaining capacity and before cut-off are offered; the customer picks one.
  3. Placing the order atomically decrements slot capacity and product stock, and creates the order.
  4. The store dashboard shows a packing queue grouped by slot; staff mark orders packed, then out for delivery.
  5. Each transition updates the customer's tracking timeline; delivery completion closes the order.
  6. Low-stock and near-expiry products surface as alerts for clearance action.

Tech stack:

  • React 18 single-page storefront
  • Django 5 + Django REST Framework API
  • PostgreSQL relational database
  • Atomic slot-capacity decrement
  • Order state machine (placed/packed/shipped/delivered)
  • Notification hooks (SMS/email gateway)
  • Token authentication
Parameter Value
Slot capacity Per-slot order caps, atomic decrement
Cut-off Server-side enforced per slot
Order states Placed, packed, out for delivery, delivered, cancelled
Payment modes UPI, cash on delivery
Stock Decremented on order placement
Deployment Self-hosted; API ready for a future mobile app

Project features

  • [Delivery slot engine] Slots with per-slot capacity caps and cut-off times, decremented atomically — full slots simply disappear from selection.
  • [Grocery storefront] Categories, search, product cards with MRP versus offer price and unit pricing (per kg, litre, pack).
  • [Fast cart] Quantity steppers with live bill computation — item total, delivery fee, handling fee.
  • [Order tracking timeline] Placed to packed to out-for-delivery to delivered, with status notifications to the customer.
  • [Packing queue] Store staff see orders grouped by slot, in packing priority order.
  • [Inventory with expiry awareness] Stock alerts plus near-expiry flags so the store can run clearance offers on perishables.
  • [Payment modes] UPI and cash-on-delivery with address management.

What is included

  • Complete source code (React storefront, DRF API, models, seed catalog)
  • Slot-engine and order-state-machine documentation
  • Setup guide (local run, database setup, deployment notes)
  • Project report PDF (background, slot-capacity design, fulfillment flow, testing notes)
  • PPT presentation for final review
  • Viva Q&A preparation document (REST design, atomicity, state machines, e-commerce domain)

Limitations & prerequisites

  • Delivery itself is handled by the store's own riders — no third-party logistics integration.
  • Notifications need an SMS/email gateway account; hooks are included.
  • The demo ships with a sample catalog; real products, prices and slots must be configured.
  • Route optimization for riders is out of scope (listed under future scope).
  • Subscription/recurring orders are not part of this build.
  • Very high order volumes would need queue-based processing beyond the student build.

Frequently Asked Questions

How do delivery slots prevent overbooking?

Each slot has a capacity counter decremented atomically when an order is placed — once full, the slot is no longer offered. Cut-off times are enforced server-side.

What happens to perishables?

Products carry expiry awareness; near-expiry stock is flagged so the store can discount it before it spoils.

Can customers change slots after ordering?

Yes, before the cut-off — the old slot's capacity is released and the new one decremented in the same transaction.

How does the store know what to pack?

The dashboard shows a packing queue grouped by delivery slot, in priority order.

Is payment online?

UPI is supported alongside cash on delivery; the gateway runs in sandbox mode in the demo.

Is this project suitable for a final-year project?

Yes — for Computer Science, IT and related programs. It demonstrates full-stack development, capacity-constrained scheduling, state machines and e-commerce fulfillment logic. Suitable for B.E./B.Tech final-year projects in Computer Science, IT and Web Development.

Components & software requirements
  • React 18 single-page storefront
  • Django 5 + Django REST Framework API
  • PostgreSQL relational database
  • Atomic slot-capacity decrement
  • Order state machine (placed/packed/shipped/delivered)
  • Notification hooks (SMS/email gateway)
  • Token authentication
Delivery information

Built-to-order project. Delivery timeline is shared after order confirmation based on current queue.

Support terms

Complete documentation, setup guide, and viva preparation included. Support for setup and explanation provided.

Download abstract (PDF)

Related guides

All guides
Technical illustration of a cloud server pushing event envelopes outward to web application endpoints for payments, dashboards and chat.Web development and IoT students who have built a REST API or an ESP32 project and now need external services (payments, GitHub, messaging) to notify their app when things happen

Webhooks Explained: Receive Data from Payments, GitHub and IoT

A webhook lets a service call your server the moment an event happens — payments, code pushes, form submissions. This guide explains the event anatomy, HMAC signature verification, the fast-acknowledge reliability pattern, local testing, and how webhooks compare with polling, WebSockets and SSE.

Read guide
Illustration of Docker Compose orchestrating a full-stack application with frontend, API, database, and cache containers connected in one network.B.E./B.Tech Computer Science and IT students whose full-stack projects need a frontend, backend, and database running together and are tired of setup instructions that only work

Docker Compose for Full-Stack Projects

Stop juggling four terminals and setup docs that only work on your laptop. This guide builds a complete Docker Compose stack — frontend, API, database, cache — with annotated config, healthchecks, persistent volumes, and a dev/prod split that survives demo day.

Read guide
Illustration of a web page with a comment section: a shield filtering user input so scripts are neutralized into harmless text before rendering in visitors' browsers.B.E./B.Tech Computer Science, IT and Web Development students building web applications with user-generated content: comments, profiles, forums, dashboards

XSS Attacks Explained for Students

Cross-site scripting turns your comment section into code running in visitors' browsers. Learn the three XSS types conceptually, why browsers execute injected input, what it enables, and the defender's toolkit: output encoding, Content Security Policy, safe DOM handling, and hardened cookies. No payloads — prevention only.

Read guide
Get a quotation