Last updated: September 2026 · Reading time: 13 min · By the Best Web Developer team
Quick answer
Headless commerce separates your store’s front end from the commerce engine that handles products, carts and orders, connecting them through APIs. It gives you full design freedom, faster pages and multiple storefronts, but it costs more to build and run. It usually makes sense once a store passes roughly SAR 10–20 million in annual online sales or outgrows its theme.
Key takeaways
- Headless is an architecture, not a product. You can go headless on Shopify, BigCommerce, commercetools or open-source engines.
- Typical Saudi builds cost SAR 250,000–900,000, against SAR 15,000–150,000 for a themed Salla, Zid or Shopify store.
- You gain speed, design control and multi-channel reach, but you take on more engineering and hosting responsibility.
- mada, Tabby, Tamara and ZATCA e-invoicing still have to work end to end, so plan them in the architecture from day one.
- Most stores should optimise their current theme first. Headless solves specific problems; it is not an automatic upgrade.
What headless commerce means in plain language
Headless commerce means the “head”, the storefront your customers browse, is built separately from the “body”, the system that stores products, prices, stock and orders. The two talk through APIs instead of being one piece of software.
Headless commerce is an e-commerce architecture in which the presentation layer (website, app, kiosk or social storefront) is decoupled from the commerce back end and exchanges data with it through APIs. A monolithic platform, by contrast, bundles the storefront theme, admin and checkout into one system, which is how most Salla, Zid and standard Shopify stores work.
The idea has been around for years, but it has become practical for mid-sized brands as frameworks such as Next.js and hosted commerce APIs have matured. For Saudi retailers, the question is whether the gains justify the cost, given how capable local platforms already are.
How headless commerce works: the building blocks
A headless store is usually four or five services working together. Each can be swapped without rebuilding the others, which is the main source of both its flexibility and its complexity.
1. The commerce engine
This handles the catalogue, pricing, promotions, cart, checkout and orders. Common choices are Shopify through its Storefront API and Hydrogen framework, BigCommerce, commercetools for enterprise catalogues, and open-source engines such as Medusa or Saleor when you want full control over hosting.
2. The storefront (the head)
A custom front end, often built with Next.js, Remix or Astro, renders pages on the server or at the edge and fetches data from the engine. This is where the Arabic right-to-left layout, the design system and page speed are controlled. A mobile app can act as a second head using the same APIs.
3. The content management system
A headless CMS such as Contentful, Sanity or Strapi stores campaign pages, lookbooks, blog posts and bilingual content. Marketers build Ramadan or National Day landing pages without touching the product catalogue or waiting for developers.
4. Search, payments and the rest
Dedicated services handle product search (with Arabic stemming and synonyms), payments through a Saudi gateway supporting mada, Apple Pay and STC Pay, BNPL through Tabby or Tamara, reviews, and an ERP or order management system that issues ZATCA-compliant e-invoices. Each connection is an API integration that must be built, monitored and maintained.
Note: MACH, composable and headless
You will hear three related terms. Headless means the front end is decoupled. Composable means you assemble best-of-breed services. MACH stands for Microservices, API-first, Cloud-native and Headless, an industry label for fully composable stacks. A store can be headless without being fully composable.
What headless commerce costs in Saudi Arabia
Headless builds cost several times more than themed stores and carry higher running costs. These are typical ranges we quote for Saudi retailers, before 15% VAT.
- Discovery and architecture: SAR 25,000–70,000 over three to six weeks.
- Headless storefront on Shopify Hydrogen or Next.js: SAR 250,000–550,000 for a bilingual store with CMS, search and payments.
- Enterprise composable build with ERP, OMS and multiple storefronts: SAR 600,000–1.5 million and above.
- Running costs: SAR 8,000–40,000 a month for hosting, CMS and search licences, monitoring and a retained development team.
For comparison, a Salla or Zid store with a custom theme typically costs SAR 15,000–60,000, and a custom Shopify theme SAR 40,000–150,000. Our profit margin calculator helps you estimate how much extra conversion a headless build needs to pay for itself at your current margins.
Highlight: the break-even test
If a headless build costs SAR 400,000 more over three years than an optimised theme, and your store sells SAR 12 million a year at a 30% gross margin, you need about SAR 445,000 of extra revenue a year to break even. That is a conversion lift of roughly 3.7%. Faster pages and better UX often deliver that at this scale; at SAR 2 million a year in sales, the same build almost never pays back.
Is headless commerce right for your store? Our readiness checklist
We recommend headless only when at least four of these eight statements are true. Fewer than that, and a well-optimised theme usually gives a better return.
- Annual online revenue above roughly SAR 10–20 million, so small conversion gains are worth large sums.
- Your theme blocks the experience you need, such as configurators, bundles or content-rich product stories.
- You sell through several storefronts, for example Saudi, UAE and Kuwait sites, an app and in-store screens, from one catalogue.
- Mobile speed is failing Core Web Vitals and theme optimisation has already been tried.
- Marketing publishes heavy content weekly and needs a real CMS.
- You have, or will fund, a development team of at least two engineers on retainer.
- Complex integrations with ERP, loyalty, marketplaces or B2B pricing are core to the business.
- Leadership accepts a longer build of four to nine months.
Pro tip
Before you commit, ask your developer to pull a sample product from your platform’s API and show you the raw response. If the data is messy, with missing Arabic fields, inconsistent variants or no structured attributes, a headless front end will expose every flaw. Our free JSON formatter makes that API output readable for non-developers.
Our headless delivery process
When the checklist says yes, we run discovery and architecture first, then clean the product data, then build the storefront and CMS in parallel, then integrate payments and ERP, and finally migrate with a full redirect map. Launch happens outside peak season: never in the last three weeks before Ramadan, White Friday or Saudi National Day.
Mistakes we see most often
- Rendering products in the browser: client-side rendering hides content from crawlers and slows mobile LCP.
- Forgetting Arabic search: English-tuned search returns poor results for Arabic spellings and plurals.
- No owner for integrations: when the payment or ERP connector fails at 2 a.m., someone must be on call.
- Migrating everything at once: a phased move, starting with content pages, lowers risk.
Key benefits of headless commerce
The benefits are real for the right store. They come from control: over design, over speed and over which services you use.
- Speed: server-rendered storefronts with edge caching often reach mobile LCP under 2 seconds, even with rich imagery.
- Design freedom: no theme limits on layout, product storytelling or Arabic typography.
- Omnichannel reach: one catalogue feeds websites, apps, marketplaces and in-store screens.
- Independent releases: marketing and front-end teams ship without touching checkout.
- Best-of-breed services: swap search, CMS or reviews without replatforming.
- Multi-market scale: run Saudi, GCC and international storefronts with different languages, currencies and promotions.
“Go headless to solve a problem you can name and measure, never because a competitor did.”
— Best Web Developer e-commerce team
Headless commerce use cases in Saudi Arabia
In Saudi Arabia, headless setups fit large retailers, multi-brand groups and brands with strong content or app strategies. Smaller stores are usually better served by local platforms.
Multi-brand and GCC retailers
Groups running several fashion, electronics or beauty brands across the Kingdom and the Gulf use one commerce engine with several storefronts, each with its own Arabic-first design and promotions.
App-first brands
Food delivery, grocery and loyalty-driven brands, where most sales happen in a mobile app, benefit from one API layer serving both web and app.
Growing Salla and Zid stores
Stores on Salla or Zid usually get more from custom themes, apps and better product data before going headless. Both platforms offer developer tools and app ecosystems, so check what can be extended before planning a full rebuild. Our e-commerce development service covers both paths.
Illustrative case: a Riyadh beauty retailer goes headless
Challenge: A retailer selling about SAR 28 million a year online ran separate Shopify stores for Saudi Arabia and the UAE. Mobile LCP was 3.8 s, campaign pages took a developer five days each, and its app used a different product database.
What we did: Over seven months and SAR 620,000, we kept Shopify as the engine, built a bilingual Next.js storefront with a headless CMS, unified the catalogue for web and app, and connected mada, Tabby and the ERP that issues ZATCA e-invoices.
Result: Mobile LCP fell to 1.8 s, campaign pages now take marketing half a day, and mobile conversion rose from 1.6% to 1.9% over two quarters, a lift worth roughly SAR 3 million a year in revenue, with mobile making up about 60% of sales.
Headless commerce vs monolithic platforms
Monolithic platforms win on cost, speed to launch and simplicity. Headless commerce wins on control, performance ceiling and multi-channel scale.
| Factor | Salla / Zid theme | Shopify theme | Headless |
|---|---|---|---|
| Typical build (SAR) | 15,000–60,000 | 40,000–150,000 | 250,000–900,000+ |
| Time to launch | 2–8 weeks | 6–14 weeks | 4–9 months |
| Local payments | Built in | Via apps and gateways | Custom integration |
| Design freedom | Moderate | High | Unlimited |
| Team needed | Marketer plus occasional developer | Part-time developer | Two or more engineers |
| Best for | New and mid-sized Saudi stores | Growing brands, cross-border | Large, multi-channel retailers |
Highlight: the hidden costs of going headless
Apps that “just work” on a theme, such as reviews, wishlists, bundles and loyalty, often need rebuilding or API integration in a headless storefront. Preview for marketers, SEO basics like sitemaps and structured data, and analytics tracking must also be rebuilt. Budget 15–25% of the build for these items, which are often missing from first quotes.
See how a themed approach can still scale in our Shopify growth store project.
The future of headless and composable commerce under Vision 2030
Headless is becoming easier and cheaper as platforms ship better starter kits, while Saudi e-commerce keeps growing under Vision 2030 digital economy goals. The gap between themed and headless stores will narrow, but not disappear.
- Hybrid headless: platforms increasingly let you go headless on selected pages, such as campaigns, while keeping a themed checkout.
- AI shopping assistants: clean product APIs make it easier to feed AI search, chat assistants and conversational commerce on WhatsApp.
- Social and quick commerce: one catalogue feeding Snapchat, TikTok and delivery apps is a growing reason to adopt APIs.
- Local compliance: PDPL, ZATCA e-invoicing phases and data residency expectations will shape which services Saudi retailers can combine.
- Vision 2030 retail growth: new malls, tourism and entertainment destinations are pushing omnichannel strategies that link online stock with physical stores.
Frequently Asked Questions about headless commerce
What is headless commerce in simple terms?
Headless commerce is a way of building an online store where the part customers see, the storefront, is separate from the system that manages products, carts, payments and orders. The two communicate through APIs. This lets you design any front end you want, serve websites and apps from the same catalogue, and change one part without rebuilding everything else.
How much does a headless commerce website cost?
In Saudi Arabia, a bilingual headless storefront on Shopify Hydrogen or Next.js typically costs SAR 250,000–550,000, and enterprise composable builds SAR 600,000–1.5 million or more. Running costs for hosting, CMS, search and a retained development team usually add SAR 8,000–40,000 a month. A themed Salla, Zid or Shopify store costs a fraction of that.
Is headless commerce better for SEO?
It can be, but only if built well. Server-rendered headless storefronts are often faster, which helps Core Web Vitals and conversion. However, sitemaps, canonical tags, structured data, hreflang and redirects that a platform theme provides automatically must be rebuilt. A poorly built headless site that relies on client-side rendering can perform worse in search than a standard theme.
Should a Saudi Arabia store on Salla or Zid go headless?
Usually not at first. Salla and Zid include local payments, shipping and Arabic support that a headless build would need to recreate. Most Saudi stores gain more from a custom theme, cleaner product data and speed work. Consider headless once annual online sales pass roughly SAR 10–20 million, you run several storefronts, or the platform clearly blocks growth.
Can Shopify be used as a headless platform?
Yes. Shopify offers a Storefront API and its own React-based framework, Hydrogen, with Oxygen hosting, so you can build a custom front end while Shopify handles products, checkout and orders. Many brands also use Next.js with Shopify’s APIs. This keeps Shopify’s reliable checkout and admin while giving you full control over design and performance.
How long does it take to build a headless store?
A headless store usually takes four to nine months from discovery to launch, compared with two to fourteen weeks for a themed store. Discovery and architecture take three to six weeks, product data cleanup often takes longer than expected, and payment, ERP and e-invoicing integrations need thorough testing. Avoid launching close to major sales seasons.
So, is it right for your store?
Headless commerce is right when your store is large enough, complex enough and well-resourced enough to turn design freedom and speed into measurable revenue. For most stores, an optimised theme on Salla, Zid or Shopify delivers a better return today.
Run the break-even test, score yourself on the eight-point checklist, and fix your product data first. If the numbers still point to headless, plan payments, Arabic, PDPL and ZATCA into the architecture from the first workshop.
Find out if headless will pay back
Share your platform, annual online sales and biggest bottleneck. We will run the break-even test with you and recommend headless, hybrid or an optimised theme.
Get a free consultation See pricingWant this handled for you?
We build and optimise sites like this every week. Book a free 30-minute call and we will tell you exactly what we would change on yours.
Get a free site review
