/hydrogen

Hydrogen lets you build faster headless storefronts in less time, on Shopify.

Primary LanguageTypeScriptMIT LicenseMIT

Hydrogen Logo

MIT License npm downloads

📚 Docs | 💬 Discussions | 📝 Changelog

Hydrogen is Shopify’s stack for headless commerce. It provides a set of tools, utilities, and best-in-class examples for building dynamic and performant commerce applications. Hydrogen is designed to dovetail with Remix, Shopify’s full stack web framework, but it also provides a React library portable to other supporting frameworks.

Hydrogen Legacy v1

Hydrogen legacy v1 has been moved to a separate repo and the docs can be found here.

Getting started with Hydrogen

Requirements:

  • Node.js version 16.14.0 or higher
  • npm (or your package manager of choice, such as yarn or pnpm)
  1. Install the latest version of Hydrogen:

    npm create @shopify/hydrogen@latest
  2. Run the local development server:

    npm install
    npm run dev
  3. Open your new Hydrogen app running at http://localhost:3000.

See the complete Hydrogen docs.

Packages in this repo

Hydrogen is organized as a monorepo, which includes multiple packages that can be used together.

Package Latest version Description Readme
@shopify/hydrogen Latest badge Opinionated tools, utilities, and best-in-class examples for building a commerce application with Remix. Readme
@shopify/hydrogen-react Latest badge Unopionated and performant library of Shopify-specific commerce components, hooks, and utilities. Readme
@shopify/cli-hydrogen Latest badge Hydrogen extension for Shopify CLI. Readme
@shopify/create-hydrogen Latest badge Generate a new Hydrogen project from the command line. Readme
@shopify/hydrogen-codegen Latest badge Generate types for Storefront API queries automatically. Readme
@shopify/remix-oxygen Latest badge Remix adapter enabling Hydrogen to run on the Oxygen runtime. Readme
@shopify/mini-oxygen Latest badge A local runtime for Hydrogen apps that simulates the Oxygen production environment. Readme

Versioning

Hydrogen and hydrogen-react are tied to specific versions of the Shopify Storefront API, which follows calver.

For example, if you're using Storefront API version 2023-01, then Hydrogen and hydrogen-react versions 2022.1.x are fully compatible.

If the Storefront API version update includes breaking changes, then Hydrogen and hydrogen-react may also include breaking changes. Because the API version is updated every three months, breaking changes could occur every three months.

Learn more about API release schedules at Shopify.

Contributing to Hydrogen

Read our contributing guide

Other handy links

Learn more about Hydrogen.