Headless eCommerce solutions - The complete guide

The world of eCommerce is changing. You might even say that it has lost its head.

With consumers getting used to consuming content and making purchases through various touch points — from IoT devices to progressive web apps — legacy eCommerce platforms are struggling to keep up with the demands of the customer.

Amazon Dash buttons, smart voice assistants and in-store interfaces are giving consumers new ways to explore product information, read reviews and place orders. In other words, consumers are embracing the IoT era, even if most retailers haven’t (yet).

eCommerce brands moving with this trend are reaping the rewards (hi there, Amazon), while others are scratching their heads, wondering how they can get in on the action without having to invent their own IoT device or build back-end solutions from scratch. The answer is headless content management — and by extension, headless eCommerce.

On this page:

    What is headless eCommerce CMS?

    In a nutshell, headless commerce is an eCommerce solution that stores, manages, and delivers content without a front-end delivery layer. With a headless eCommerce cms platform, the front end (or the “head”) — which in most cases is a template or theme — has been decoupled and removed, leaving only the backend.

    Developers can then use APIs to deliver things like products, blog posts or customer reviews to any screen or device, while front-end developers can get to work on how to present that content using any framework they desire. 

    Basically, all functional elements (such as forms, blog, banners, products, etc.) of the system can be programmatically managed. This includes the creation and management of the content components.

    In other words, headless commerce architecture is built for the IoT age.

    In contrast, traditional eCommerce platforms have their head screwed on tight. That means they have a predefined front-end that is tightly coupled with the back-end, so even if there are plenty of customization features and unrestricted access to code, the platform is only designed to deliver content in the form of websites and maybe native mobile apps.

    A headless cms architecture delivers a platform via a RESTful API that comprises of a back-end data model and a cloud-based infrastructure. Since the platform is not tightly coupled with the back-end, eCommerce brands can deliver things like content, products and payment gateways to smartwatches, kiosk screens, Alexa Skills, and everything in between.

    How headless eCommerce cms works

    Just as with a headless CMS, a headless eCommerce system works by passing requests between the presentation and application layers through web services or application programming interface (API) calls.

    For instance, when the user clicks a “Buy Now” button on their smartphone, the presentation layer of the headless eCommerce system sends an API call to the application layer to process the order. The application layer sends another API call to the application layer to show the customer the status of their order.

    Headless eCommerce vs traditional eCommerce

    If you’re still scratching your head *ahem*, here’s a comparison between headless commerce and traditional commerce. I’d say there are three key differences.

    Headless Commerce Graph case illustration

    1. Flexible front-end development

    Traditional commerce

    Front-end developers working on a traditional commerce system encounter a number of constraints when it comes to design and the overall process. Any changes made would require a great deal of time to edit the database, the code, and the front-end platform as well. Developers are also limited to what can be updated and/or edited without the risk of voiding a warranty or preventing any future upgrades.

    Headless commerce

    With the removal of the predefined front-end platform, headless eCommerce cms enables front-end developers to create a user experience from scratch which fits nicely with their core business needs. Front-end developers don’t need to worry about modifying databases in the backend as all they have to do is make a simple API call. In other words, front-end developers are set free from the shackles usually associated with a traditional commerce platform.

    The only drawback is that, with no front-end presentation layer at all, front-end developers are marketers are left to build everything from scratch, from product pages to landing pages. And getting eCommerce web design right is no mean feat.

    That’s why a decoupled solution is superior to a headless solution, but more on that later.

    2. Customization and personalization

    Traditional commerce

    Traditional platforms are equipped with a predefined experience for both your customer and for the administrative user. But these platforms provide little room for customization or personalization. If you are happy with the experience provided by these traditional platforms, then more power to you.

    Headless commerce

    Traditional commerce platforms constrain developers and users to what they define as the correct user experience. With headless platforms, since there is no front-end, developers can create their own user experience from scratch. You have more control over the look and feel of your commerce platform and you also have control over the user experience for both your customer and your admin users.

    3. Flexibility and adaptability

    Traditional commerce

    In traditional solutions, the front-end is tightly coupled with the back-end coding and infrastructure. This leaves little or no room for flexibility to make any desired customizations. To make a single customization, developers need to edit multiple layers of coding between the front-end right through to the database layer that is buried in the back-end.

    Headless commerce

    Since headless commerce has already decoupled the front-end and the back-end, this creates endless possibilities for customization as and when required. To make any changes, you simply need to have a front-end developer. You can make changes either big or small, from implementing a custom checkout flow to adding a new field to customer account — both are very straightforward to execute with a headless commerce architecture.

    Headless commerce: The key benefits

    Amazon is at the forefront in showing us the true value of incorporating a headless ecommerce platform and how it can help retailers avoid experiencing the hair-pulling frustration associated with a traditional commerce platform. A study by Salmon reported that 60 percent of consumers want an Amazon Prime-like service — but you can’t achieve that with a traditional eCommerce solution.

    It is imperative for brands to make the switch to headless commerce and here are 6 reasons why:

    1. Offer omnichannel experiences without pain

    First things first, a headless content management system will help propel your content anywhere and everywhere. For an eCommerce brand, that means delivering your products, product videos or blog posts to any channel that has emerged — or will emerge.

    So, get ready to sell through Alexa Skills, digital signage, progressive web apps, and even through refrigerators with screens (yes, they exist).

    The best news is that with a natively headless commerce platform — like Core dna — you don’t have to re-architect your platform to publish across channels. It’s all just part of the same, future-proof package.

    Traditional vs Headless cms by point: front end , component and flexibility

    2. To remain competitive

    A headless commerce platform enables you to deploy rapid updates without impacting your back-end system. And you can easily make any changes to your front-end to coincide with the speed of consumer technology.

    Major commerce brands using a traditional platform usually roll out an update every few weeks. In comparison to the likes of Amazon; they deploy updates on average of every 11.7 seconds — reducing both the number and duration length of outages.

    When a front-end system is not tightly coupled to the back-end, you don’t have to roll out an update to the entire system, only part of the system. So you can deliver what your consumers want more quickly and still remain competitive

    3. For agile marketing

    A headless commerce system can support new technology as and when they arise. This is perfect for when designing new customer experiences. This puts marketing teams back into the driving seat where they can roll out multiple sites across different brands, divisions and portfolios.

    Finally, thanks to the flexibility provided by a headless eCommerce system, marketing teams can set up a new site in days instead of months — much like our client Tivoli Audio, a global brand that reduced the time it takes to launch a campaign from a few weeks to a few days.

    4. To make the customer experience more personal and consistent

    Even though customer needs change over time, they should still receive a consistent customer experience across all devices and channels.

    In addition, people want to buy from eCommerce brands that understand their needs across all channels. This goes beyond the usual “people who bought X also purchased Y”. The back-end already knows what a consumer has bought. It uses this data to power the personalization engines on CMS, mobile apps and social channels.

    5. For seamless integrations

    By definition, a headless commerce solution must have an API (such as GraphQL), which makes it easier to integrate and communicate with other platforms. You can add your brand to any new device, expanding your opportunities and outreach to more customers at the same time. Also, it won’t take you months to integrate your commerce platform to a new device, just hours.

    Core dna customer Stanley PMI experienced this first hand, using our headless commerce platform to integrate with Oracle and Slack, an integration which helped streamline their customer service workflows. Without delving too deep into this particular integration, Stanley leveraged Core dna to we integrate with OSCV. Here, they collect customer support requests, warranty claims and other questions while simultaneously executing a customer lookup to ensure it isn’t a duplicate request. It if is, the system appends the request, otherwise, it creates a new customer record. This is all done with the Hooks Engine.

    For Slack, the Stanley support team uses the Core dna hooks engine once again to monitor all new transactions. They’re on the lookout for orders that are over a certain limit, or from a certain location, or order which contain certain products. The Core dna hooks engine automatically checks the contents of each purchase and if it meets a certain criterion, it’s shared on the relevant Slack channel.

    6. For even better conversion optimization

    With a headless commerce in place, you can try and test different templates and approaches. For example, you could experiment with a different back-end search solution whilst running the same front-end search.

    As a result, a headless commerce allows you to run continuous tests and optimization cycles which will help you get a better understanding of your customer, whilst improving your rate of learning faster than most retailers.

    7. Faster time to market

    If you do manage to build a multi-channel or omnichannel retail experience with a traditional eCommerce platform, your time to market will be painfully slow, and scaling will be arduous. 

    A headless commerce platform, on the other hand, enables brands to focus on building front-end experiences on different devices and touchpoints, as the content and products are housed centrally and delivered via API to anywhere. This facilitates faster time to market when adopting new channels, entering new regions, and so forth.

    The two biggest drawbacks of headless commerce

    Headless commerce platforms have two key issues that need addressing. 

    1. Ongoing costs

    Since headless eCommerce platforms do not provide you with a front end, developers have to build their own. One on hand, this is great, as it enables developers to build front ends that are bespoke for each device and touchpoint. On the other hand, building templates and user interfaces from scratch can become time-consuming and costly. Plus, developers will need to troubleshoot their own front-end creations, leading to ongoing costs beyond the initial build.

    The costs rise even more when you factor in the fact that the marketing team is now isolated, and now has to depend heavily on the IT team to launch landing pages and content on different devices. Speaking of which...

    2. Marketer isolation 

    Because a pure headless commerce system offers no front-end presentation layer, marketers can no longer:

    • Create content in a WYSIWYG environment
    • Preview content to see what it will look like on the end user’s device or screen
    • Quickly ideate, approve, create, and publish content without relying on another department

    Instead, marketers are totally reliant on the IT team not just to build the front-end presentation layer, but also to update it and populate it with content. Hardly a marketer-friendly environment. 

    How headless commerce supports omnichannel retail

    The idea of “omnichannel retail” means that a shopper can use the same online platforms to shop both online and offline, on any device, at any time. Since the primary objective of headless commerce platforms is to offer a seamless user experience across channels, these platforms are an essential component of the omnichannel retail mission.

    A 2017 study by Harvard Business Review showed that, out of more than 46,000 shoppers surveyed, those who used multiple channels purchased more online than those who only used a single channel. Also, those shoppers who used multiple online channels purchased more at the brick-and-mortar stores than those who used only a single channel. 

    Furniture store Made.com has incorporated omnichannel marketing strategies into their high-end London showroom. Customers can use tablets to scan item tags to create a shopping list, then email the shopping list to themselves. Made.com can take the items from the customer’s list and send them personalized recommendations based on their preferences.

    3 headless platforms for commerce

    Headless commerce is an emerging space, but there is a range of eCommerce platforms offering APIs that facilitate a headless or decoupled approach to eCommerce. Here are three names to consider in the space:

    1. Magento 2

    Magento 2 users can leverage Magento APIs, but will need to rely on a third-party web content management system to handle large quantities of content at scale. 

    2. Shopify Plus

    Similarly, Shopify Plus users have access to APIs which can expose product information to third-party systems. However, a CMS will be needed to handle additional content at scale.

    3. Core dna

    As a digital experience platform (DXP) with eCommerce functionality, web content management functionality, and APIs, Core dna is an all-in-one headless eCommerce solution that can power omnichannel eCommerce experiences. Clients such as audio technology brand Tivoli Audio, office supply retailer Staples, and Swiss luxury appliance manufacturer V-Zug have used Core dna to power their eCommerce sites

    The future of commerce is decoupled

    While a headless commerce solution solves many problems (hello there, constantly evolving landscape of IoT devices), it also creates problems, as discussed above.  If you’ve read our headless CMS article, you’ll know why the future is decoupled, not just headless. 

    A decoupled commerce system is similar to a headless system in the sense that both front-end and back-end are decoupled. However, unlike a headless CMS, a decoupled CMS doesn’t remove the front-end delivery layer from the equation entirely. This architecture gives marketers back their power in the form of content authoring and content previewing, while also giving the brand the same headless freedom needed to deliver content to different devices, applications, and touchpoints through APIs. 

    You could say a decoupled CMS gives you the best of both worlds—and that’s why we say the future of eCommerce is decoupled.

    So you could say eCommerce has lost its head. But for those who are not tech-savvy, a decoupled commerce system provides the ease-of-use similar to traditional commerce system but with the flexibility of a headless system. It’s the best of both worlds.

    In 2022 this is where Core dna is at with Headless Commerce

    Core dna's Headless eCommerce solution

    What makes Core dna different from competitors? Headless commerce platforms are popping up left and right - and for a good reason. But what’s the difference between a not-so-good, good, or great headless CMS platform? 

    Here’s what makes Core dna unique from the rest. 

    The Platform

    Core dna combines CMS + eCommerce in one simple, easy-to-use system. Our platform includes a full-blown CMS platform allowing users to manage content without knowing or understanding coding language. Why is this important? Core dna creates content and commerce pages that are engaging and boast high conversion rates for the people who are not tech-savvy. In addition, at the point of purchase, we provide the visitor more answers to inquiries.

    Core dna also includes a Headless CMS that enables us to share content with the commerce platform and other areas of engagement like blogs, news, FAQs, and across various channels. This helps us offer enriching and engaging product information and content. 

    Templating

    We offer developers two options for templating. This comes in handy when you want to share information and don't want to create an external application to render the content. Most headless platforms generate information in JSON Forms and rely on the front-end stack to provide the user experience. This approach often takes more time, money, and energy. Core dna can speed up the process of creating applications or connections to applications. 

    Admin System

    We’ve added a unique admin system to help make the most out of your user’s online stores. Any commerce platform user will understand the dire need for marketing, managing, and administrative tasks. At Core dna, we’ve added an admin system to the platform to improve marketing with tools like Marketing Campaign Trackers, Tools to Drive Engagement, SEO, A/B Testing, and Email Integration, among others. In addition, the Core dna platform provides a native administration system for content managers and eCommerce managers to use right out of the box. No add-ons, plug-ins, or upgrades are needed. 

    Hooks Engine

    Unique to Core dna, Hooks Engine is a decoupled queuing system that can communicate with 3rd party systems. Hooks Engine gives developers a sophisticated workflow engine that enables them to connect to external systems and have the external systems connect to the platform. Even legacy platforms were able to use the Hooks Engine to provide compatibility file transfer and email. 

    Here are a few examples of how the Hooks Engine can enhance your daily operations. 

    • Workflows can be created with conditional logic with multiple steps. Also, the engine boasts the ability to call external APIs to capture and distribute information.
    • A built-in schedule allows you to call many ‘Hooks’ at predefined times.
    • The scheduler is a powerful way for Core dna to integrate content to and from other systems flawlessly. 

    Developers

    Core dna is designed to help give developers multiple ways to extract the most value from the platform. Developers can use their regular IDE. There’s no need to deter from your favorite IDE to use Core dna. 

    Sam Saltis
    Sam Saltis

    An entrepreneur at heart with over 20+ years of experience in building internet software, growing online companies and managing product development.

    Loves all things SaaS, technology, and startups.

    You can find him feeding his beloved fish when he's back in Australia.

    Previous PostHeadless CMS vs Static Site Generator
    Back
    Next PostHeadless CMS Use Cases