An open API service indexing awesome lists of open source software.

https://github.com/aslemammad/hydrogen

React-based framework for building dynamic, Shopify-powered custom storefronts.
https://github.com/aslemammad/hydrogen

Last synced: 9 months ago
JSON representation

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

Awesome Lists containing this project

README

          





📚 [Docs](https://shopify.dev/custom-storefronts/hydrogen) | 🗣 [Discord](https://discord.gg/Hefq6w5c5d) | 💬 [Discussions](https://github.com/Shopify/hydrogen/discussions) | 📝 [Changelog](./packages/hydrogen/CHANGELOG.md)

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

Spin up a Hydrogen app in your browser with our [playground](https://hydrogen.new/) 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](https://github.com/Shopify/hydrogen/releases). Production launches of Hydrogen custom storefronts aren't yet supported as Shopify is evolving the Hydrogen framework.

## Getting Started

**Requirements:**

- `yarn` or `npm`
- Node.js version 14.0 or higher

**Installation:**

```bash
# 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

```bash
# 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](https://shopify.dev/custom-storefronts/hydrogen/getting-started).

## Contributing to Hydrogen

[Read our contributing guide](./docs/contributing.md)

## Other handy links

🎁 Give us the gift of [feedback](https://www.surveymonkey.com/r/HydrogenFeedback).

📍 Check out [Hydrogen examples on Github](https://github.com/Shopify/hydrogen-examples).

🤩 [Learn more about Hydrogen](https://shopify.dev/hydrogen).

👷‍♀️ Add `npm` packages to your project:

- [`@shopify/hydrogen`](https://www.npmjs.com/package/@shopify/hydrogen)
- [`@shopify/hydrogen-cli`](https://www.npmjs.com/package/@shopify/hydrogen-cli)
- [`@shopify/hydrogen-plugin-sanity`](https://www.npmjs.com/package/@shopify/hydrogen-plugin-sanity)
- [`create-hydrogen-app`](https://www.npmjs.com/package/create-hydrogen-app)
- [`eslint-plugin-hydrogen`](https://www.npmjs.com/package/eslint-plugin-hydrogen)