Vercel Commerce

Vercel Commerce built a headless B2C e-commerce starter kit using Next.JS commerce. With a few clicks, Next.js developers can clone, deploy and fully customize their own store. You can start with the default local provider @vercel/commerce-local that has all features disabled (cart, auth) and uses static files for the backend.

Features

Vercel Commerce supports the following features:

  • Performant by default
  • SEO Ready
  • Internationalization
  • Responsive
  • UI Components
  • Theming
  • Standardized Data Hooks
  • Integrations (Integrates seamlessly with the most common e-commerce platforms, including Kibo). 
  • Dark Mode Support

Demo Example

View a live demo of Kibo’s Vercel Commerce Storefront here.

Getting Started

Our commitment to Open Source can be found here.

  1. Fork this repository to your own GitHub account and then clone it to your local device.
  2. Create a new branch git checkout -b MY_BRANCH_NAME
  3. Install the dependencies: pnpm install
  4. Build the packages: pnpm build
  5. Duplicate site/.env.template and rename it to site/.env.local
  6. Add proper store values to site/.env.local
  7. Run cd site & pnpm dev to watch for code changes.
  8. Run pnpm turbo run build to check the build after your changes.
  9. The following data is required to configure the storefront.
    • 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. This is viewable from your Kibo Dev Center.
    • KIBO_SHARED_SECRET: Secret API key used to authenticate your application/client ID.

Visit Kibo documentation for more details on API authentication.

Resources

For more information, see the Next.JS and Jest resources.