A WhatsApp-first storefront for a family sweet maker
A mobile-first online store for a family sweet maker from Madugula, Andhra Pradesh: customers browse, fill a cart and place the order in one tap on WhatsApp.
- Client
- Madhuram Bites: halwa, snacks, cookies and healthy laddoos
- Heritage
- Family recipes more than 135 years old
- Ordering
- Cart, checkout form, then a pre-filled WhatsApp order
- Payments
- UPI QR and UPI ID, cash on delivery, payment link
- Location
- Madugula, Andhra Pradesh, India
What stood in the way
Orders arrived as scattered WhatsApp chats, which made every sale slow and error-prone. The business needed a storefront without the cost and upkeep of a full e-commerce stack.
- 01
No catalogue
Customers had to ask for products, sizes and prices one message at a time.
- 02
Incomplete orders
Names, addresses, PIN codes and quantities came in pieces, so the owner chased details before each dispatch.
- 03
Manual delivery pricing
Charges differ by distance, and working them out by hand for every order took time and caused mistakes.
- 04
Tight budget
No payment gateway fees, no app store listing, no backend server to run.
- 05
Mobile-only customers
Almost every buyer shops on a phone, often on patchy networks.
- 06
A brand to protect
The site had to feel as warm and handmade as the family recipes, not like a generic template.
How we solved it
We built a fast, serverless storefront that keeps WhatsApp as the checkout. Customers get a proper shopping experience; the owner gets one complete, formatted order message per sale.
- 01
Guided ordering
Catalogue, size selection, cart and a validated checkout form replace back-and-forth chat.
- 02
A structured order message
Items, sizes, quantities, subtotal, delivery charge, total, address, payment method and notes arrive in one readable message.
- 03
Automatic delivery pricing
The PIN code sets the delivery charge instantly, with free delivery over a set order value.
- 04
Zero running cost
No database, no server and no gateway fees: the site is static and hosted on Vercel.
- 05
Colours from the logo
Every colour on the site is sampled from the brand's logo, so the storefront feels like an extension of its packaging: warm paper, chocolate ink and golden mithai.
From menu to WhatsApp
- 01Browse the menu
- 02Pick size and quantity
- 03Cart drawer
- 04Checkout with PIN code
- 05WhatsApp opens, order pre-filled
- 06Owner confirms
The customer taps send once, and the order lands in the owner's WhatsApp with every detail already in place.
What we delivered
The full buying journey across six pages: Home, Menu, Product, Checkout, Confirmation and Our Story.
For customers
- Menu with search and category tabs
- Product pages with ingredients, allergen notes and a size selector with live price
- Slide-out cart that survives reloads and return visits
- Validated checkout with PIN code-based delivery pricing
- One-tap WhatsApp order and a UPI payment screen
- Notify-me requests for sold-out items
For the owner
- One config file for WhatsApp number, UPI ID, delivery zones and hours
- A product catalogue file to add products, change prices or mark items sold out without touching code
- Every order in the same readable layout
- New categories appear as menu tabs automatically
What we did
- Brand-led UI and UX design
- Front-end development
- Checkout and delivery logic
- Deployment
Technology
- React 18
- Vite 5
- Tailwind CSS 3
- React Router 6
- React Hook Form
- Framer Motion
- WhatsApp click-to-chat
- UPI
- Vercel
By the numbers
- Platform fees: no gateway commission, no marketplace cut
- ₹0
- Pages covering the whole buying journey
- 6
- Delivery zones priced from the PIN code
- 4
- Complete WhatsApp message per order
- 1
Delivery and scope figures counted from the project itself, not client sales or traffic numbers.
Engineering that holds up
Delivery engine
One function matches the PIN code's leading digits against the delivery zones, first match wins, and applies the free-delivery threshold.
Order builder
The checkout data and cart become one formatted message on a WhatsApp link, so the owner reads every order in the same layout.
A cart that recovers
The cart saves to the browser after every change and survives reloads. Old or damaged saved carts are cleaned up on load.
Honest on a phone
Delivery shows "Enter PIN code" until the charge is known, form inputs never trigger iOS zoom, and a missing photo becomes a cream placeholder, never a broken image.
Before and after
The storefront lets Madhuram Bites take complete, correctly priced orders around the clock with no platform fees, on the channel its customers already trust.
- Before
Prices and sizes shared chat by chat
AfterFull menu with photos, sizes and prices, open 24/7
- Before
Order details collected over several messages
AfterOne complete order message per sale
- Before
Delivery charge worked out by hand
AfterCalculated instantly from the PIN code
- Before
No online presence beyond chat
AfterA branded, shareable storefront with its own product links
- Before
Payment details sent manually
AfterUPI QR and ID shown right after ordering
Before the website, every order was a long WhatsApp chat about sizes, prices and addresses. Now customers see the whole menu with prices, and each order reaches me complete, with the delivery charge already added.
The services behind this project
Building something like this?
Tell us what you are launching and what it has to survive. We will come back with questions, a plan and honest dates.