Hydrogen / For developers

Hydrogen now deploys to Vercel
in just a few clicks

A "Deploy" button has been added to the Hydrogen developer preview. One click creates a repository from a starter, sets up a Vercel project, and runs the build. No local setup required.

On this page
  1. Understand in 30 seconds: what was announced
  2. How it works: what happens when you press the Deploy button
  3. What's included in the starter template out of the box
  4. How to connect your own store
  5. What's stated vs. what isn't
  6. 5 points developers should know
  7. 3 use cases you can apply to your work
  8. A one-line summary for your pitch

1Understand in 30 seconds: what was announced

The Hydrogen developer preview now supports few-click deployment to Vercel.
The new "Deploy" button ① creates a repository from the Next.js starter template, ② sets up a Vercel project, and ③ runs the build.No local setup required.
Deploy

A one-click entry point

A single Deploy button is the starting point—no manual repository creation or hosting configuration in between.

Deploys to Vercel

A project is created on Vercel and built right away. Instructions for other frameworks and existing projects are laid out in the same document.

Zero local setup

A working storefront spins up in the cloud without waiting on a CLI install or dependency resolution.

This targets the Hydrogen "developer preview". The original text clearly states that this is a preview-stage feature.

2How it works: what happens when you press the Deploy button

Deploy Press the button In the docs ① Create repository Next.js starter from the template ② Configure Vercel ③ Build Publish
These four steps (button → repository creation → Vercel setup → build) a single automated flowconnect together. Developers get a working storefront right away, with no "deployment wiring" to do.

3What comes preloaded in the starter template

The template is a "pre-wired, working Hydrogen storefront." The following are built in from the start (as stated in the original).

Typed Storefront API client
typed client
Cart
cart
Product page
product pages
Collection page
collection pages

4Steps to connect your own store

1
Deploy

Launch with the Deploy button

Deploy the template from "Deploy a starter template" in the docs.

2

Add Headless channel credentials

Set your Headless sales channel store credentials in the template.

3

Your products appear

Once the credentials are connected, your store's products show up in the template.

Where to find the documentation "Deploy a starter template" in the developer preview docs. Setup instructions for other frameworks and for existing projects are listed alongside it.

5What's stated vs. not stated

ItemAs stated in the original
Deployment targetStated Vercel
Base templateStated Next.js starter template
Included featuresStated Typed Storefront API client / cart / product and collection pages
How to connect a storeStated Add Headless channel credentials
Availability stageStated Hydrogen developer preview
Pricing / costNot stated
Supported hosting other than VercelNot stated(Only notes that "there are also paths for other frameworks / existing projects")
GA (general availability) timingNot stated

65 points engineers should know

1-click

1. "Zero wiring to reach Deploy" is the core

Repository creation, Vercel project setup, and build are all automated as one flow. The essential value is being able to stand up a prototype or test environment in the shortest time.

2. A typed Storefront API client is included

GraphQL Storefront API calls come typed and wired up from the start. You can jump straight into product-fetching logic without writing the initial API client setup.

3. Store connection uses Headless channel credentials

To serve your own products, you pass the credentials of the Headless sales channel. The template defaults to running on demo data.

preview

4. Assumes you're at the preview stage

This is a feature for the Hydrogen developer preview. Deciding on production adoption means factoring in the risk of the preview stage (possible spec changes).

5. Paths beyond Vercel sit in the same docs

The headline this time is one-click deploy to Vercel, but the docs also list setup paths for other frameworks and for existing projects. Teams with an existing Hydrogen project reference the same place, so it's easy to find.

73 use cases you can apply to your work

USE CASE 1

Stand up a proposal/demo storefront the same day

Problem
Every headless proposal takes half a day to a full day for local environment setup plus hosting configuration, so getting a demo off the ground is slow.
Solution
Instantly deploy the template to Vercel with the Deploy button, then plug in the customer's products via Headless channel credentials.
Result
You can share a "working demo URL" the same day as the meeting, boosting both the persuasiveness and speed of your proposal.
Technical note
No local setup required. Cart, products, and collections are already wired up, so you can try everything end to end with no extra implementation.
USE CASE 2

As a learning/testing environment for the typed Storefront API client

Problem
You want new members to try Hydrogen / the typed Storefront API, but teaching them starting from building the scaffold slows down the initial momentum.
Solution
Hand out a deployed template and have them read the already-wired typed client, cart, and product page code.
Result
They can learn from a "working, real thing," so they grasp GraphQL query typing and Hydrogen's structure faster.
Technical note
The entry point is "Deploy a starter template" in the developer preview docs. Since it's at the preview stage, watch out for version differences in the learning material.
USE CASE 3

Rapidly iterate on a PoC that assumes Vercel hosting

Problem
You want to consider running Hydrogen on Vercel, but verifying the compatibility between the framework and hosting takes effort.
Solution
Use the Deploy button to automatically generate and build a Vercel project, and check the actual hosting behavior in the shortest time.
Impact
Lets you make a first-pass call on whether Vercel × Hydrogen works, at near-zero setup cost.
Technical notes
Paths for non-Vercel hosts and existing projects are covered in the same docs. Pricing and GA timing aren't stated in the original, so verify separately.

8One-line summary for pitches

"The Hydrogen developer preview can now be deployed to Vercel in a few clicks.
The Deploy button automates everything from generating a repo out of the Next.js starter to Vercel config and the build,
spinning up a working storefront with cart, products, and collections already wired—with zero local setup—instantly."