/Bonsai Marrakech
Headless Laravel API + Next.js storefront for a fast‑casual Asian restaurant, featuring dynamic menu, discounts, and secure CMI checkout.
Project Overview
Replaced an aging WordPress site with a modern headless stack: Laravel Sanctum‑secured API powers content, while a Next.js SPA delivers sub‑second interactions.
Menu is modeled as categories → items, with automatic discount rules (e.g., “‑10 % on multiple items”).
Integrated CMI payment gateway for Moroccan dirham transactions, including 3‑D Secure flow and webhook‑based order status updates.
/Gallery
Challenges & Solutions
Challenge
Implementing CMI’s SOAP‑based payment API inside a modern JS stack
Solution
Wrapped CMI SOAP calls in a Laravel service layer and exposed RESTful endpoints consumed by Next.js
Challenge
Keeping first contentful paint under 1 s despite rich imagery
Solution
Used Next.js incremental static regen for menu pages, Next/Image with AVIF + blur placeholders, and Cloudinary CDN for assets
