• Blog >
  • The ultimate guide to headless

In a nutshell, Headless software refers to a set up where the back-end system can be separated from the front-end appearance of an application or website. There’s also such a thing as ‘de-coupled’ but we’ll come onto that later.

 


Front End: Where you control how your website looks and the content is displayed

Back End: Where you manage the systems that allow your website to run, from ERPs to merchandising


 

A Headless approach allows organisations to use the software of their choice to create the look and feel of the platform, while choosing a different system for data management or to integrate with 3rd parties.

Making the front and back end headless allows your organisation to add bespoke functionalities like shipping logistics, Product Information Management (PIM), and Enterprise Resource Management (ERP) to the chosen front-end. You could also extend and enhance the front end with custom apps. In a Headless scenario, you would use APIs to deliver content exactly where it’s needed on the front end of the website. Using a Software as a Service (SaaS) also makes it even simpler to swap between your systems of choice.



Headless vs All-in-one approach

If you haven’t adopted a Headless approach, you’re most likely using a monolithic system right now. This simply means that your front and back end both rely on the same software. This is a great approach for businesses that require little customisation, as it’s much more straightforward. Having all of the tools required to publish content already set up and integrated saves time and money in the short term.

Comparatively, a Headless architecture allows brands with a high-volume of content, services, or products to operate with the best-of-breed solutions. Headless systems offer flexibility at scale and encourage a content-first approach.

Headless architectures are usually created on an SaaS, which helps businesses to adopt new systems without having to completely throw out and re-start their existing ways of doing business. Using your choice of systems allows for far more flexibility in content management and delivery for User Experience and Search Engine Optimisation. This creates a huge competitive edge for many businesses.

For example, Headless architectures allow flexibility if you’re using a story-telling tool with limited SEO features and a new one comes out on the market. With Headless software via an SaaS, you could swap over to the new software quickly, without disrupting other business operations. A traditional monolithic system would make it much more difficult to upgrade to a new platform. In fact, it would likely be difficult to integrate the platform in the first place, without integrating co-existing systems.

Both Headless and Monolithic approaches have different benefits for content managers and developers. Therefore, you must assess the needs of each of team before making a choice. Implementing a Headless structure can affect everything from data security to the ability to preview images, so it’s vital to consult an expert on the topic.

 

tick Major benefits of Headless:

1. Reduced vendor lock-in

A Headless set-up enables organisations to manage front and back-end systems independently of each other. As such, businesses can adopt newly evolving products, or update to an enterprise system, without disrupting their existing systems.

2. Increased experimentation

As Headless software makes operational and visual systems less codependent, organisations can run tests more freely. Testers can experiment on areas of the back end, like search tagging, without disrupting the front-end shopping experience.

3. No compromises

In our experience, when evaluating software, companies often become stuck choosing between a flexible intuitive front-end or feature-rich back end. Headless allows you to choose a separate platform for each area, so your teams aren’t required to compromise on the strengths and weaknesses of a single, combined system.

4. Serve multiple customer journeys from a single source

Headless provides the interchangeability required to serve multiple public-facing channels from a single back end. In simple terms: companies can use one back-end database to push information to their website, app, chatbot, and in-store displays, despite each display having different requirements.

For example, if you were using Drupal as the back end, you could use the framework React with Drupal for web, then use a different framework such as Vue and Drupal for mobile.

The time-saving implication for organisations is huge, as decoupled systems would allow a single field change to be applied across all devices. If you wanted to add an extra colour option to a product, it would only need to be updated in one place; this change would then be applied to every single application the product features in.

5. Faster time to market

Headless improves development agility and, as a direct result, enables new products to reach the market faster. This is possible through designing a component framework with reusable elements to maximise efficiency. Time to market is also reduced by choosing from a growing selection of client-side open source technologies, produced by big companies like Facebook and Google.

6. Faster Prototyping

As the front end is its own application in a Headless system, this allows for content mockups and staging. Staging content independently of the back-end system, aids faster prototyping of concepts with the API backfilling content later. Basically: using separate systems concurrently reduces bottlenecks.

 

lock  Disadvantages to Headless

The above list may appear very enticing, but Headless isn’t for everyone...

1. Cost

When enabling Headless, organisations usually subscribe to separate systems for the back and front-end. This isn’t as much of an issue when using Open Source software, as there are no licence fees. Whereas if you choose to combine multiple licensed software providers, costs can quickly escalate as no platforms provide a ‘one-end-only’ package yet.

2. Maintenance

Similar to the above issue, using multiple systems requires maintenance of multiple code bases. As the systems are ostensibly separate, there is less impact on the code running alongside. Yet. each system still requires constant version updates and code reviews, which can be taxing.

 

Which systems can go Headless?

Not all software can be made Headless. Here are a few of the most popular options and what Headless means to them:

Drupal

Umbraco

BigCommerce

Magento

 

Drupal Headless & Drupal Decoupled

drupal-icon-banner

With a Headless Drupal 8 set-up, the front end is usually a different system from the Drupal back end. Drupal uses APIs (Application Programming Interfaces) to work with the speedy front-end framework of choice. A popular choice in recent years includes React.js, which can deliver a fast, responsive front-end system.

Separating the Drupal back end allows organisations to adopt the latest content management systems. Each organisation can focus on a system that delivers specific features brilliantly well, be that interactive video or 21st-century storytelling tools.

Decoupled Drupal follows a similar technique but involves using a separate Drupal front-end and Drupal back-end. This arrangement can provide a happy middle ground: giving site managers a consistent UI, whilst maintaining the flexibility to change operational and visual tools independently of each other.

Useful links:

 

Umbraco Headless

umbraco-logo-white-background

Umbraco Headless is designed for omni-channel streamlining. It focuses on centralising content editing for a host of devices, such as in-store displays, smart watches, and webpages. By isolating content management, editors have a clean, friendly interface, with all the tools they need. Content Editors are spared from any back-end complications that experienced developers will be dealing with separately.

Umbraco Headless is a great solution for front-end specific multi-channel journeys. However, this system can’t yet replace full websites; to replace your website entirely, Umbraco Cloud is the best solution.

Useful Links:

 

BigCommerce Headless

BigCommerce_logo_dark

BigCommerce Headless is an open Saas (Software as a Service) platform. As such, it uses on-premise hosting to push updates to users. This means that there are never any requirements to upgrade to new versions of the software and no ongoing performance tuning.

The software comes with a wide number of headless APIs which enable developers to build custom CMS integrations. These APIs also allow for organisations to control their front end with any CMS, whilst relying on BigCommerce in the back-end.

BigCommerce lets merchants build complex catalogues, manage large order volume, and handle up to 600 SKUs per product. The Headless approach means the number of SKUs has no impact on the performance of the storefront, as complex back-end PIM systems aren’t slowing down the CMS.

As a ‘Commerce as a Service’ solution, BigCommerce also allows you to bundle the best features from multiple software.

Useful links:

 

Headless Commerce VS Decoupled Commerce

BigCommerce also enables Decoupled Commerce which isn't the same thing as Headless Commerce. Here’s our quick breakdown of the differences:

Headless Commerce Decoupled Commerce

What it does:

Separates the website’s ecosystem into one back-end system and a different front-end framework.

What it does:

Categorises giant product lines or brands by separating them into different categories that may live in different systems.

Benefits:

No Compromises. An organisation can benefit from powerful logistics and commerce system in the back-end.

The same organisation can then also have a beautifully designed and functional front-end powered by a content-focused CMS.

Benefits:

Ideal when the product catalogue is so big you can’t deliver it all in a monolithic system. Organisations break up the product categories, not necessarily the front and back-ends.

Or for when enterprise businesses have sections of a site needing a micro-service delivered via API.

 

 

Magento Headless

Magento_Partner_Logo

Magento is newer to Headless than some other major software providers. But it does support the ability to deliver content to your choice of front-end CMS, while utilising the best of Magento 2’s back-end.

This provides retailers with a huge advantage. Commerce sites can utilise content heavy tools while efficiently managing products and logistics in the back end. This is ideal for complex products that require additional information and documentation on the web-page or for visually rich story-telling.

 

 

If you’re an ambitious business looking to grow at speed while retaining the ability to react quickly to changing markets, Headless could be your ideal solution. Our experts will review your business goals, the surrounding market and help you make the best possible decision. 

Get in Touch

 

● ● ●