01 / PROBLEM STATEMENT
Why this work exists
A Moroccan dental-supplies business needed a structured catalogue and consistent shopping flow without abandoning WhatsApp, the channel customers already used to confirm orders.
Data and source material
- Product, category, variation, offer, campaign, university, and student-pack records in PostgreSQL
- Original and generated card/detail images in Supabase Storage
- Owner and administrator records protected with Supabase Auth and Row Level Security
02 / SOLUTION OVERVIEW
From input to usable output
I built a dedicated storefront and operations layer. Customers search products, browse categories and student packs, save favorites and fill a cart; the final cart becomes a structured WhatsApp order message. Administrators manage the catalogue, promotions, campaigns and manual sales.
- 01
Catalogue and pack imports validate source files in dry-run mode
- 02
Storefront search, categories, variations, favorites, and cart support product discovery
- 03
Cart contents become a structured WhatsApp message
- 04
Administrators manage products, campaigns, student packs, manual sales, and analytics
03 / TECHNICAL ARCHITECTURE
Implemented components
Next.js 16 + React 19 storefront and admin routes
Supabase Auth and PostgreSQL with Row Level Security
Supabase Storage with generated card/detail WebP variants
Zustand client cart; rate-limited WhatsApp submissions
Vitest coverage; Vercel Analytics and Speed Insights
04 / METHODOLOGY & IMPLEMENTATION
Decisions that shape the system
- Next.js 16 App Router separates storefront, account, and administrator workflows.
- Zustand keeps the browser cart responsive while PostgreSQL remains authoritative for durable records.
- Maintenance scripts default to dry-run and require explicit production confirmation before writes.
- An image pipeline creates WebP card and detail variants to control storage egress.
Implemented capabilities
- Searchable catalogue, categories and variation-aware product pages
- Student packs grouped by university and academic year
- Persistent cart, favorites and cart-to-WhatsApp confirmation
- Customer profile, delivery address, notifications and order history
- Admin workflows for products, offers, campaigns, manual sales and analytics
- WebP image-variant pipeline with dry-run-first maintenance scripts
05 / RESULTS & EVIDENCE
What the source supports
- The repository documents a production catalogue used by a real business.
- The implemented flow preserves WhatsApp confirmation while adding searchable product discovery and structured administration.
- No revenue, order-volume, or conversion claim is publicly documented.
Results preserve the repository’s units, evaluation framing, and stated limitations. Missing evidence is not converted into a claim.
06 / CHALLENGES & LIMITATIONS
Where the evidence stops
- Checkout intentionally ends in WhatsApp; it is not an online-payment system.
- Operational results depend on the business maintaining catalogue data and media.
- The public case study omits customer records, credentials, and private business data.
07 / WHAT THIS DEMONSTRATES
Engineering signal
Translating an existing sales process into a production product without forcing the business to abandon the channel its customers already understand.
08 / SOURCE & RELATED WORK
Trace the evidence
5258729fc34fab21131d8452c0ba2c1fda929502 ↗README.md · docs/catalogue-import.md · docs/image-egress.md · supabase/migrations/