xclade Store Starter Template

The businessx starter template is a ready-to-deploy storefront built on top of the xclade API. It includes everything you need to launch a store — product listings, cart, checkout, and customer accounts — so you can focus on customizing instead of building from scratch.

Prerequisites

Before you begin, make sure you have the following:

• Node.js v18 or later
• pnpm (recommended) or npm/yarn
• An xclade account — sign up here
• Your Publishable API Key from the xclade dashboard

Installation

1. Clone the repository

git clone https://github.com/xclade/businessx.git
cd businessx

2. Install dependencies

pnpm install

3. Configure environment variables

Copy the example env file and fill in your credentials:

cp .env.example .env.local

Open .env.local and set the following:

# Your xclade tenant API base URL
NEXT_PUBLIC_XCLADE_API_URL=https://{your-tenant}.api.myxclade.com

# Your Publishable API Key (from Settings > API Keys in the dashboard)
NEXT_PUBLIC_XCLADE_PUBLISHABLE_KEY=pk_01H...

4. Start the development server

pnpm dev

Your store will be running at http://localhost:8000.

Project Structure

businessx/
├── app/                  # Next.js App Router pages
│   ├── (store)/          # Storefront routes (products, cart, checkout)
│   └── account/          # Customer account pages
├── components/           # Reusable UI components
├── lib/
│   └── xclade/           # xclade API client and helpers
└── .env.local            # Your environment variables

Deploying to Production

The template is optimized for deployment on Vercel.

Deploy with Vercel

1. Push your repo to GitHub (fork or your own copy)
2. Import the project at vercel.com/new
3. Add your environment variables in the Vercel dashboard
4. Click Deploy

Alternatively, deploy via the CLI:

pnpm vercel --prod

Next Steps

Once your store is running, explore the API to customize and extend it: