Getting started with Hydrogen and Oxygen

[anitacheung83]

Personally I struggle a lot following Getting Started with Hydrogen and Oxygen but with a few attempt here is how I get started. Hopefully it will save people some time.

Step 1: Ensure you have hydrogen installed on your store

Here is the link to have hydrogen installed: Hydrogen
Notice to install it YOU NEED A PAYMENT PLAN !!!: Pricing

All of the payment plan will allow you to have hydrogen install. Of course it will be great to be free :)

Step 2: Create a new Hydrogen storefront

In your terminal run npm create @shopify/hydrogen@latest -- --quickstart. This will create a file called hydrogen-quickstart.

Step 3: Run the dev server

In your terminal run:

cd hydrogen-quickstart
npm run dev 

TLDR: the line shopify hydrogen dev from Getting Started with Hydrogen and Oxygen maybe deprecated??? the line does not work for me :(

Step 4: Create a hydrogen storefronts

Go to your Shopify Admin Page
Sales channels > Hydrogen > Create a hydrogen storefronts

If hydrogen does not show up on Sales Channels, you can search it up when you click on Sales channels

Step 5: Add token to .env file

Go to Storefront settings > Storefront API to get access token


Now go back to hydrogen-quickstart, on the .env file add

• PUBLIC_STOREFRONT_API_TOKEN="Insert Public Access Token“
• PRIVATE_STOREFRONT_API_TOKEN=“Insert Private Access Token”

Step 6: Link your hydrogen project to shopify

Run npx shopify hydrogen link

Congrats !!!

Hopefully it helps :)