Deploy a Hydrogen storefront

• You're using the most recent version of Hydrogen. The latest package release gives you the benefits of performance enhancements, new components, and other best practices.

• If you're deploying to a non-Oxygen runtime, then you've retrieved a private Storefront token for server requests and stored it in a private environment variable.

• You’ve created a Hydrogen storefront through the Hydrogen channel or through the CLI.

Oxygen is Shopify's deployment platform for Hydrogen storefronts. To learn how to deploy a Hydrogen storefront to Oxygen, refer to Getting started with Oxygen.

Hydrogen builds on top of Remix. This enables you to deploy to any environment that supports Remix, such as Vercel, Netlify, Fly.io, and Cloudflare Workers. The following steps are general guidelines on how to set up Hydrogen storefronts for deployment to a non-Oxygen host.

1. Set up environment variables in your Hydrogen project, including the private Storefront API access token. This token enables you to avoid rate limiting in production.

2. Choose the Remix adapter for your desired host and install it in your project using npm. For example:

1. Uninstall @shopify/remix-oxygen:

1. Find the corresponding Remix adapter template code for the adapter that you just installed. Take note of server.js, remix.config.js, app/entry.server.jsx, and any type definitions. Then, apply these changes to your local files.

2. Ensure that you're still passing the storefront client to the loader context in the updated server.js file.

If you're deploying to a non-Oxygen runtime, then you need to set up a private Storefront API token. This is a necessary step to avoid rate-limiting in production. Learn how to use environment-specific data in your Hydrogen project.