No results found
Try adjusting your search terms
Hydrogen is Shopify's React framework for custom storefronts, and Oxygen is Shopify's own hosting for them. A Shopify Hydrogen developer builds the front end against the Storefront API, while products, orders and checkout stay in Shopify.
Most stores don't need it. A well-built theme is fast, cheaper to run and editable by your marketing team without a developer. Hydrogen earns its cost when you need something a theme can't do and have the budget to maintain a codebase afterwards.
This page covers Hydrogen specifically. If you're comparing other frameworks, the broader headless development service fits better, and if the real goal is a better storefront on a theme, look at custom theme development. Compare the agencies and developers below, and ask every one of them for live Hydrogen storefronts.
Hydrogen is a small specialism inside a big label. In September 2026, 391 profiles on shopexperts listed Hydrogen and headless work, and a headless listing doesn't show whether a team has shipped a Hydrogen storefront.
Ask for live Hydrogen storefronts. Not headless builds on other frameworks, and not design files. Two or three live stores on Hydrogen, who maintains each one now, and permission to speak to one of those merchants.
Test React depth as well as Shopify depth. Hydrogen is React engineering with Shopify data. Ask how they handle caching, server rendering and data loading on a collection with thousands of products. A strong theme developer without production React experience will learn on your budget.
Get the app audit before the quote. Every app on your theme that injects code, from reviews and loyalty to subscriptions and search, needs an API-based alternative or a custom build. A credible quote lists each app and what replaces it.
Ask who edits content after launch. Your team loses the theme editor. Ask where merchandisers will change banners, landing pages and navigation: Shopify metaobjects, a headless CMS, or developer tickets. If the answer is tickets, cost that in.
Agree the running costs before the build. Get a monthly figure for framework upgrades, monitoring and small changes into the proposal. A Hydrogen storefront with no maintenance plan falls behind quickly.
Red flags. No line for redirects and SEO migration, no analytics or consent plan, promises of specific speed scores, or a pitch to go headless because the current theme is slow. A slow theme is usually a speed optimisation job.
Four questions settle most cases. If none gets a firm yes, stay on a theme.
Is the experience something a theme fights? Editorial storytelling woven through shopping, product configurators, heavy personalisation. Themes handle more of this than people assume; Hydrogen makes sense when the theme is being bent out of shape to do it.
Do you run several storefronts from one catalogue? Separate brand sites or very different market experiences can share one React codebase and one set of Shopify data.
Do you have React engineers in-house, or budget for a retained team? Hydrogen is a codebase, not a theme. Without someone who owns it, every small change becomes an agency ticket.
Is there a performance need a well-built theme can't meet? Prove it with field data for Core Web Vitals (LCP, INP and CLS) from your current store before assuming a rebuild fixes it.
The hidden costs sit outside the build quote. Beyond the app replacements, analytics and consent have to be wired in, and the SEO basics a theme handles for you — meta tags, structured data, sitemaps, redirects — become code someone maintains. Hydrogen and the Storefront API also move on a regular release cycle, so upgrades are a recurring cost, not a one-off.
Checkout stays on Shopify either way. Going headless changes nothing about what you can customise there, and the same plan rules apply.
Hydrogen is priced like a software project, because it is one. Typical ranges:
Hydrogen storefront
Design, build, CMS, launch
Developer rate
Per hour, React and Storefront API
Ongoing
Per month: framework upgrades, CMS, fixes
The build range is wide because scope is. A single-market store with a handful of templates sits toward the lower end; several storefronts, a headless CMS, custom search and personalisation push toward the top. Each theme app that needs an API-based replacement adds its own line.
The monthly line is the one to agree before you sign. Framework upgrades, dependency updates, CMS costs and the small changes a theme editor would have handled all land there. A theme store can often run on a light maintenance retainer; a Hydrogen store needs engineering time every month.
Quotes start from the list of apps your current theme depends on, so send that first.
A Hydrogen engagement usually covers several of these.
React storefronts on Shopify data, designed, built and launched
Products, collections, cart and customer data in custom front ends
Hosting, preview environments and deploys from your repository
API-based alternatives to theme apps for reviews, search and loyalty
Metaobjects or a headless CMS for the pages your team edits
Framework updates, monitoring and ongoing fixes
Hydrogen is the code: a React framework with Shopify-specific components for products, carts, SEO and analytics. Shopify Oxygen is where that code runs, Shopify's own global hosting for Hydrogen storefronts, with deployments from your Git repository and a preview for each change. Hydrogen can be deployed to other hosts, but Oxygen keeps hosting inside your Shopify setup and removes one vendor from the stack.
For a full storefront build, usually an agency. The work spans design, React engineering, content modelling, QA and project management, and an agency covers all of it without you coordinating five people. A senior freelance React developer suits extending or maintaining an existing Hydrogen store, or a small build where design is already in-house. Either way, the proposal should name who writes the code.
Yes. The Storefront API is the GraphQL API behind any custom Shopify front end, so it also powers storefronts on other frameworks, mobile apps, in-store screens and product configurators embedded in an existing site. Hydrogen is Shopify's own framework on top of it, with ready-made pieces for cart, product pages and SEO. If you're set on another framework, the broader headless development listing is the better fit.
Not by default. Hydrogen renders on the server and can be very fast, which helps. But canonical tags, structured data, sitemaps and redirects that a theme handles out of the box become part of your codebase, and each one needs to be in scope. Moving from a theme usually changes some URLs too, so a full redirect map is non-negotiable. Plan it like any replatform, with rankings checked before and after launch.
Yes, and some brands do. Products, customers and orders never left Shopify, so moving back is a front-end rebuild: a new or existing theme, reinstalling the apps that inject into it, redirecting any URLs that change, and moving content out of a separate CMS. It is usually a smaller project than the Hydrogen build was. Weigh it against the monthly cost of keeping the codebase current.
'%20style='mix-blend-mode:plus-lighter'%3e%3cpath%20d='M293.421%2055.9546H463.536L701.016%20775.916H55.9546L293.421%2055.9546Z'%20fill='url(%23paint0_linear_0_18)'/%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_f_0_18'%20x='0'%20y='0'%20width='756.971'%20height='831.87'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='BackgroundImageFix'%20result='shape'/%3e%3cfeGaussianBlur%20stdDeviation='27.9773'%20result='effect1_foregroundBlur_0_18'/%3e%3c/filter%3e%3clinearGradient%20id='paint0_linear_0_18'%20x1='360.25'%20y1='55.9546'%20x2='360.25'%20y2='739.522'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23818DBF'/%3e%3cstop%20offset='1'%20stop-color='%23818DBF'%20stop-opacity='0'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e)
'%20style='mix-blend-mode:plus-lighter'%3e%3cpath%20d='M27.9773%2027.9773H198.092L198.119%20747.938H27.9962L27.9773%2027.9773Z'%20fill='url(%23paint0_linear_0_16)'/%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_f_0_16'%20x='0'%20y='0'%20width='226.096'%20height='775.916'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='BackgroundImageFix'%20result='shape'/%3e%3cfeGaussianBlur%20stdDeviation='13.9887'%20result='effect1_foregroundBlur_0_16'/%3e%3c/filter%3e%3clinearGradient%20id='paint0_linear_0_16'%20x1='94.807'%20y1='27.9773'%20x2='94.807'%20y2='711.545'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23818DBF'/%3e%3cstop%20offset='1'%20stop-color='%23818DBF'%20stop-opacity='0'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e)
'%20style='mix-blend-mode:plus-lighter'%3e%3cpath%20d='M558.852%2083.9319H728.967L1203.93%20803.893H83.9319L558.852%2083.9319Z'%20fill='url(%23paint0_linear_0_14)'/%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_f_0_14'%20x='0'%20y='0'%20width='1287.86'%20height='887.825'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='BackgroundImageFix'%20result='shape'/%3e%3cfeGaussianBlur%20stdDeviation='41.966'%20result='effect1_foregroundBlur_0_14'/%3e%3c/filter%3e%3clinearGradient%20id='paint0_linear_0_14'%20x1='625.681'%20y1='83.9319'%20x2='625.681'%20y2='767.499'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23818DBF'/%3e%3cstop%20offset='1'%20stop-color='%23818DBF'%20stop-opacity='0'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e)
