Nuxt.js starter for creating a simple e-commerce website with Strapi.
This starter allows you to try Strapi with Nuxt.js with the example of a simple e-commerce website where you can buy dev stickers. It is fully customizable and due to the fact that it is open source, fully open to contributions. So do not hesitate to add new features and report bugs!
- 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
- @nuxt/strapi module on the frontend
- Payments handled with Snipcart
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.
Use our create-strapi-starter
CLI to create your project.
# Using Yarn
yarn create strapi-starter my-site nuxt-e-commerce
# Or using NPM
npx create-strapi-starter my-site nuxt-e-commerce
The CLI will create a monorepo, install dependencies, and run your project automatically.
The Nuxt frontend server will run here => http://localhost:3000
The Strapi backend server will run here => http://localhost:1337
You will need to deploy the frontend
and backend
projects separately. Here are the docs to deploy each one:
Don't forget to setup the environment variables on your production app:
For the frontend the following environment variable is required:
API_URL
: URL of your Strapi backend, without trailing slash
Enjoy this starter!