Shopify Hydrogen Framework vs Hydrogen Core: Picking a Headless Path on Next.js (2026)

Shopify's 2026 rebuild of Hydrogen did two things at once. It made Hydrogen run on any React stack, Next.js included, ending the years where choosing Hydrogen meant choosing Remix. And it split Hydrogen into two products that answer genuinely different questions: the Hydrogen Framework and Hydrogen Core. Choosing between them is the first real architecture decision on a new headless build, and getting it wrong is expensive in the way that scaffolding decisions always are, because you feel the mistake for the life of the project.

Dimension	Hydrogen Framework	Hydrogen Core
Shape	Opinionated framework	Component and utility library
Routing	Built in	Yours, or your framework's
Commerce hooks	Included and wired	Included, you wire them
Best when	Starting fresh	Integrating into existing React or Next.js
Cost	Accept Shopify's opinions	Rebuild the conveniences yourself
Escape hatch	Harder to diverge	Diverge freely

What each one actually is

The Hydrogen Framework is the opinionated path. It ships ready made routing, commerce hooks, and a project structure that assumes you are starting a storefront from scratch and are happy to build it the way Shopify thinks storefronts should be built. You trade flexibility for speed: a lot of the plumbing between the Storefront API and a working page is already done, and you move fast as long as you are moving in the direction the framework expects.

Hydrogen Core is the lower level path. It is a set of components and utilities, cart handling, Storefront API access, commerce primitives, that you drop into a React application you already have, including a Next.js app with its own routing, data fetching, and deployment already decided. Core does not impose a project structure. It gives you the commerce building blocks and gets out of the way, which is exactly what you want when you have existing infrastructure you are not going to throw away, and exactly the wrong tool when you wanted the framework to make those decisions for you.

How to actually choose

The decision is not about which is more powerful; it is about how much you have already committed. If you are starting fresh with no strong opinion on framework, the Hydrogen Framework is the faster route to a working storefront, because the conveniences it bundles are conveniences you would otherwise build. Take the opinions and ship.

If you already run a Next.js application, a marketing site, an existing frontend, a React codebase your team knows, Hydrogen Core is almost always the right call, because bolting the opinionated framework onto an app that already made these decisions means two routers, two ideas of data fetching, and a seam you maintain forever. Core lets the commerce layer live inside the architecture you already have. The tradeoff is real: Core leaves out the conveniences the Framework includes, so you will wire commerce hooks, set up cart state, and handle the Storefront API plumbing yourself. That is the cost of keeping your stack. We compared the broader Hydrogen against Next.js question, framework against framework, in Shopify Hydrogen versus Next.js for headless commerce, and the Core option is what makes that comparison less either or than it used to be: you can run Next.js and still use Shopify's commerce components.

The rebuild that made this possible is worth understanding on its own terms, because a framework agnostic Hydrogen changes the calculus for teams that avoided it precisely because it was tied to Remix. We covered the runtime rebuild in the framework agnostic Hydrogen runtime rebuild for headless Shopify Plus.

The v2026.4 browser proxy change hits both

There is a platform change that lands regardless of which path you pick, and it is worth building around from day one rather than retrofitting. As of the v2026.4.0 release, direct Storefront API calls from the browser are blocked by default. Every request now has to route through the Hydrogen app's proxy endpoint on the server rather than firing straight from client code. This is a sensible security posture, it keeps tokens off the client and gives you one place to enforce rate limits and caching, but it means any pattern that assumed browser side Storefront API calls needs to move server side.

If you are on the Hydrogen Framework, the proxy is largely handled for you within the framework's model. If you are on Hydrogen Core inside Next.js, you own the wiring, which means routing Storefront API access through a server route or server component rather than a client fetch, and confirming none of your commerce calls leak to the browser. Either way, design for server side data access from the start. There was also a related deadline that already passed: stores using Shopify Scripts for custom discounts, shipping rates, or payment logic had until June 30, 2026 to migrate off them, so if you are inheriting an older store, check that migration is done before you build on top of it.

Do not forget the API version cadence

Hydrogen tracks quarterly Storefront API and Customer Account API versions, and the releases bump them on a schedule; the January 2026 release moved both to the 2026-01 version, for example. On the Framework, staying current is mostly a matter of taking the release. On Core inside your own app, you own the upgrade, which means the quarterly cadence is a maintenance item you schedule rather than one the framework absorbs for you. Neither is wrong, but Core trades the framework's upgrade ergonomics for control, and that tradeoff should be a conscious one, not a surprise two quarters in.

FAQ

What is the difference between Hydrogen Framework and Hydrogen Core? The Framework is opinionated, with built in routing and commerce hooks for starting fresh. Core is a lower level component and utility set you drop into an existing React or Next.js app, giving you commerce primitives without imposing a project structure.

Can I use Hydrogen with Next.js in 2026? Yes. The 2026 Hydrogen rebuild runs on any React stack including Next.js. Hydrogen Core is the piece designed to integrate into an existing Next.js app.

Which should I pick for a new store? The Hydrogen Framework, if you have no strong framework preference, because it bundles conveniences you would otherwise build. Choose Core when you already have a React or Next.js codebase you intend to keep.

What changed with browser Storefront API calls? As of v2026.4.0, direct Storefront API calls from the browser are blocked by default and must route through the Hydrogen app's server proxy. Design for server side data access from the start on both paths.

When this applies to your stack

The Framework versus Core decision comes down to one honest question: are you starting fresh, or are you integrating commerce into infrastructure you already own and trust. Get that answer right and the rest of the build follows; get it wrong and you spend the project fighting a framework you did not want or rebuilding conveniences you should have kept. If you are planning a headless Shopify Plus build on Next.js and want to pressure test the architecture before you commit, that platform and migration work is exactly what we do at Contra Collective.