Headless Shopify Storefront with Next.js, Cart, Filters and SetsHeadless Shopify Storefront with Next.js, Cart, Filters and Sets
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Built a headless Shopify storefront straight from the Storefront API. Next.js handles the routing and rendering, the API feeds in 23 products from Shopify's sample catalog, photos and prices included.
Color swatches swap the product shot and the price on click. Filters sit in the URL, so a filtered collection page is a shareable link. There's a set builder: pick three pieces, 15% off.
The cart is real. Add items, change quantities, close the tab, come back a month later. Still there (30-day cookie). Checkout is a mock, no payment.
Also wrote three Liquid sections for Dawn and ran them through theme-check. Zero issues.
100 on accessibility, best practices and SEO on Lighthouse desktop.
Post image
Kaushal's avatar
Crisp, clean, and effective.
Dim's avatar
This is nice
Rasaq's avatar
Impressive build. The shareable filters and persistent cart show great attention to the shopping experience.
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started