Shopify's own framework, with Shopify's own constraints
Technology
Hydrogen is Shopify's storefront framework, maintained by the company that also maintains the catalog, the orders, and the checkout it talks to. That is the appeal: there is no adapter of your own sitting between the catalog and the storefront, and nothing in that seam to keep current.
We run it on one store, the M8 shop, which is our own. That is enough to have an opinion about where it fits, and about the client work where a general purpose React framework was the better answer.
The grain
Working with Shopify's own storefront framework
- The catalog stays in Shopify, the layout does not
On the M8 shop we pair Hydrogen with Builder.io, whose Shopify plugin syncs product data between the two. Layouts and product displays get updated visually, without developer time. Products, prices, and orders stay in Shopify, which is the half you never want a second copy of.
- Choosing Hydrogen is choosing Remix underneath
Hydrogen is built on Remix, so a storefront on it inherits Remix's router, its loaders, and its conventions. For a team whose other work is Next.js, that is a second set of framework habits to keep current for one codebase. Worth knowing before the decision rather than after.
- Our client storefronts went a different way
Client work on Shopify Plus runs on Next.js for Birchbox and Svelte for Goodnature, both with Prismic holding the editorial side. Hydrogen would have meant a Shopify shaped storefront wrapped around content that is not Shopify's. The framework has to fit the whole site, not only the cart.
