mammoth templatesHome / Websites / E-commerce Storefronts
Orchard Row is a fully working online shop front end for a fictional homeware brand. It has a home page, a shop page with search, category, price, rating and stock filters and five sort orders, product detail pages (product.html?id=3), a slide-in cart drawer with quantities and a free-shipping meter, a validated checkout and an order confirmation page. Everything the store knows about the outside world goes through one small file, js/api.js.
Today it serves a 14-product catalog from data/products.js and keeps orders in localStorage. When you are ready to go headless, flip API_MODE to rest, edit four functions to match your backend (Shopify Storefront API, Medusa, Saleor, Commerce Layer or your own) and the whole UI keeps working. Prices come from the API, never from the cart, so nothing can go stale.
All 14 products are drawn as original SVG illustrations with live colour variants, so there is not a single image file to license. Checkout is a mock: no payment is processed and card details are never stored.
Highlights
- Product grid with search, category, price, rating, stock and sale filters plus 5 sort orders (state kept in the URL)
- Product detail pages with colour variants, gallery views, stock status and related items
- Cart drawer with quantity steppers, localStorage persistence, cross-tab sync and free-shipping progress
- Validated mock checkout with promo codes, shipping methods, totals and order confirmation
- js/api.js: one swappable mock/REST layer with documented data shapes
- 14 products with original SVG art generated in code, light and dark themes
