Get Started
Quickstart
Get BVector Chat running in your web application in under five minutes.
1
Install the SDK
Install via your preferred package manager:
npm install @bangdb/web-sdk2
Get your API credentials
Sign in to the BangDB dashboard and go to Settings → API Keys to generate your API key and retrieve your instance connection URLs.
NOTE
You need a running BangDB instance. See the BVector Installation guide to set one up.
3
Initialize the widget
The widget mounts into a Shadow DOM and manages its own lifecycle. Call destroy() when your component unmounts.
BangDBChat.tsx
import { useEffect, useRef } from 'react';
import { ChatWidget } from '@bangdb/web-sdk';
export function BangDBChat() {
const widgetRef = useRef(null);
useEffect(() => {
if (widgetRef.current) return;
widgetRef.current = new ChatWidget({
title: 'Chat with AI',
config: {
apikey: 'your-api-key',
backendURL: 'https://your-instance.com:18080',
resourceURL: 'https://your-instance.com:18082',
userid: 'user-123',
indexName: 'my-index',
},
});
return () => { widgetRef.current?.destroy(); };
}, []);
return null;
}Done!
The chat widget appears in the bottom-right corner of your page. For framework-specific examples including Next.js, Angular, and vanilla script, see BVector Chat Quickstart.