E-commerce & Delivery Platform
Nditumeyi Delivery & Marketplace
A multi-category marketplace with dynamic delivery pricing and real-time driver tracking on a live map.
- Django
- React
- TypeScript
- WebSockets
- Django Channels
- Tailwind CSS
- MapLibre GL
- Stripe
- Redis
- Type
- E-commerce & Delivery Platform
- My role
- Architecture, development & delivery
- Core stack
- Django, React, TypeScript
Context
The Problem
Shoppers want to order everyday goods online and know exactly when they will arrive, but many local stores have no online channel and deliveries are coordinated by phone calls and guesswork.
Delivery fees are often flat or negotiated, which ignores distance, weight and urgency, and nobody, neither customer nor dispatcher, can see where the driver actually is.
What I built
The Solution
I built a marketplace where customers browse groceries, clothes, gadgets and hardware, see a transparent delivery quote based on real routing, and pay online in a four-step checkout.
Orders are assigned to drivers manually or automatically to the nearest idle driver. The driver app streams GPS every few seconds over WebSockets, so the customer's tracking page and the admin console update live, with status steps from Preparing to Delivered.
Capabilities
Key Features
Catalogue & search
Category browsing, debounced search autocomplete and price, rating and sort filters.
Persistent cart
Database cart for signed-in users, local cart for guests merged on login, and save-for-later.
Online checkout
Address, delivery option, payment and confirmation steps with Stripe PaymentIntents.
Dynamic delivery pricing
Fees from base, distance, weight, urgency and zone, with the breakdown shown before payment.
Live tracking map
Customer, driver and warehouse markers with route line, ETA and progress.
Driver dashboard
Assigned jobs, pickup and delivery actions, availability toggle and GPS sharing.
Admin console
Live map of every delivery, assignment, order status, products, drivers and revenue.
Real-time notifications
Order confirmed, picked up, driver nearby and delivered, as in-app toasts and Web Push.
Who uses it
User Roles
Customer
Shops, checks out, tracks deliveries live and replays past routes.
Driver
Receives jobs, updates delivery status and shares GPS location.
Admin
Runs operations: assignment, catalogue, drivers, fees, zones and analytics.
User experience
Interface & Screenshots
Storefront Category browsing & filters Product detail Cart & delivery estimate Live order tracking Tracking on mobile Order history & route replay Admin operations console Order management Product management Delivery pricing & zones Driver dashboard Storefront on mobile
Engineering
System Architecture
01Clients
- Customer storefrontShop, checkout, live tracking
- Driver dashboardJobs and GPS streaming
- Admin consoleLive map and operations
02Application
- Django REST APICatalogue, cart, orders, payments, delivery quotes
- Django ChannelsWebSockets for tracking, GPS and notifications
03Data & Realtime
- DatabaseProducts, orders, drivers, deliveries
- RedisChannel layer across workers
04External services
- Maps & routingMapLibre, OSRM, Nominatim, Mapbox
- StripeCard payments
Tools
Technology Stack
- Backend
- PythonDjangoDjango REST FrameworkSimpleJWTdjango-allauth
- Realtime
- Django ChannelsDaphne (ASGI)WebSocketsRedis channel layer
- Frontend
- ReactTypeScriptViteTailwind CSSReact Router
- Maps & routing
- MapLibre GLOpenStreetMapOSRMNominatimMapbox (optional)
- Payments & notifications
- Stripe PaymentIntentsWeb Push
Engineering decisions
Challenges & How I Solved Them
01Real-time tracking at scale
The challenge
Driver positions must reach the right customer and the admin console instantly, even with several server processes running.
How I solved it
Used Django Channels with a Redis channel layer, with one WebSocket room per order and JWT-authenticated connections.
02Fair delivery pricing
The challenge
A flat fee overcharges short trips and undercharges long, heavy or urgent ones.
How I solved it
Calculated fees from real routing distance, weight, urgency and zone surcharges, and showed the full breakdown before payment.
03Keeping customers' data private
The challenge
Tracking rooms reveal live locations, so they must not be open to everyone.
How I solved it
Authorised every WebSocket: customers only join their own orders, drivers only their assigned deliveries, and the admin feed requires staff.
04Running without paid map keys
The challenge
Commercial map APIs add cost and setup before the product has proven itself.
How I solved it
Built on MapLibre with OpenStreetMap, OSRM and Nominatim as a keyless default, upgrading to Mapbox automatically when a token is set.
Ownership
My Contribution
Designed and developed the marketplace end to end: REST API, real-time tracking, storefront, driver and admin apps, and deployment.
- Designed the catalogue, cart, order and delivery data model
- Built the Django REST API with JWT authentication
- Implemented live tracking and notifications with Django Channels and WebSockets
- Built the storefront, driver dashboard and admin console in React and TypeScript
- Implemented dynamic delivery pricing with real routing
- Integrated Stripe payments and Web Push notifications
Outcomes
Results
- Deployed to production with a public live demo at nditumeyi.vivux-ai.com
- [Add verified project metric here]
Live demo available
Try the Live Demo
Explore the system yourself. Sign in with one of the demo accounts to see how each role experiences the platform.
Demo accounts
DEMO ONLYCustomer
- Username
- customer@nditumeyi.com
- Password
- Demo12345!
Driver
- Username
- driver@nditumeyi.com
- Password
- Demo12345!
Admin
- Username
- admin@nditumeyi.com
- Password
- Demo12345!
Browse the store without signing in, or use a demo account. The demo uses sample data and no real payments are taken.