Shopify + Hydrogen + Oxygen
A custom React storefront backed by Shopify commerce, with server-rendered pages and a hosted checkout rather than a cart and order system you build yourself.
Sources verified Sep 2026
Circumstances — when to use it
- Developers publish the site's editorial pages and maintain the storefront in Git
- The site needs products, a cart, and checkout alongside its content
- A custom shopping experience is worth maintaining a frontend application
- A hosted commerce backend is acceptable; owning the entire backend is not a requirement
Synergy — how the pieces fit
Shopify owns the catalog and commerce operations. Hydrogen supplies Shopify-aware components and a Storefront API client inside a React Router app; route loaders render product data on the server and cart actions send buyers to Shopify's hosted checkout. Oxygen deploys the storefront with preview environments. Keep developer-written editorial pages in the app's repository, while merchants manage products in Shopify. Treat those as separate publishing workflows, and verify any required app integration before replacing a Shopify theme.
The tech and its role
Architectural examples
Each example links to a public source — no claims about private internals.
Patta x Tommy Hilfiger
Shopify's case study describes a campaign store built with Hydrogen and hosted on Oxygen. It documents the implementation at launch, not the current site's framework version or a Git-based editorial workflow.
sourceLady Gaga
Shopify's March 2025 account describes Commerce-UI moving the artist's store from Liquid to Hydrogen, with Sanity for editorial content. Hydrogen + Shopify example; not evidence of Oxygen hosting or content kept in Git.
source · 2025Skip if
Skip if you need to self-host the commerce backend, or a standard Shopify theme already meets the brief — a custom storefront adds development and integration work.