ChatCart | WhatsApp Ordering Store Next.js Application
ChatCart: turn your catalog into orders on WhatsApp
ChatCart is a self-hosted storefront whose checkout is a pre-filled WhatsApp message. There is no payment gateway and there are no transaction fees. Customers browse your catalog, build a cart, and tap “Order on WhatsApp”. The full order arrives in your chat, and a matching order is saved in your admin.
It is built with Next.js 16 (App Router), React 19, TypeScript, MongoDB and Tailwind CSS v4. You get the complete source code: storefront, admin console, and API in one repository.
Live demo
- Storefront: https://demo.chatcart.jawad.work
- Admin console: https://demo.chatcart.jawad.work/admin (email admin@chatcart.demo, password ChangeMe123!)
- QR menu store: https://demo.chatcart.jawad.work/s/aroma-cafe
- Documentation: https://chatcart.jawad.work/docs/
The demo is open to everyone and signs you in with full owner rights, so feel free to change anything. It is reset regularly.
Why WhatsApp checkout
- No payment gateway. You are paid the way you are paid today: cash, bank transfer, or a payment link you send in the chat.
- No transaction fees. Nothing is taken from each order.
- No WhatsApp Business API. ChatCart builds a normal
wa.melink. Any WhatsApp number works. - No activation server. Your purchase code is stored as a note only. The app never calls home.
One install, three ways to sell
- Store: a full shop with categories, search, filters, and product pages.
- QR Menu: dine-in ordering. The table number is read from the QR code link.
- Link in Bio: a compact mobile menu for Instagram and TikTok profiles.
The storefront
- Browse and buy. Mega menu, category and search pages with filters (price, stock, sale, rating, brand) and sorting, product pages with variants, galleries, specs and reviews, quick view, recently viewed, cart drawer, and wishlist.
- Order confirmation page. It repeats the order and adds a button that re-opens WhatsApp, plus a copy fallback if the chat did not open.
- Fulfillment. Delivery with a flat fee, a free-delivery threshold and per-zone fees, plus pickup and dine-in.
- Customer accounts. Optional per store: registration, login, order history, saved addresses, and one-tap reorder. Guest checkout always works.
- Reviews. Optional per store: star ratings with a moderation queue or auto-approve. Ratings feed the storefront filters and sorting.
- Blog and newsletter. SEO-friendly posts with cover images, and a signup that collects subscribers you can export as CSV.
- Mobile first. The storefront is installable as a PWA and works offline.
The WhatsApp order message is yours to write
Edit the order message with token chips and a live preview. Tokens cover the items, subtotal, discount, delivery, total, and the customer details. Write your own wording in any language, and see the result before you save. Prices and coupons are always recalculated on the server, so the order you receive is the order the shopper paid for.
Admin console
- Dashboard with sales charts and recent orders, for each store.
- Categories, customers, and blog posts.
- Marketing (subscribers) with CSV export.
- Appearance: brand color, corner radius, logo, favicon, banners, and home sections.
- Settings: message template, fulfillment, features, currencies, languages, SEO, and analytics.
- Users with role-based rights: owner, manager, and staff. Managers and staff can be scoped to specific stores.
Every chat order is saved and tracked
WhatsApp gets the message, and your admin keeps the record. Each order has a status flow from Pending to Completed, internal notes, the exact WhatsApp message that was sent, a printable invoice, CSV export, and a one-click button to message the customer again.
Catalog, coupons, and reports
- Products. A variant editor, image gallery, specs, and CSV import and export.
- Inventory. Stock tracking, low-stock thresholds, backorders, and automatic in-stock or sold-out badges.
- Coupons. Percentage, fixed amount, and free-shipping codes with minimum order, usage limits, date ranges, and category or product scopes. Validated on the server.
- Reports. Sales by period and top products, with CSV export.
Your brand, no rebuild
- Per-store branding. Brand color, corner radius, logo, and favicon. The storefront re-skins itself at runtime, with no rebuild.
- Home page section builder. Hero, featured products, categories, banners, new arrivals, deals, testimonials, newsletter, rich text, and blog. Toggle and reorder every section.
- SEO and analytics. Per-store meta title, description and share image, sitemap, robots, product JSON-LD, a web app manifest, and optional Google Analytics and Meta Pixel IDs.
Languages, currencies, and multi-store
- 7 languages with RTL. English, Arabic, Spanish, French, Bengali, Hindi, and Portuguese. Arabic gets a full right-to-left layout.
- Multi-currency. A display-only currency switcher with rates you manage. Orders are always placed in the store currency.
- Multi-store. Run several stores from one install, each with its own domain or path, theme, currency, languages, and message template.
Built with
- Next.js 16 (App Router) and React 19
- TypeScript in strict mode
- MongoDB with Mongoose
- Tailwind CSS v4 and Radix UI
- next-intl, Zod, and Zustand
- Vitest unit tests and a Playwright smoke test
Requirements
- Node.js 20 or newer
- MongoDB: local, Atlas, or any Mongo-compatible URI
- A WhatsApp number to receive the orders
What you get
- Full, readable source code with no obfuscation and no encrypted files.
- One-command demo data:
npm run seedcreates two stores, about 30 products, orders, reviews, coupons, and blog posts. - Written documentation: installation, configuration, the WhatsApp template guide, and credits.
- Deploy to a VPS with PM2, or to a Node host such as Vercel.
- Free updates and support from the author.
