The Problem

I needed a realistic e-commerce demo that feels production-grade (catalog, PDP, cart, checkout) to showcase component architecture, state management, and UX—without over-engineering a backend.

The Solution

Built a Next.js App Router storefront with server-rendered catalog filtering, a persisted Zustand cart, and an end-to-end checkout confirmation flow (simulated payment).

• Global State ManagementZustand + persistence keeps the cart across sessions and avoids prop drilling or Context re-render pitfalls.
• Search & FilteringCategory + query-string filtering keeps URLs shareable and server-rendered for fast navigation.
• Checkout UXFast add-to-cart, cart drawer, and a clear checkout summary + confirmation state.