Next.js + Tailwind CSS + Shopify GraphQL Example
This example shows how to use Tailwind CSS (v3.0) with Next.js. It follows the steps outlined in the official Tailwind docs.
How to use
Shopify Setup
You'll need to create a Shopify store and a private app for that Shopify store and add enable Storefront API.
Code Setup
Copy the .env.example
file into .env.local
(which will be ignored by Git):
cp .env.local.example .env.local
Then set each variable on .env.local
:
- SHOPIFY_DOMAIN is the domain of the store
- SHOPIFY_STOREFRONT_API is your private app's storefront api token
Then run project locally:
yarn && yarn dev
Deploy it to the cloud with Vercel (Documentation).