📚 Docs | 🗣 Discord | 💬 Discussions | 📝 Changelog

Hydrogen is a React-based framework for building dynamic, Shopify-powered custom storefronts.

Spin up a Hydrogen app in your browser with our playground or set up your local environment with the instructions below ⬇️

This is a developer preview of Hydrogen. The documentation will be updated as Shopify introduces new features and refines existing functionality.

Getting Started

Requirements:

• yarn or npm
• Node.js version 16.5.0 or higher

Installation:

# Using `yarn`
yarn create hydrogen-app

# Using `npm`
npm init hydrogen-app@latest

# Using `npx`
npx create-hydrogen-app

Running locally:

1. Start a development server

# Using `yarn`
yarn install
yarn dev

# Using `npm`
npm i --legacy-peer-deps
npm run dev

2. Visit the development environment running at http://localhost:3000.

Learn more about getting started with Hydrogen.

Contributing to Hydrogen

Read our contributing guide

Other handy links

🎁 Give us the gift of feedback.

📍 Check out Hydrogen examples on Github.

🤩 Learn more about Hydrogen.

👷‍♀️ Add npm packages to your project:

• @shopify/hydrogen
• @shopify/hydrogen-cli
• create-hydrogen-app
• eslint-plugin-hydrogen
• hydrogen-plugin-sanity