As retailers seek out ways to save time, innovate faster, and deliver personalized, robust buying experiences, headless commerce is becoming more widely adopted. In a recent survey of more than 1,000 execs from the world’s largest retailers, over a quarter (27%) are fully headless and modular, using multiple different vendors in their ecommerce stack. A little under half (45%) use a composable front end and a full-stack back end. Only the remaining 29% use a full-stack, all-in-one solution.
To save on licensing costs and development time when adopting a headless strategy, many retailers are using open-source headless ecommerce tools and resources. Unlike proprietary solutions, the source code for open-source software (OSS) is made openly available to the public, free of charge. OSS licenses allow anyone to view, modify, and distribute the code freely.
Why are retailers using open-source tools in their headless commerce tech stacks?
One of the most well-understood benefits of OSS is lower cost. Using something that is prebuilt and freely available can help retailers of all sizes avoid hefty licensing fees and some development costs. For a long time, using OSS was considered something only small companies used, especially in ecommerce. But open-source ecommerce software is quickly becoming a competitive choice by larger retailers, especially those with in-house engineering resources.
Large online retailers can also use OSS as a force multiplier for their in-house development teams. Many times, open-source projects are supported by large global communities of collaborators who are continually improving and innovating the source code. A 2019 survey of developers found that the vast majority (84%) actively contribute to open-source projects. This allows smaller in-house teams to freely adopt new features and functionality developed by a global network of contributors.
Is it better to use an open-source or SaaS platform for my open-source headless commerce storefront?
Because headless ecommerce decouples the front end from the back-end, you get a lot of choice about where to use OSS and when to use licensed software as a service (SaaS). When you’re building a headless ecommerce website, you can choose to build it on either an open-source platform or a SaaS platform (like Shopify). Both solutions allow you to build robust and user-friendly online stores, but have important differences to consider.
Open-source ecommerce platforms
Open-source ecommerce platforms allow developers with deep technical knowledge and specialized skill sets to build ecommerce solutions from freely available code bases. Because developers have access to every piece of source code, the possibilities for customizations are almost limitless. Practically any element of the platform could be adjusted to fit specific requirements.
However, open-source ecommerce platforms can have their drawbacks as well. While the codebase might be freely available, open-source platforms can still have significant costs. Here are a few to consider:
- Skilled resources: As we noted earlier, you’ll need access to specialized, skill developers to build, manage, and troubleshoot issues when they arise. Depending on how customized your online store becomes, finding those resources can become expensive and challenging over time.
- Adding functionality: With open-source ecommerce platforms, there are no licensing costs or subscription fees for the platform itself. That being said, many of these platforms might be missing core ecommerce functions, especially those expected of large retailers. This can mean lots of annual fees for plugins and add-ons that can add up quickly.
- Keeping the lights on and your site secure: Unlike SaaS platforms, when you choose to use an open-source platform, all of the hosting, maintenance, performance, and security compliance responsibilities fall to your technical team. This can add up to a lot of time spent just keeping the site up and running, instead of improving your customer’s buying experience.
To learn more, you can check out our recent look at the six best open-source ecommerce platforms.
SaaS ecommerce platforms
Hosting an headless ecommerce storefront built with open-source tools on a SaaS platform like Shopify can offer a unique set of benefits. It allows companies to get the benefits of using open-source frameworks and tools in their storefronts without having to invest in the technical resources required to support open-source at the platform level.
While SaaS platforms do charge a subscription fee, it often covers many things that you might otherwise pay when using an open-source platform. Subscription and licensing costs for SaaS ecommerce platforms can include:
- Access to prebuilt apps, extensions, and integrations
- Secure, reliable, and fast hosting
- Meeting PCI and other compliance standards
- Comprehensive support from the platform provider
If your business wants to use OSS to power your headless ecommerce storefront, a SaaS platform can free up in-house developers to focus on revenue-generating projects. Tech teams can stay leaner instead of dedicating resources to security updates, platform monitoring, compliance, and other tasks that just “keep the lights on.”
For examples and more details, you can read about five SaaS ecommerce platforms on the market today.
What are the benefits of building an open-source headless commerce storefront on a SaaS platform?
When you choose to build your open-source headless storefront with a SaaS platform like Shopify, you can get the best of both worlds. You can use open-source development tools and frameworks to flexibly and affordably deliver personalized buying experiences for all of your customer bases. Then you can sleep well at night knowing your site will be secure, fast, and available whenever your customers are ready to buy. A SaaS platform also offers a few other benefits for open-source headless ecommerce.
Faster development and innovation
The upkeep for an open-source platform requires a lot of very specific technical knowledge and troubleshooting. When your technical teams are responsible for everything from monitoring to integrations to development, you can slow the pace of innovation. Errors and security issues can happen at any time, making advance planning difficult. A single human error during an upgrade could take your site offline for days.
With a SaaS ecommerce platform provider, their own in-house teams are making sure the platform is fast, reliable, secure, and available. Your store will be on a platform that powers many other retailers as well, so compliance requirements for PCI, GDPR, and other commonly-encountered regulations will already be taken care of.
Large SaaS ecommerce platforms like Shopify have numerous locations and redundancies built in. You won’t have to worry about running to performance issues or being impacted by outages or downtime. Your team can deploy improvements to many parts of the buying experience much faster, boosting revenue and helping you stay ahead of your competitors.
A robust ecosystem of apps and solutions
With an open-source platform, you often have to integrate and configure every new upgrade, feature, or new capability you want to add. Or, you end up paying for preconfigured add-ons and extensions, which impacts cost efficiency.
SaaS platforms like Shopify provide access to a large catalog of preconfigured apps, integrations, and extensions, included in the subscription and licensing fees. Developers can quickly add and customize new features and functionality much faster, without having to spend a lot of time making sure everything is coded correctly.
Rapid scalability for growth
Retailers can get caught up short when business unexpectedly scales. Black Friday and Cyber Monday are a great example of this, where online stores can see many times their normal volume of orders in a short amount of time. When this happens, an open-source, self-hosted platform could get overwhelmed easily, leading to lost revenue and disappointed customers.
By hosting your store on a SaaS platform, you won’t get caught up short with a surprise surge in orders. Large platform providers like Shopify are built to scale, and can handle spikes in demand while remaining fast and available to customers.
What to look for in a SaaS platform that supports open-source headless commerce
Not all SaaS platforms are built the same, so you’ll have to look carefully at each one. Some large ecommerce platform providers like Shopify offer customers their own open-source solutions to power their headless ecommerce storefronts.
When you build a headless ecommerce site with Shopify, your developers get the freedom to choose the right tools for the job and extend capabilities with a flexible stack of technologies.
Shopify’s Storefront API
Our headless platform is powered by our storefront API. It provides access to all the commerce capabilities that are critical to delivering unique buyer experiences. The API provides a full range of commerce options, including viewing products, adding products to a cart, and checkout.
Hydrogen and Oxygen
Our official development stack consists of Hydrogen and Oxygen, which provides a clear path for building high performance, dynamic, and scalable headless commerce sites.
Hydrogen is our open-source headless commerce toolkit designed to accelerate Shopify development. It’s an opinionated, React-based framework for creating custom web storefronts. With Hydrogen, developers get a quick-start environment with commerce-specific components and developer tools. Hydrogen also uses advanced integrations to support numerous media types, which can then be added to immersive, dynamic shopping experiences.
While Hydrogen storefronts can be hosted on any third-party platform, Oxygen is the easiest way to do so. Hosting your storefront with Oxygen is free and guarantees uptime thanks to one of the highest-traffic GraphQL APIs on the planet.
How Denim Tears used Hydrogen and Oxygen to create a unique brand experience
When artist and designer Tremaine Emory wanted to deliver a singular experience for his apparel label Denim Tears, he hired agency Kamp Grizzly. When Kamp heard the vision, they knew a headless approach would be needed. They decided to take advantage of Shopify’s open-source Hydrogen as a framework and host the site using Oxygen.
Kamp built an immersive, interactive, and performant museum-like buying experience for Denim Tears. Rich media experiences, including 3D objects and playlists, transition between pages to connect the stories across the site. Their headless approach allowed them to make the front end easier to use, so they can rapidly deploy changes and updates. They were able to focus on building a truly unique buyer experience, instead of worrying about uptime, speed, or performance issues.
You can check out more brands building creative headless ecommerce storefronts with Hydrogen.
Shopify’s ongoing commitment to open source
Shopify itself was built on layers of open-source software and is still committed to contributing to numerous open-source projects. While Shopify is not an open-source ecommerce platform, we’ve invested heavily in a diverse portfolio of initiatives that support strong, healthy, and inclusive open source communities.
Additionally, some of our most popular products are open source. For example, Liquid is a templating language initially built by Shopify cofounder and CEO Tobias Lütke. Today, it’s available as an open source project on GitHub and is used in several enterprise-level builds on Shopify.
To learn more about how to build a best-in-class enterprise storefront with our unique ecommerce toolkits and languages, get in touch with our experts today.
Open Source Headless Commerce FAQ
What is the best open-source headless ecommerce platform?
There are several major open-source ecommerce platforms in the market today. You can check out our recent article to take a look at the six best open-source ecommerce platforms. They are all built with different OSS frameworks and code bases, so the best choice for you will depend a lot on your ecommerce goals, the size of your business, and your access to OSS technical expertise.
Is headless CMS good for ecommerce?
A headless CMS can be especially useful for developing and delivering omnichannel content and buying experiences. A headless CMS enables developers to iterate on upgrades faster, experiment with new technologies, and integrate more easily with the vendors and app providers they choose.
How do I create a headless ecommerce website?
To create a headless ecommerce website on Shopify, you start by taking advantage of our Storefront API. This allows developers to build custom front-end experiences using technologies like Shopify’s React-based framework Hydrogen. After you set up your Shopify store, you create a front-end application that uses Storefront API to fetch the data needed to populate the storefront. To synchronize data between the front end and the back end, you can use webhooks and GraphQL queries. Creating a headless storefront generally requires a high level of expertise, and you can learn more about it in this guide to headless ecommerce.
Can Shopify be used headless?
Yes, we have robust support and resources for headless ecommerce. Retailers can build powerful headless ecommerce websites with Hydrogen, our own React-based framework. You can then deploy and scale headless storefronts for free with Oxygen, our global hosting solution.
