Burnna's e-commerce website built with Next.js and Shopify Storefront API.
This project was bootstraped using Next.js Commerce.
Programming Language: Typescript.
Framework: Next.js
Components Library: Material-UI
Data Fetching and Cache: SWR
Query Language: GraphQL
API: Shopify’s Storefront API
- Data caching
- SPA
- Server-Side Rendering
- Multiple Layouts
- Cookies Management
- PWA (Progressive Web App)
- Incremental SSG
- Internacionalization: en-US / es
- Accessibility and UX enhanced experience
- SEO
Open .env.local and change the value of COMMERCE_PROVIDER to the provider you would like to use, then set the environment variables for that provider (use .env.template as the base).
The setup for Shopify would look like this for example:
COMMERCE_PROVIDER=shopify
NEXT_PUBLIC_SHOPIFY_STOREFRONT_ACCESS_TOKEN=xxxxxxxxxxxxxxxxxxxxxxxxxxxx
NEXT_PUBLIC_SHOPIFY_STORE_DOMAIN=xxxxxxx.myshopify.com
NEXT_PUBLIC_SHOPIFY_STORE_CHECKOUT_DOMAIN=checkout.xxxxxxx.com
And check that the tsconfig.json resolves to the chosen provider:
"@framework": ["framework/shopify"],
"@framework/*": ["framework/shopify/*"]
That's it!
I recommend deploy this project to Vercel, but you can deploy to any PaaS.
For support, email [email protected].
Please check the Next.js Commerce documentation