05Demo2026
Saltgrass
Skincare storefront with filters, product pages, a cart and a mock checkout.
Problem
Show the commerce patterns clients ask for most, from browsing to order confirmation, without a payment provider in the loop.
Approach
A static catalogue with filter state held in the URL, a cart that persists between visits, and a mock checkout with validated forms and an order confirmation. Product photography is AI-generated. Static export served by nginx; Lighthouse mobile, measured locally: performance 92 to 93 on the home page and 94 on a product page; 100 for accessibility, best practices and SEO.
Stack
- Next.js 16
- React 19
- TypeScript
- Tailwind CSS 4
- Vitest
What I took from it
A native dialog gave the cart drawer modality, Escape and an inert page for free. Keeping filter state in the URL made the catalogue shareable and easy to test.