Headless Shopify development, when it's worth it
We’re a headless Shopify agency that builds storefronts in Shopify Hydrogen or Next.js, with checkout kept on Shopify. Headless costs more to build and to run, so we start by checking it’s the right choice for your store. Often a well-built theme is.
- Headless builds
- From £12k
- Built with
- Hydrogen, Oxygen, Next.js
- Checkout
- Stays on Shopify
- Pricing
- Fixed before work starts
What a headless Shopify build includes
Shopify still runs your products, orders and checkout. What changes is everything your customers see before they pay.
Storefront
A custom front end for your Shopify store
Every page your customers see, built in React and fed by Shopify's Storefront API. Products, prices, stock and orders stay in Shopify, so your team keeps working in the admin they know.Content
Content your team can edit
Without a theme there's no theme editor, so we set up where content lives: Shopify's own flexible content (metaobjects) or a headless CMS if you already use one.Checkout
Checkout stays on Shopify
The basket is built in your storefront, then customers move to Shopify's own checkout to pay. You keep Shop Pay, your payment settings and any checkout changes you already have.Accounts
Customer accounts and order history
Sign in, past orders and saved addresses through Shopify's Customer Account API, so customer data stays in Shopify rather than a separate system.Apps and integrations
Apps that work without a theme
Many App Store apps add their features through your theme, so on a headless store they need connecting through their API or replacing. We check each one before quoting.After launch
Hosting, monitoring and support
Deployments, previews for each change, error monitoring and speed checks. The people who built the storefront look after it afterwards.
When Shopify headless makes sense
Headless earns its extra cost in a few clear situations.
Content-heavy brands
Editorial and shopping in one place
Magazines, guides, lookbooks or recipes mixed tightly with products, where a theme's page templates start to get in the way.Custom experiences
Interfaces a theme can't reasonably do
Complex configurators, app-like product journeys or interactive tools that need a full React application rather than theme code.More than one front end
Several storefronts on one catalogue
A website, a mobile app, in-store screens or separate brand sites that all need the same products, prices and stock from one Shopify store.Performance at scale
Very large catalogues and heavy traffic
Where you need full control over caching, search and how each page loads, and the budget to keep that control maintained.An existing React team
Developers who already work in React
If you have in-house React developers, a headless storefront lets them work in tools they know, with us building the foundations or the whole thing.
When an Online Store 2.0 theme is the better choice
For most stores, including many large ones, a custom theme gets the same result for less. See Shopify theme development or, if speed is the worry, our Shopify CRO work.
Lower cost
Cheaper to build and to run
A custom Online Store 2.0 theme costs less up front, and every later change is smaller because Shopify handles hosting, the storefront and much of the plumbing.Editing
Your team edits pages themselves
The theme editor lets anyone rearrange sections, swap images and launch campaign pages without a developer. Headless needs that rebuilt.Apps
Most apps just install
Reviews, subscriptions, loyalty and search apps work on a theme out of the box. On headless, each one is extra work.Speed
A well-built theme is already fast
Slow Shopify stores are usually slow because of too many apps or heavy images, not because they use a theme. Fixing those costs far less than going headless.
Hydrogen or Next.js?
Two well-supported ways to build a headless Shopify store.
Shopify's own stack
Hydrogen with React Router, hosted on Oxygen
Hydrogen is Shopify's toolkit for headless stores: cart, product options and filtering ready to use. Oxygen is Shopify's hosting for it, at no extra charge on paid Shopify plans. The usual choice when the storefront is mainly a shop.Next.js
Next.js with the Storefront API
Next.js, with Hydrogen's commerce tools or the Storefront API directly, hosted on Vercel or similar. A good fit when the site is content-led, you already run Next.js, or your team knows it well. Hosting is billed by the provider.Either way
Checkout and data stay in Shopify
Both routes send customers to Shopify's checkout and keep products, orders and customers in your Shopify admin. Which one fits depends on your content, your team and where you want to host.
Headless collection and search pages with Boost
Our speciality. You don’t need a fully headless store to get collection pages that feel like an app. If you use Boost for search and filters, we build the collection and search pages in React on top of it, and leave the rest of your theme alone.
It’s the biggest gain for stores with large or technical ranges, for a fraction of the cost of going fully headless.
React collection pages inside your theme
Your theme, checkout and apps stay as they are. Collection and search pages become a fast React app that reads products and filters from Boost's search and filter API.Filters built around how you sell
Your own filter groups and price ranges, active-filter chips, and mobile filter and sort drawers. Filters live in the address bar, so a filtered page can be shared or bookmarked.Product cards that do more
Side-by-side comparison, deal and bundle badges, reviews, and variants shown as their own cards where that helps, such as each fabric colourway.Boost keeps learning
Searches, clicks and add-to-carts are sent back to Boost, so its merchandising rules, analytics and recommendations keep working as before.Quick on a phone
Filtering responds as people tap, with loading placeholders instead of blank pages, and products fetched in batches so scrolling stays smooth.
Our headless, React and Next.js work
Our headless work so far is collection and search pages rather than whole storefronts. Here’s that, and the rest of our React and Next.js work.
Case study
React and Boost collection pages for a specialist retailer
Separate collection layouts for sewing machines and fabrics, built as a React app on Boost inside the store's theme: live filters, comparison, deal badges and fabric colourways as their own cards.This website
ec-web.co.uk
Built by us in Next.js and React, the same framework used for Next.js headless storefronts. It isn't a Shopify store, but it's our own production Next.js work.Our own apps
Four live Shopify apps
Ask AI, Behaviour Discount, Packstation PLUS and VPress Sync are React applications we build and run, working with Shopify's APIs every day.Case study
Four stores, one theme, six languages
Shopify stores for the UK, EU, US and Germany on a shared theme with a sync process, hreflang across about 35 countries and orders from Zalando via an ERP. Built on a theme rather than headless.
How a headless Shopify project runs
- 1
Is headless right for you?
A free review of your store, your content and your team. If a theme would do the job better, we'll tell you and show what it would cost instead. - 2
Scope and fixed price
A written proposal within three working days: Hydrogen or Next.js, where content lives, which apps need replacing, hosting, the price and the timeline. - 3
Build with regular demos
Built against a copy of your catalogue, with a preview link for every change so you see progress as it happens, not just at the end. - 4
Launch and look after it
Tested with real products, orders and checkouts before go-live, released at a quiet time, then supported by the people who built it.
Headless Shopify pricing
Fixed prices, agreed in writing before work starts.
- Headless Shopify build
- From £12k
- A full storefront in Hydrogen or Next.js, scoped and priced in writing.
- Boost collection and search pages
- From £4k
- Headless collection and search pages in React, inside your existing theme.
- Not sure yet
- Free review
- An honest view of whether headless is right for your store, before you spend anything.