Рет қаралды 121,761
In this video, we're going to build a simple Ecommerce website with Tailwind UI, Shopify, and Next.js.
We'll fetch products from Shopify using the Storefront GraphQL API, and build our front-end by assembling and customizing components from Tailwind UI.
Demo site: tailwindui-shopify.vercel.app
Tailwind UI: tailwindui.com
Storefront API: shopify.dev/api/storefront
0:00 - Intro
0:42 - Starting point
1:56 - Tailwind UI
2:29 - Homepage hero
3:56 - Products list
5:26 - Storefront API
8:01 - Fetching data in Next.js
8:33 - Fetch helper method
10:50 - Products query
12:52 - Displaying products
15:55 - Drink some water!
16:04 - Single product page
16:33 - Tailwind UI page example
19:07 - Single product query
23:29 - Displaying the product
25:38 - Related products query
27:31 - Displaying related products
28:21 - Checkout button
32:45 - Wrap up