The estimates, assumptions, pricing and timing of the features is built around current assumptions, availability and experience. This document was written in January 2020, and should be considered invalid/expired within 6 months of its writing.

Abstract

The purpose of this document is to give high level scoping for a Shopify Theme → Headless Website migration. There is a bit of education on what headless means, it's advantages, and further more some scoping constrains when speaking about existing Shopify Store migrations.

Table of Contents


What is a Headless Website?

A headless website simply means that the frontend ties together one or more API services to create the pages. Where as a typical Shopify website houses the content CMS (blog posts + pages), the OMS system information (inventory + product catalogs), as well as the actual file hosting (assets, data, HTML), a typical Headless experience uses multiple services to accomplish this.

Is this still Shopify?

This is still a Shopify website, and as such, you have access to the Shopify feature + plugin ecosystem. You can still use companion services like Klaviyo, Yotpo, and Rewards programs. One caveat to this, is that the entire frontend is not on Shopify. This means for any plugins that need access to the Shopify theme – e.g. install this promo bar in your theme editor - will not work in the same way. For plugins and functionality like this to work, it needs to be built into the Headless frontend, or utilize services that work on normal HTML websites.

Why choose Headless over using Shopify for everything?

This opens up all sorts of possibilities. Two of the most pivotal are static hosting, and utilizing a custom CMS. Static hosting uses a CDN (content delivery network) to host pre-built copies of your website as close to the end user as possible. Every time you make a change, the website is pre-built and ready to serve in the fastest possible format. Using a different CMS than what Shopify provides allows for extremely customized, and self-serve content management.


Components of a Headless Shopify Website

There are three larger components to any headless Shopify website:

1. Shopify as the OMS System