Headless Shopify: When Should Your Store Go Headless?

What does headless Shopify actually mean?

A normal Shopify store uses a theme: Shopify hosts the pages, and the design is built in Liquid, Shopify's template language. A headless store splits the two halves. According to Shopify's guide to headless commerce, you build the frontend on whatever stack, framework and hosting you choose, and Shopify's APIs handle the commerce underneath: products, collections, customers, the cart, checkout and international pricing.

Two APIs do the work:

• The Storefront API serves products, collections, search and the cart, then hands the customer over to checkout.
• The Customer Account API lets customers sign in and serves their orders, addresses and profile.

Checkout itself stays on Shopify. Your custom frontend handles everything up to the moment the customer pays, and Shopify takes it from there. That matters, because it means going headless is mainly a decision about how your storefront is built and maintained, not about replacing Shopify's back office.

When does Shopify say you should go headless?

Shopify's documentation frames it simply: consider headless if your business systems, processes or customer experience can't be achieved with Shopify's sales channels, themes and apps. It gives these examples:

• You're building a storefront experience that existing web or mobile tools can't support, or can't support easily.
• You already have a web frontend stack that doesn't use Liquid.
• You want to add Shopify commerce to infrastructure you already run.
• You sell on several channels that Shopify doesn't support out of the box, such as a mobile app, a game, a livestream or a smart device.
• You use a content management system (CMS), or plan to, for content that's integrated with your storefront.

The same page adds a warning worth reading twice: before you commit, make sure the business accepts the extra cost and complexity, and has developers to maintain the storefront after launch.

When should you stay on a Shopify theme?

From the stores we've worked on, the common reasons owners ask about headless are a slow site, a design that feels generic, or a feature they've seen on a big brand's store. None of those automatically needs a headless build.

• A slow store is usually caused by heavy apps, oversized images and too many scripts. Those can be fixed on the theme you already have, as we explain in our guide to Shopify speed optimisation without a rebuild.
• A generic look is a design problem. A custom theme can look as distinctive as any headless frontend.
• A missing feature is often an app or a small custom section away.

If your store sells on one website, your team edits content in the Shopify admin, and nobody on staff writes code, a theme keeps your running costs and your dependence on developers lower.

Theme or headless: how do they compare?

The rows on SEO and maintenance are the ones owners tend to underestimate. Shopify's Hydrogen documentation lists what your app owns: the UI, routing and data loading, session storage, account pages, images and SEO. Hydrogen doesn't ship a component library, so every screen is built for you.

What are your options for building a headless Shopify store?

Shopify lists several routes, depending on what you're building:

Notice the last two rows. If what you really want is to sell from a content-heavy site you already have, you may not need a full headless storefront at all.

Hydrogen on Oxygen or on Vercel

Hydrogen handles the Shopify-specific parts that are easy to get wrong, such as the cart, variant selection, collection filtering, analytics and the routes that apps and checkout depend on. It works with frameworks that run server code, including Next.js, React Router, Nuxt, Astro and SvelteKit. Shopify offers two starting templates: React Router 7 deployed to Oxygen, and Vercel Shop, Vercel's Next.js 16 template deployed to Vercel.

Where you host decides which sales channel you use. The Hydrogen channel is for Hydrogen storefronts deployed to Oxygen. The Headless channel is for anything you host yourself, including mobile apps and Hydrogen storefronts deployed elsewhere, like Vercel. If you plan to pull editorial content from a CMS, our comparison of headless CMS options for Next.js covers that side of the stack.

What changes for SEO when you go headless?

A theme gives you product URLs, redirects and basic tags without much thought. A headless build has to do these on purpose:

• Product URLs. Shopify's standard product URL format is /products/:handle. If your storefront uses a different structure, Shopify says you should provide a server-side 3XX redirect from the expected /products/:handle path to the product page.
• Cart permalinks. Your storefront should support them. Hydrogen's request handlers take care of this for you.
• Redirects. In Hydrogen, if your router can't find a page, it checks the store's URL redirects before the customer gets a 404.
• Tags and structured data. Meta tags, Open Graph tags and structured data are your app's job, rendered through your framework's head or metadata API.

Moving an existing store from a theme to a headless frontend is a site migration, with the same risks to rankings. Plan the URL map before launch, as we describe in our guide to migrating a website without losing rankings.

What does a headless store need after launch?

This is where the extra running cost shows up. Three things to plan for:

1. Keys and security. Each storefront gets a public and a private Storefront API token. Shopify's guidance is that the private token is a secret: never expose it in client-side code or a mobile app, and never give it a browser prefix like NEXT_PUBLIC_. Credentials can be rotated at any time, and should be rotated straight away if a private token leaks.
2. Version upgrades. Hydrogen is versioned. The current documentation covers Hydrogen 2026-10 and points stores built on 2026-04 or earlier to a migration guide. Someone has to do those upgrades.
3. Every new feature is development work. On a theme, a merchant can often add a section in the editor. On a headless storefront, new layouts and pages usually mean a developer and a deployment.

A quick checklist before you decide

Go headless if you can answer yes to most of these:

• We've written down a specific experience or channel that a theme and apps can't support.
• We've ruled out speed and design fixes on our current theme.
• We have, or will pay for, developers to maintain the storefront after launch.
• We have a plan for URLs, redirects and SEO tags.
• Every app we rely on has been checked against a headless setup.

If most answers are no, put the budget into a better theme build instead. Our Shopify development services cover both routes, so we can tell you which one fits before you spend anything.

Frequently asked questions

Is a headless Shopify store faster than a theme?

Not automatically. A headless frontend can be very fast, but speed depends on how it's built, hosted and loaded with scripts. A well-optimised theme often beats a poorly built headless site, so measure your current store before assuming a rebuild is the fix.

Does checkout change if I go headless?

No. Checkout stays on Shopify. Hydrogen doesn't include checkout UI for exactly that reason: your storefront hands the customer over to Shopify's checkout when they're ready to pay.

Can I build a headless Shopify store with Next.js?

Yes. Hydrogen works with Next.js, and Shopify points to Vercel Shop, a Next.js 16 template deployed to Vercel, as one of its two starting templates. A Next.js storefront hosted on Vercel gets its API access through the Headless channel rather than the Hydrogen channel.

Can developers start building before the store is set up?

Yes. Shopify provides mock.shop, a public Storefront API with demo data that needs no store or access token. It's useful for prototyping a frontend before connecting your real catalogue.