Nuxt

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:

Fork or clone the repo:

git clone https://github.com/KiboSoftware/nuxt-storefront cd nuxt-storefront

Checkout develop branch git checkout develop.
Run yarn to install dependencies.
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: