Hydrogen / Oxygen
Definition
- Hydrogen: Shopify's frontend offering for headless commerce. It fetches data through the Storefront API, giving you full freedom in how the storefront is built.
- Oxygen: Shopify's official hosting platform (a global CDN) that serves Hydrogen storefronts from edge locations worldwide.
Background
It is Shopify's official approach to headless commerce — keeping everything within the Shopify stack rather than building on an external framework such as Next.js. The advantages are integrated authentication with the Storefront API, edge delivery on Oxygen, and unified operations.
Hydrogen's design philosophy has evolved. It started as a highly opinionated framework centered on React Server Components, later moved onto Remix, and absorbed Remix's merge into React Router v7. Today it is shifting from a monolithic framework to a framework-agnostic toolkit whose pieces — Storefront API integration, cart management, and more — can be adopted as needed. Understanding this history keeps version upgrades and technology choices on solid ground.
Flagship's Involvement
Our own corporate site (flagship.inc) is built on Hydrogen, and running it ourselves keeps our Hydrogen / Oxygen implementation and operations knowledge current. Because we handle Storefront API–driven data fetching, Oxygen deployments, and Hydrogen's design evolution in production, we can advise on each project whether Hydrogen (staying within the Shopify stack) or an external framework such as Next.js is the right choice — factoring in operating costs and team structure.