01
Customer storefront
Browse categories, search, add to cart and check out in a few taps.
Full source code · Next.js 16 · MongoDB
Online Grocery Store Platform
A complete grocery e-commerce system for Bangladesh: a fast storefront with AI search, checkout with cash on delivery, wallet and SSLCommerz, a full admin panel and a delivery-rider app. Ready to brand and launch.
One-click demo logins, no password. The demo admin is read-only, except for demo orders.
- Cash on delivery · Wallet · SSLCommerz
- AI search: English, Banglish & Bangla
- Admin panel + rider app
- Deploy on Vercel, VPS or Docker
Three apps
One store, three apps
Shoppers, store managers and delivery riders each get a focused app, all from one Next.js codebase and one MongoDB database.
02Admin panel
Products, orders, coupons, banners, news, users, messages and settings in one place.
03Delivery rider
Assigned orders with address, phone, map link and a one-tap Delivered button.
Try the whole flow: order as the customer, ship it as the admin, deliver it as the rider.
Storefront
Everything shoppers expect
The storefront covers the whole shopping trip, from finding a product to paying for it, on phones and desktops.
Category browsing
Categories and subcategories, a sidebar, search and a wishlist.
Product quick view
Sale price, savings, stock left and a quantity stepper.
Stock-aware cart
Quantities never exceed stock; the cart is saved on the device.
Delivery location
Pick the address on a map, search places or use the phone’s location.
Accounts
Email sign-up with a 6-digit code, password reset and optional Google sign-in.
Referral wallet
Invite friends and both get wallet credit to spend at checkout.
Checkout & payments
Checkout that gets paid
Prices and totals are rebuilt on the server, and online payments count only after SSLCommerz confirms them.
- 1
Cart
Stock-checked items and delivery fee
- 2
Coupon
Percentage or fixed coupons with minimum order and usage limits
- 3
Pay
Cash on delivery, wallet credit, or cards and mobile banking via SSLCommerz
- 4
Verified
Online payments are confirmed with SSLCommerz’s validation API before an order is marked paid
AI search & recipes
Search the way people talk
Google Gemini picks real products from your catalogue, in English, Banglish or Bangla.
Shoppers can type
- alu peyaj dim
- milk for tea
- chicken curry
- breakfast for 4
- Recipe ideas from the cart, with one-tap add for missing ingredients
- Works without an AI key: keyword search and curated recipes take over
- Rate limited and time-boxed, so costs stay predictable
Admin panel
Run the whole store from one dashboard
Catalogue, orders, marketing, users and customer messages in one panel, and every admin request re-checks the role in the database.
Sales of the last 7 days, order and user counts, low-stock products and the latest orders.
Move each order from pending to delivered, and assign a delivery rider.
Add and edit products, prices and stock, with image upload or download from a URL.
Read contact-form messages and reply by email without leaving the panel.
Every module included
- Dashboard & 7-day sales
- Products & 3-level categories
- Orders & rider assignment
- Coupons
- Hero banners
- News
- Users & roles
- Customer messages with email replies
- Store settings & maintenance mode
Open the admin demo
Every page opens. Changes are switched off, except for demo orders, so you can ship one to the demo rider.
Order flow
From cart to doorstep
Orders move through four clear steps, and the rider closes the loop from a phone.
Step 1
Placed
The customer checks out and the order appears in the admin panel.
Step 2
Processing
The store confirms the order and packs it.
Step 3
Shipped(rider assigned)
Assigning a rider marks it shipped and puts it in the rider app.
Step 4
Delivered(cash collected)
The rider taps Delivered and cash orders are marked paid.
Cancel any order before delivery: stock, coupon use and wallet credit are returned automatically.
Security & control
Secure by default
The checks that are easy to forget are already built in, and every rule is written down in docs/SECURITY.md.
Rate limits
Login, sign-up, checkout and AI are rate limited across all servers.
Role checks
Every admin and rider request re-checks the role in the database.
Server pricing
Prices and totals are rebuilt on the server, never trusted from the browser.
Verified payments
Orders are marked paid only after SSLCommerz confirms the payment.
Hashed codes
Verification and reset codes are random, hashed and single-use.
CSP headers
Strict Content-Security-Policy, no framing, no MIME sniffing.
Safe uploads
Validated image types and sizes; downloads from private networks are blocked.
0 vulnerabilities
Production dependencies pass npm audit.
Under the hood
Modern, typed and documented
A mainstream stack with strict TypeScript, so any Next.js developer can find their way around quickly.
- Next.js 16
- React 19
- TypeScript
- MongoDB + Mongoose 9
- NextAuth 4
- Tailwind CSS 4
- Framer Motion
- Leaflet maps
- Google Gemini(optional)
- SSLCommerz(optional)
- Nodemailer
- lines of TypeScript
- 20,000+
- API routes
- 36
- pages and screens
- 32
- data models
- 10
What’s included
Nothing compiled. Nothing hidden.
The full, readable source of the app that runs the live demo, ready to rebrand and extend.
100% source code
Storefront, admin panel, rider app and API.
Database setup
Indexes, a sample catalogue and demo admin, customer and rider accounts in one command.
Documentation
Setup guide, API reference, security model, deployment guide and changelog.
Deploy anywhere
Vercel, a VPS with Node.js, or Docker with optional MongoDB.
The demo’s products and photos are sample content and not part of the licence. One licence covers one store.
AI-ready codebase
Built to extend with AI coding tools
AGENTS.md and CLAUDE.md map the codebase and its security rules, so tools like Claude Code, Codex or Cursor can add features safely.
- A map of the folders, the commands and the domain rules
- The security rules every API route must follow
- Checks to run before finishing: typecheck, lint and build
Show the free-delivery progress bar on the checkout page too
- Done: Read AGENTS.md (codebase guide and rules)
- Done: Updated src/app/checkout/page.tsx
- Done: npm run typecheck passed
Screens
Every screen, ready today
Screenshots from the live demo. Open it to click through each one yourself.
Storefront Product details Checkout AI search Admin dashboard Orders Products Messages
Ready when you are
Launch your grocery store this week
Full source code, setup in about 15 minutes, and 12 months of updates.