This example was built with an older version of Next.js. For examples using more recent versions of Next and other frameworks, please see our most current demos and starter kits.
If you want to get started with Next.js this is a good place to begin! This is a simple Next.js ecommerce example to show you how Next.js seamlessly integrates with Snipcart and DatoCMS, providing quickest way to get your ecommerce started.
Installing this template will:
This template is explained in details in the related blog post. Follow the instructions to build it from scratch and delve deeper in how a Next.js ecommerce is built.
You can see how it looks live on this demo installation.
If you want to set up a live demo for yourself, just sign up for a free DatoCMS account and click this button:
To run this project locally, install the dependencies of this project:
Add an .env.local
file containing the read-only API token of your DatoCMS site (set up with the demo button above) and your Snipcart API key:
1echo 'NEXT_PUBLIC_DATO_API_READONLY_TOKEN=abc123' >> .env.local2echo 'NEXT_PUBLIC_SNIPCART_API_KEY=abc123' >> .env.local
Then, to run this website in development mode (with live-reload):
1npm run start
To build the final, production ready static website:
1npm run build
The final result will be saved in the public
directory.