2025
UK boiler installation e-commerce — branching quote wizard, Sanity-powered boiler catalog, Stripe checkout, and post-order photo uploads. Next.js 16 with Vercel KV for quotes/orders and embedded Sanity Studio for CMS.
Overview
Heat for Homes is a production e-commerce site for UK boiler installation — from an interactive home survey through boiler selection, checkout, and post-purchase site photo uploads.
Built as a Next.js 16 App Router app with Sanity CMS for boilers, brands, and quote questions; Vercel KV (Upstash Redis) for quote and order persistence; Stripe for card payments; and UploadThing for customer photo uploads. Guest-checkout only — no user accounts.
Quote wizard
The /quote flow is a branching questionnaire driven by Sanity question documents — each answer carries points and can route to the next question or redirect to /contact for unsupported setups (LPG, back boiler, etc.).
Client state uses Jotai (QuestionStepper.tsx). After the final question and postcode entry, POST /api/quote/save scores answers and filters boilers where power[].handle_points meets the customer's needs. Results land at /quote/[id] with a 4-hour KV TTL; customers can save contact details for a follow-up email.
Catalog & checkout
Sanity manages boilers (images, brand refs, kW variants, pricing), brands, and wizard content. The homepage shows onLanding boilers; /brand/[brand] lists per-brand catalogues.
/checkout/[id]?quote={quoteId} runs a 5-step stepper: model/kW selection → install date → contact details → install address → payment (Stripe or pay-on-site). Pricing combines base kW price from Sanity with add-ons from quote answers. use-shopping-cart wraps Stripe Checkout session creation via POST /api/create-checkout-session (GBP).
Orders & post-purchase
On checkout.session.completed, the Stripe webhook calls sellItem() → stores the order in KV as sold:{orderId} and sends a confirmation email (Nodemailer).
/order/[id] lets customers upload up to 8 boiler/site photos via UploadThing; POST /api/sold/uploadImages persists URLs once the order is verified. A QR code and order summary complete the post-purchase experience.
CMS & services
Embedded Sanity Studio at /studio for desk editing and GROQ queries. Blog schemas (post, author, category) exist but no public blog routes yet.
Marketing pages cover plumbing, drainage, power flush, boiler repairs, bathroom/kitchens, service plans (Silver/Gold/Platinum), rates, jobs, and contact. DaisyUI lightHeat theme with dark/light toggle via cookies.
Technical notes
Drizzle ORM + PlanetScale are scaffolded (src/drizzle.ts) but unused — KV is the live data layer. Images served from cdn.sanity.io; standalone Vercel deploy.
No NextAuth despite env placeholders — fully anonymous quote/order flow keyed by generated IDs. Build runs with typescript.ignoreBuildErrors: true in next.config.js.