Ditectrev Shop is our ecommerce storefront for selling Ditectrev products. Built on Next.js Commerce with Shopify as the headless CMS, it provides a high-performance, server-rendered shopping experience using React Server Components, Server Actions, Suspense, useOptimistic, and more.
- High-performance Next.js App Router ecommerce
- Shopify headless CMS integration
- Server-rendered product pages and collections
- Cart and checkout flow
- Custom domain support (e.g. shop.ditectrev.com)
You will need to use the environment variables defined in .env.example to run locally. It's recommended you use Vercel Environment Variables, but a .env file is all that is necessary.
Note: Do not commit your
.envfile—it exposes secrets that allow others to control your Shopify store.
- Install Vercel CLI:
npm i -g vercel - Link local instance with Vercel and GitHub:
vercel link - Download environment variables:
vercel env pull
pnpm install
pnpm devYour app should now be running on localhost:3000.
This repository uses Shopify. Vercel maintains the Shopify version as outlined in the Next.js Commerce vision. Alternative providers (BigCommerce, Medusa, Saleor, etc.) can swap out the lib/shopify implementation—see the original commerce repo for details.
- Orama – Typeahead search, vector-based similarity
- React Bricks – Visual CMS for pages and content
We welcome feedback and contributions from other developers. Contributions in the form of pull requests and issues are greatly appreciated and help improve the quality of the shop and the overall experience.
To contribute:
- Open an issue to discuss your idea or report a bug
- Fork the repo and submit a pull request with your changes
- Read our contribution guidelines (if available) before submitting
Thank you for being involved!
- Vercel, Next.js Commerce, and Shopify Integration Guide – Step-by-step setup for Shopify as a headless CMS on Vercel
This project is licensed under the MIT License – see the LICENSE file for details.
