Skip to main content
Nuxt is a headless storefront built using VueJS, on Nuxt 3 using Storefront UI and custom components. The Nuxt headless connector for Kibo Commerce enables you to integrate your storefront site with the following pages:
  • Product listing pages (PLP)
  • Product detail pages (PDP)
  • Cart
  • User account
  • Checkout
  • Store locations
  • CMS components
This guide will show you how to get up and running with the Kibo Connector.

​
Features

Nuxt supports the following features:
  • Performant by default
  • SEO Ready
  • Internationalization
  • Responsive
  • UI components
  • Theming

​
Contribute

This project follows the all-contributors specification and contributions of any kind are welcome.

​
Prerequisites

In order to use Nuxt Storefront, you must have the following:
  • NodeJS v14 or later
  • Kibo Commerce Account

​
Getting Started

To begin development on your own version of the repo:
  1. Fork or clone the repo: 
    git clone https://github.com/KiboSoftware/nuxt-storefront cd nuxt-storefront
  2. Checkout develop branch git checkout develop.
  3. Run yarn to install dependencies.
  4. Create a .env file from the .env.template file. 
    $ cp .env.template .env

​
Authentication

You’ll need to authenticate with the following data to configure the Nuxt Storefront. Your Client ID and Shared Secret can be found in your Developer Console.
  • KIBO_API_HOST: Your Kibo Commerce API Host.
  • KIBO_AUTH_HOST: Kibo Commerce Authentication Host Server. It is used to request an access token from the Kibo Commerce OAuth 2.0 service. 
  • KIBO_CLIENT_ID: Unique Application (Client) ID of your application. 
  • KIBO_SHARED_SECRET: Secret API key used to authenticate your application/client ID.
  • KIBO_PCI_HOST: PCI payments host. For Production and Production sandboxes, use pmts.mozu.com. 
For example: 
KIBO_API_HOST=t1234-s1234.sandbox.mozu.com
KIBO_AUTH_HOST=t1234-s1234.sandbox.mozu.com
KIBO_CLIENT_ID=i7d6294.HeadlessStorefront.1.0.0.Release
KIBO_SHARED_SECRET=12345_Secret
KIBO_PCI_HOST=pmts.mozu.com

​
Build Setup

To finish setting up, run the following commands: 
\# serve with hot reload at localhost:3000
$ yarn dev

# build for production and launch server
$ yarn build
$ yarn start

# generate static project
$ yarn generate

​
Resources

For more information, see the following resources: