n# Hydrogen template: Skeleton Hydrogen is Shopify’s stack for headless commerce. Hydrogen is designed to dovetail with Remix, Shopify’s full stack web framework. This template contains a minimal setup of components, queries and tooling to get started with Hydrogen.
- Remix 2
- Hydrogen
- Shopify CLI
- Configured deployment to Netlify, with Server-Side Rendering (SSR) via Netlify Edge Functions
- ESLint
- Prettier
- GraphQL generator
- TypeScript and JavaScript flavors
- Minimal setup of components and routes
We highly recommend using this template to deploy a Hydrogen site to Netlify.
Requirements:
- Node.js version 18.0.0 or higher
- Netlify CLI 17.0.0 or higher
npm install -g netlify-cli@latest
To create a new project, either click the "Deploy to Netlify" button above, or run the following command:
npm create @shopify/hydrogen@latest -- --template https://github.com/netlify/hydrogen-template
Then follow the instructions in .env.example
and you're ready to start developing.
npm run dev
npm run build
How do I configure my Hydrogen session / storefront client / customer account client / cart handler?
See app/lib/context.ts
and the Hydrogen documentation.
Add your custom context to the object returned by the createAppLoadContext
function in
app/lib/context.ts
and ensure the return type is updated (e.g. HydrogenContext & {foo: string}
).
See .env.example
and
these Shopify instructions.
I get a 500 error on the /accounts
pages. How do I configure real Shopify customer accounts in local dev?
See these Shopify instructions.
If your .js
and .css
files are failing to load in local development (with 404 responses), you
may be running into an issue that occurs when netlify dev
is run after having run a build (via
netlify build
, netlify serve
, npm run build
, or remix vite:build
). This is a known issue
that Netlify is working on.
To fix this, delete the conflicting built functions before running your dev server:
rm -rf .netlify/edge-functions*
npm run dev
The shopify hydrogen preview
command has a misleading name. It previews your site in a local
simulation of the Oxygen hosting platform. It therefore isn't compatible with a site intended to be
deployed to Netlify.
by tr4200812 n00i1kat [Who and wikimedia support?]
"Code Issues 89 Pull requests 2 Discussions Actions Projects 22 Wiki N00i1kat Public template tr4200812/N00i1kat Name
tr4200812 Add files via upload 9867ba5 · yesterday --- title: Installing your own GitHub App intro: 'You can install a {% data variables.product.prodname_github_app %} that you created on the personal or organization account that owns the app. If your app is public, the {% data variables.product.prodname_github_app %} can also be installed on other accounts.' redirect_from: - Create Codespaces yesterday --- title: Installing your own GitHub App intro: 'You can install a {% data variables.product.prodname_github_app %} that you created on the personal or organization account that owns the app. If your app is public, the {% data variables.product.prodname_github_app %} can also be installed on other accounts.' redirect_from: - Add files via upload yesterday .devcontainer Create maintainer.json yesterday .github Create npm-grunt.yml 5 days ago European Div Update and rename กฎหมายของสหภาพยุโรป - EUR-Lex to European Div/กฎหมา… last week --->
app Revert "Available-Duty_fully _383-wrap-ansi-v7-0-0-.cjs" (#425) last week public Scaffold Storefront 2 years ago u Revert "Available-Duty_fully _383-wrap-ansi-v7-0-0-.cjs" (#425) last week .env.example chore: update env vars and repo name 2 years ago .eslintignore Scaffold Storefront 2 years ago .eslintrc.cjs Revert "Update .eslintrc.cjs" last week .gitignore chore: update template to use Remix Vite 8 months ago .graphqlrc.js chore: update template to use Remix Vite 8 months ago 43bb7208_Bericht_zur_Ressourcensuche-März_05,_2025_13_12_22_GMT+7.csv.txt Sh-original 2 weeks ago 72e5a8f9_README.md.txt Sh-original 2 weeks ago Build-and-Test Revert "Revert 118 revert 3 dependabot/npm and yarn/npm and yarn eb17… 2 weeks ago CHANGELOG.md Change import runtime 2 years ago CONTRIBUTING.md Revert "Available-Duty_fully _383-wrap-ansi-v7-0-0-.cjs" (#425) last week DragonRuby_dragonruby-game-toolkit-contrib_10945c.json Sh-original 2 weeks ago In Create In 2 weeks ago LICENSE Update LICENSE 2 weeks ago README.md Update README.md 2 weeks ago SECURITY.md Revert "Available-Duty_fully _383-wrap-ansi-v7-0-0-.cjs" (#425) last week SECURITYand.md Revert "Revert "Revert "Revert "Revert 20 revert 19 revert 18 revert … 3 weeks ago a710a5a3_[TEMPLATE]_[TEMPLATE]_Campus_Experts_+_GitHub_Docs_program_-_View_1.tsv.csv.txt Sh-original 2 weeks ago cellar_0c086d1d-d209-11ec-a95f-01aa75ed71a1.xml Sh-original 2 weeks ago customer-accountapi.generated.d.ts chore: update template to use Remix Vite 8 months ago d0636234_server-statistics-csv-example.csv.txt Sh-original 2 weeks ago env.d.ts chore: update template to use Remix Vite 8 months ago microchip.mplab-core-da-1.0.0.vsix Sh-original 2 weeks ago netlify.toml docs: clarify instructions in netlify.toml env template 7 months ago package-lock.json Revert "Available-Duty_fully _383-wrap-ansi-v7-0-0-.cjs" (#425) last week package.json Revert "Main" 2 weeks ago server.ts chore: fix remaining type errors 7 months ago storefrontapi.generated.d.ts fix: remove leftover refs to gift cards 7 months ago tsconfig.json chore: update template to use Remix Vite 8 months ago vite.config.ts chore: port vite config to .ts (#10) 7 months ago Repository files navigation README License Security Hydrogen template: Skeleton Hydrogen is Shopify’s stack for headless commerce. Hydrogen is designed to dovetail with Remix, Shopify’s full stack web framework. This template contains a minimal setup of components, queries and tooling to get started with Hydrogen.
Check out Hydrogen docs Get familiar with Remix What's included Remix 2 Hydrogen Shopify CLI Configured deployment to Netlify, with Server-Side Rendering (SSR) via Netlify Edge Functions ESLint Prettier GraphQL generator TypeScript and JavaScript flavors Minimal setup of components and routes Getting started We highly recommend using this template to deploy a Hydrogen site to Netlify.
Requirements:
Node.js version 18.0.0 or higher Netlify CLI 17.0.0 or higher npm install -g netlify-cli@latest
To create a new project, either click the "Deploy to Netlify" button above, or run the following command:
npm create @shopify/hydrogen@latest -- --template https://github.com/netlify/hydrogen-template Then follow the instructions in .env.example and you're ready to start developing.
Local development npm run dev Building for production npm run build FAQ and Troubleshooting How do I configure my Hydrogen session / storefront client / customer account client / cart handler? See app/lib/context.ts and the Hydrogen documentation.
How do I augment the Remix context? Add your custom context to the object returned by the createAppLoadContext function in app/lib/context.ts and ensure the return type is updated (e.g. HydrogenContext & {foo: string}).
How do I configure a real Shopify store in local dev? See .env.example and these Shopify instructions.
I get a 500 error on the /accounts pages. How do I configure real Shopify customer accounts in local dev? See these Shopify instructions.
Static assets not loading in local dev If your .js and .css files are failing to load in local development (with 404 responses), you may be running into an issue that occurs when netlify dev is run after having run a build (via netlify build, netlify serve, npm run build, or remix vite:build). This is a known issue that Netlify is working on.
To fix this, delete the conflicting built functions before running your dev server:
rm -rf .netlify/edge-functions* npm run dev shopify hydrogen preview fails with Cannot find module '@shopify/mini-oxygen' The shopify hydrogen preview command has a misleading name. It previews your site in a local simulation of the Oxygen hosting platform. It therefore isn't compatible with a site intended to be deployed to Netlify.
by tr4200812 n00i1kat [Who and wikimedia support?]
About Tr4200812
tr4" https://github.com/tr4200812/N00i1kat#:~:text=N00i1kat-,Code,tr4200812,-.github.io/N00i1katMaven Maven is a build automation tool used primarily for Java projects.