Strapi Starter Nuxt.js e-commerce

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!