Headless Commerce: The Real Guide for Non-Engineers

Every agency that pitches "headless commerce" to an Australian brand uses the word slightly differently, which is part of why the architecture is confusing for founders who didn't come up through engineering. The marketing teams use it to mean "modern and fast." The Shopify partners use it to mean "Shopify Hydrogen." The custom-build agencies use it to mean "anything that isn't Shopify." None of those are wrong exactly. They're just talking past each other.

The opinion up front: headless commerce is a real architectural pattern with genuine benefits and real costs, and most brands that think they need it actually don't. The brands that do need it usually arrive there for one of three specific reasons that have nothing to do with being "modern." If your reason for considering headless is "we want our site to be faster" or "we want a custom design" — there are simpler answers. If your reason is "our product model doesn't fit standard Shopify" or "we need a single backend for multiple frontends" — headless might be the right call.

The nuance: there are now four meaningfully different architectures sold under the "headless" label, with very different costs and trade-offs. Picking the right one matters more than picking headless versus not-headless.

What "headless" actually means

In traditional e-commerce, the same platform handles the data layer (products, inventory, orders, customers) and the presentation layer (the website your customers see). Shopify, WooCommerce, and BigCommerce on a default theme are all "headed" platforms — the head (frontend) and body (backend) ship together.

Headless commerce separates the two. The backend handles the data and exposes it via an API. The frontend is a separate application that talks to the backend over that API. The two pieces are deployed independently, updated independently, and can be built in completely different technologies.

The visible benefit: the frontend can be anything you want, using any framework. Custom Next.js site. A native iOS app. A in-store POS interface. A voice ordering system on a smart speaker. All talking to the same backend, all using the same products and inventory.

The hidden cost: you now own two systems instead of one. They have to be integrated, kept in sync, and updated together. That's real engineering work, ongoing.

The four real headless architectures

The marketing pitches collapse these into one term. The actual choices are distinct.

1. Shopify with Hydrogen (Shopify-managed headless)

Shopify Hydrogen is Shopify's own framework for building custom frontends against the Shopify Storefront API. The frontend is a Remix-based React application, deployed to Shopify Oxygen (their hosting). The backend is still standard Shopify Plus.

The benefit: you get a custom React frontend with full design flexibility, but everything else — products, orders, payments, checkout, apps, admin interface — is still Shopify. The integration overhead is minimal because Shopify supplies both ends.

The trade-off: you're still locked into Shopify. The checkout is still Shopify's (you can extend it via Checkout Extensibility, but not replace it). The apps ecosystem still gates you. The pricing is Shopify Plus pricing.

This is the pragmatic choice for brands that want a custom frontend but don't want to leave Shopify. The build cost is meaningful but bounded — typically AUD $40,000-$120,000 for the frontend, on top of standard Shopify Plus running costs.

2. Next.js frontend with Shopify backend (custom storefront, Shopify body)

A more flexible variant: use Next.js (or any other framework) for the frontend, deploy on Vercel, and connect to Shopify via the Storefront API. Vercel Commerce is a reference template that does exactly this.

The benefit: same as Hydrogen — custom frontend, Shopify backend — but you're not locked into Shopify's hosting or Shopify's framework choice. You can use the same Next.js code with a different backend later if you ever need to migrate. Vercel's edge network is generally faster than Oxygen at the time of writing.

The trade-off: Shopify supports this pattern but it's a second-class citizen. Some Shopify features don't surface through the Storefront API. Updates to Shopify don't always work with custom frontends until partners catch up. You're a bit more on your own.

Cost similar to Hydrogen, sometimes slightly higher because you're building more of the integration yourself.

3. Open-source backend with custom frontend (full headless, self-hosted)

This is the architecture custom-build evangelists usually mean. An open-source commerce backend — Saleor, Medusa.js, CommerceJS, or build-your-own on top of Stripe — paired with a custom Next.js frontend. The whole stack lives on your infrastructure. You own everything.

The benefit: full ownership. No monthly platform fee. No vendor lock-in. The backend can be modified for whatever your product needs. The frontend is whatever you want.

The trade-off: you're now operating a commerce platform. Backend updates, security patches, payment integration, tax calculation, shipping integration, inventory management — all your responsibility. The team you need is bigger and more technical than for Shopify.

The cost picture is bimodal. The build is expensive — AUD $150,000-$400,000 for a serious launch. The running cost is low — your monthly bill is hosting and database, typically AUD $300-$2,000. Over five years, this is the cheapest architecture if you can sustain the team to operate it. If the team capacity goes away, you're in trouble.

Medusa.js has emerged as the leading TypeScript-based open-source backend; Saleor is Python-based and stronger for international and complex catalogue use cases. Both are credible up to maybe AUD $30M annual revenue if the operating team is good.

4. Headless with a different backend (Stripe-only, BigCommerce, etc.)

The fourth option: skip the open-source commerce platforms entirely, build your own catalogue and order management directly against Stripe for payments, with a custom Next.js frontend. This is the most-bespoke architecture and the hardest to justify.

It's appropriate when your product model is genuinely unusual — service marketplaces, custom-priced enterprise products, hybrid product-and-service offerings — and none of the existing platforms model it cleanly. The build is the most expensive and the operating overhead is highest, but the result is exactly what your business needs.

We don't recommend this lightly. It's the right answer for maybe 1 in 50 brands that come to us. When it is the right answer, the alternative is fighting a platform every day.

What headless actually buys you

The honest list of benefits, by category:

Performance. A custom frontend over a well-cached API can be faster than the same-platform default theme, especially on mobile. Page-load improvements of 30-60% are real. But "faster" needs to be measured against the right baseline. A well-tuned Shopify Plus theme isn't slow. Shop Pay is fast.

Design flexibility. This is real and significant. A custom frontend has zero constraints on what the site can look like or how it can behave. The trade-off is that the build is bigger and the cost of "we want to change this" is higher because there's no theme editor for non-developers.

Backend independence. If you want to migrate from Shopify to Saleor in two years, headless makes that less painful because your frontend stays the same. This is genuinely valuable for brands planning to outgrow their current platform.

Multi-frontend support. If you need one backend serving a website, a mobile app, and an in-store POS, headless is essentially required. There's no clean way to do this with a traditional headed platform.

Localisation and international. Headless makes it easier to ship multiple frontend variants (different languages, different layouts, different feature sets) against the same backend. Saleor is particularly strong here.

What headless does NOT buy you

The marketing pitches gloss over these.

It doesn't automatically make your site fast. A badly-built headless site can be slower than a well-tuned Shopify theme. Speed is an outcome of disciplined engineering, not architecture choice.

It doesn't reduce maintenance cost. You're operating more systems, not fewer. The maintenance cost can be lower over time if the architecture is right, but the immediate effect is more moving parts to manage.

It doesn't make migrating between platforms trivial. "Backend independence" sounds great until you actually try to migrate and discover that your business logic was deeply tied to specific platform features.

It doesn't reduce design time. Custom design is custom design. You still need the design work and the frontend implementation work. Headless doesn't shortcut that.

It doesn't solve conversion problems. If your current site has a hero that says nothing and a 12-field contact form, going headless won't fix any of that. You'll have the same problems on a more expensive stack.

The cost honest math

For an Australian brand doing AUD $5M annual revenue, the realistic five-year cost of each architecture:

Shopify Plus standard. USD $2,500/month = AUD $230K. Apps and ongoing dev: AUD $150K. Total: ~AUD $380K.

Shopify Plus + Hydrogen (managed headless). Same Shopify Plus + AUD $80K Hydrogen build + AUD $50K ongoing maintenance. Total: ~AUD $510K.

Next.js + Shopify Storefront API (custom storefront, Shopify body). Same Shopify Plus + AUD $100K build + AUD $80K ongoing. Total: ~AUD $560K.

Open-source backend + custom frontend. AUD $250K build + AUD $40K/year hosting and database + AUD $150K ongoing dev. Total: ~AUD $640K but no platform vendor risk.

Fully custom on Stripe. AUD $400K build + AUD $30K/year hosting + AUD $200K ongoing dev. Total: ~AUD $830K.

Several things stand out. First, the cheapest option is "stay on Shopify Plus" for most brands at this revenue scale. Second, the headless premium is real but bounded — maybe 30-70% more expensive than vanilla Shopify Plus over five years. Third, full custom is significantly more expensive than the headless middle ground.

The break-even shifts as revenue scales. At AUD $20M annual revenue, the Shopify Plus variable fee starts eating real margin and the custom options look better. At AUD $50M, custom is usually the cheapest option. Below AUD $2M, anything custom is hard to justify.

When headless is actually the right call

The three specific reasons we recommend headless to clients:

Your product model can't be cleanly expressed on Shopify. You've stacked four apps to model your variants. Inventory is half right because the apps don't talk to each other cleanly. Your checkout has limitations the apps can't fix. The cost of fighting the platform is higher than the cost of changing platforms.

You need multiple frontends from one backend. Website, mobile app, in-store kiosk, B2B portal — all running off the same product, inventory, and order data. Headless is essentially required here.

You're planning to scale past where Shopify Plus pricing stops making sense. If your three-year plan takes you to AUD $30M+ annual revenue, the variable Shopify Plus fee at that scale is substantially more than running a custom platform. Starting to migrate at AUD $5M is easier than starting at AUD $25M.

If you're not in one of those three cases, headless is probably the wrong answer for your brand. The benefits are real but bounded, the costs are real, and the simpler choice often outperforms over the medium term.

How to choose between the headless options

If you've decided headless is right, the choice between the four architectures comes down to a different question: how much platform versus how much ownership.

Hydrogen or Vercel Commerce + Shopify backend — you want a custom frontend but keep all the Shopify infrastructure. Easiest migration, cheapest of the headless options, still has Shopify lock-in.

Saleor or Medusa.js + custom frontend — you want backend independence and lower per-transaction costs, willing to operate the platform yourself. Higher build cost, lower running cost, much more control.

Fully custom on Stripe — your product model genuinely doesn't fit any platform. Highest build cost, most flexibility, requires a real engineering team to operate.

We covered some of the architectural specifics elsewhere. The right answer for your specific brand depends on your product model, your team capacity, and your three-year roadmap more than on which architecture is technically fashionable this year.

Where to start if you're considering headless

The cheapest first step is honest analysis. Before any agency pitches you a six-figure headless rebuild, work out:

• What specific Shopify constraint is the rebuild meant to solve, and what's that constraint actually costing you per month
• What's your three-year revenue plan, and where does that put you in the Shopify Plus pricing curve
• Do you have or can you hire the engineering team to operate a custom platform
• What's your competitive design requirement — is the frontend really the bottleneck, or is it something else

If those answers point toward headless, great — pick the architecture that matches your team and budget. If they point toward better-tuned Shopify, the right move is to tune Shopify instead. Most brands' actual constraint is a tuning problem dressed up as a platform problem.

A practical first step before the headless conversation: run a free audit on your current Shopify storefront. The report shows you exactly where the performance is leaking, what the SEO surface looks like, and which issues are likely worth fixing for a fraction of the cost of a rebuild. If the audit says the constraint is theme bloat and a slow app, you've just saved yourself a six-figure decision.