What is Shopify Hydrogen & Oxygen?

Ecommerce is continually evolving, the way stores are built and managed is changing all of the time. In June 2021, Shopify announced an overview of Hydrogen and Oxygen at their annual developer conference called Unite in response to the growing trend of headless ecommerce. Headless ecommerce involves building the front end and the back end of a store separately leading to some great benefits such as improved speed, limitless functionality and ultimate control over the code. Hydrogen and Oxygen provide merchants with a toolkit to build headless ecommerce stores with a backend powered by Shopify Plus.

See our headless ecommerce services.

Introduction to Shopify Hydrogen & Oxygen

Suggested to be the future of ecommerce on Shopify by industry leaders, Shopify Hydrogen & Oxygen was released to support a native headless ecommerce approach by Shopify. Shopify Hydrogen and Oxygen is the ultimate developer toolkit to allow merchants to launch headless ecommerce stores or arguably ultimate developmental control within one platform. Think performance, flexibility, and complex data management - Shopify Hydrogen & Oxygen might just be the future of ecommerce.

What is Shopify Hydrogen?

Shopify Hydrogen is an opinionated React framework that allows developers to build unique and entirely custom front-end experiences that access the backend of Shopify plus for data such as customers, products, and more. At current, developers can build bespoke Shopify themes using the templating language called Liquid however this does come with some limitations of the platform. Shopify Hydrogen offers the ultimate developer tools pre-built components to allow developers to build headless stores and access utilities that natively integrate with Shopify as the backend platform.

By using React or Shopify's opinionated version, merchants can achieve lightning-fast frontend experiences for merchants. The library of pre-built Hydrogen components to craft a page includes a shopping cart, variant picker, and content galleries which can present huge complexity when building from the ground up. Shopify Hydrogen allows developers to focus on building technologies, styling outstanding UX, and fast store experiences with support around traditionally difficult headless functionality whilst leveraging Shopify storefront API to access product data and more. Hydrogen will give the building blocks of the future Shopify architecture and ecommerce sites. The way merchants & agency clients make updates to their stores is different and the navigation of these changes should be taken carefully.

What is Shopify Oxygen?

Shopify Oxygen is a hosting provider that can host custom content such as Hydrogen storefronts directly within the platform. Merchants wanting a headless ecommerce setup rely on third-party hosting providers such as Netflify. Oxygen will be supported by Shopify's growing global infrastructure which will include over 100 server locations worldwide. Headless ecommerce with Hydrogen and Oxygen will streamless headless ecommerce stores. Shopify Oxygen will manage the server components and complexity needed for Hydrogen. Will this be the future of ecommerce with Shopify?

When is Shopify Hydrogen available?

Shopify Hydrogen is currently in developer beta with documentation and is due for full release later this year (2022). Check back and we'll update this page once Shopify's Hydrogen is out of developer preview. This will be the ultimate place and source for details on its full release with full react server components or hydrogen components. We've already built our own Hydrogen demo store. Join our newsletter by providing your email address below for updates right to your email inbox. We recommend following Shopify's team on Twitter, Youtube, and website pages for regular updates on the Hydrogen journey and feedback. Hydrogen will be available to businesses this year. (2022)

What is Shopify Oxygen Available?

Shopify Oxygen is due for release later this year (2022) with rollout ability to the public. The window for beta access has not been publicly shared by Shopify or other data sources.

How much does Shopify Hydogen & Oxygen cost?

Hydrogen does not have any associated action costs as it's a publically available javascript (React by Facebook) framework. Note you may require additional tools and providers that link or connect with APIs to deliver the ultimate shopping experience. The cost of Shopify Oxygen has not yet been released.

Summary for Shopify Hydrogen & Oxygen

Headless ecommerce presents many complexities and requires significant investment, and highly skilled developers to build in javascript frameworks such as React, Hydrogen will aim to simplify this. Oxygen will support headless merchants with native hosting beyond the standard hosting of liquid files included with Shopify. Shopify's current monolithic solution offers a vast array of integrations, built-in features and allows merchants to launch in record-breaking times. Hydrogen & Oxygen will allow merchants looking for more complex solutions the ultimate support and infrastructure to do so whilst supporting the existing storefront API. Complexities include server-side rendering, caching, hooks, limitless control over templates and modules, tailwind CSS, advanced development environments, IOS and Android apps used to deliver an ultimate cross-channel shopping experience. We love the Hydrogen logo too! Are the development process, shape, and development environment for ecommerce, development teams, and Shopify about to change? We are excited to be part of and observe the future of millions of ecommerce stories leveraging the hydrogen framework.

If you are looking for a headless ecommerce store with Hydrogen and Oxygen, learn more about our headless services here.

Looking for a Headless Shopify Plus Ecommerce Agency?

We Design & Build Headless Shopify Ecommerce Websites

We are an experienced ecommerce agency partnering with ambitious brands to design, develop & optimise outstanding Shopify & Shopify Plus websites. Our websites are solutions for your ecommerce growth. We help brands decide on the best approach, design and technology. Get in touch today!

Lightning fast

Unlimited complexity

Outstanding content management

Migration from other platforms

Conversion & Sales Focused Strategy

Expert Long Term Partner

Learn more about headless

Looking for a Shopify Plus Agency?

Upgrade or migrate to Shopify Plus with Charle, a leading Shopify Plus agency.

Upgrade to Shopify Plus with Charle

Let’s talk ecommerce, Shopify & Shopify Plus solutions.

We are an accredited expert Shopify agency we partner with brands to design, develop, launch, support and grow Shopify & Shopify Plus stores. We are a Shopify agency, ready when you are. Talk to our team about your project.

Get In Touch