If you follow the content of our blog you are aware that Remi and I have embarked on the creation of starters. I created a blog starter using Gatsby and Remi a corporate site starter using Next.js as well as a portfolio starter using Gridsome. Well today I am glad to announce that an e-commerce starter using Nuxt.js and Snipcart has been published!
This starter is a simple e-commerce application on which you can buy dev stickers with an integrated shopping cart made by Snipcart. Super easy to integrate, Snipcart offers you the possibility to sell products, downloads, or subscriptions online.
Features in Strapi
- 1 Component
- 2 Collection types: Product, Category
- 27 Created products
- 6 Created categories
- Permissions set to
true
for product and category - Responsive design using Tailwind css
- Slug system
- Publication system (draft & published)
- Role based access controls
Features in Nuxt.js
- @nuxt/strapi module
Payment service
This starter is using Snipcart which allows you setup a shopping cart on any website.
They wrote a tutorial teaching you how to create this website but selling cupcakes!
Payment will not work on localhost, we are redirecting you to this tutorial if you want to test payment locally.
Getting started
Clone the repository
git clone https://github.com/strapi/strapi-starter-nuxt-e-commerce.git
cd strapi-starter-nuxt-e-commerce
Backend
Install dependencies and run your server
# Using yarn
yarn install
yarn develop
# Using npm
npm install
npm run develop
Frontend
# Using yarn
yarn install
yarn develop
# Using npm
npm install
npm run develop
Nuxt.js server is running here => http://localhost:3000
Enjoy this starter
If you liked this starter and want to develop a version of it with another frontend framework (Vue.js, Next.js or 11ty for example). Feel free to submit a Topic idea here!
Thank you for taking the time to read this blog post, I'll see you soon with a new starter (with Gridsome again) ;)
Enjoy this starter!