SDK Integration

This guide covers integrating the Bklit SDK during the onboarding process.

Overview

During onboarding, an API token is automatically generated for your project. You'll then integrate the Bklit SDK to start tracking analytics.

Step 1: Get Your API Token

After creating your project, you'll see:

API Token - Your unique token (save it!)
Project ID - Your project identifier
API Host - Your API endpoint URL

⚠️ Important: The full token is only shown once. Copy it immediately!

Step 2: Install the SDK

npm install @bklit/sdk

pnpm add @bklit/sdk

Step 3: Initialize the SDK

Vanilla JavaScript / React

import { initBklit } from '@bklit/sdk';

initBklit({
  projectId: 'your-project-id',
  apiKey: 'bk_live_your-token-here',
});

Next.js

import { BklitComponent } from '@bklit/sdk/nextjs';

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        <BklitComponent
          projectId="your-project-id"
          apiKey="bk_live_your-token-here"
        />
        {children}
      </body>
    </html>
  );
}

Step 4: Verify Integration

After integrating the SDK:

Visit your website/application
Check browser console for SDK logs
Go to Bklit dashboard
Verify events are being tracked

Configuration Options

Basic Configuration

initBklit({
  projectId: 'your-project-id',
  apiKey: 'your-api-token',
});

Advanced Configuration

initBklit({
  projectId: 'your-project-id',
  apiKey: 'your-api-token',
  // wsHost auto-detected (wss://bklit.ws:8080 in production)
  environment: 'production', // 'development' or 'production'
  debug: false, // Enable debug logging
});

Environment Variables

Store your token securely:

# .env.local
NEXT_PUBLIC_BKLIT_PROJECT_ID=your-project-id
NEXT_PUBLIC_BKLIT_API_KEY=bk_live_your-token-here

// Use in code
initBklit({
  projectId: process.env.NEXT_PUBLIC_BKLIT_PROJECT_ID,
  apiKey: process.env.NEXT_PUBLIC_BKLIT_API_KEY,
});

Debug Mode

Enable debug mode to see SDK logs:

initBklit({
  projectId: 'your-project-id',
  apiKey: 'your-api-token',
  debug: true, // Enable debug logging
});

You'll see logs like:

🎯 Bklit SDK: Initializing with configuration
🆔 Bklit SDK: New session created
🚀 Bklit SDK: Tracking page view...
✅ Bklit SDK: Page view tracked successfully!

Next Steps

After integrating the SDK:

Test Connection - Verify tracking works
SDK Documentation - Learn about SDK features
Event Tracking - Track custom events

Troubleshooting

SDK Not Loading

Check SDK is installed correctly
Verify import path is correct
Check browser console for errors

No Events Tracking

Verify project ID is correct
Check API token is valid
Verify token has project access
Enable debug mode to see logs

Token Errors

Verify token format is correct
Check token hasn't expired
Ensure token has project access

Testing Connection - Verify tracking
SDK Documentation - Complete SDK guide
API Tokens - Token management

SDK Integration

On this page