মূল কনটেন্টে যান

রেফারেন্স

API রেফারেন্স

ফ্রেমওয়ার্ক ইন্টিগ্রেশন

SDK-র কোনো ফ্রেমওয়ার্ক-নির্দিষ্ট স্তর লাগে না: অটোক্যাপচার History API প্যাচ করে, তাই যেকোনো রাউটারের অধীনে রুট পরিবর্তন ট্র্যাক হয়। পৃষ্ঠার জন্য একটি ক্লায়েন্ট তৈরি করুন এবং আপনার ফ্রেমওয়ার্ক যেভাবে অন্য জিনিস ভাগ করে সেভাবে ভাগ করুন। সার্ভারেও রেন্ডার করছেন? নিচের স্নিপেটগুলির মতো ক্লায়েন্টটি শুধু ব্রাউজারে তৈরি করুন।

এই স্নিপেটগুলির কী কনসোল থেকে আসে: একটি API কী নিন

At a glance

Route tracking
None needed: autocapture patches the History API, every router is covered
Pattern
One createWebClient per page, shared via your framework
React
@prodantix/react, the one lifecycle that needs an adapter

React

React-ই একমাত্র ব্যতিক্রম: এর লাইফসাইকেলের জন্য নিবেদিত অ্যাডাপ্টার লাগে, একটি provider ও hook যা ক্লায়েন্টকে একবারই ইনস্টল করে, StrictMode-নিরাপদভাবে।

Bash
bun add @prodantix/sdk @prodantix/react

Vue

JavaScript
// prodantix.js
import { createWebClient } from '@prodantix/sdk/web';

export const prodantixPlugin = {
  install(app, options) {
    const client = createWebClient(options);
    app.provide('prodantix', client);
  },
};

// main.js (in a Nuxt app: a .client.js plugin)
app.use(prodantixPlugin, {
  apiKey: PRODANTIX_PUBLIC_KEY,
  host: 'https://eu.api.prodantix.com',
  flagsHost: 'https://api.prodantix.com',
});

// any component
import { inject } from 'vue';
const prodantix = inject('prodantix');
prodantix.capture('order.completed');

Svelte

JavaScript
// $lib/prodantix.js
import { browser } from '$app/environment';
import { createWebClient } from '@prodantix/sdk/web';

export const prodantix = browser
  ? createWebClient({
      apiKey: PRODANTIX_PUBLIC_KEY,
      host: 'https://eu.api.prodantix.com',
      flagsHost: 'https://api.prodantix.com',
    })
  : null;

// any component
import { prodantix } from '$lib/prodantix';
prodantix?.capture('order.completed');

Angular

JavaScript
// prodantix.service.ts (Angular Universal: create only when isPlatformBrowser)
import { Injectable } from '@angular/core';
import { createWebClient } from '@prodantix/sdk/web';

@Injectable({ providedIn: 'root' })
export class ProdantixService {
  readonly client = createWebClient({
    apiKey: PRODANTIX_PUBLIC_KEY,
    host: 'https://eu.api.prodantix.com',
    flagsHost: 'https://api.prodantix.com',
  });
}

// any component
constructor(private prodantix: ProdantixService) {}
this.prodantix.client.capture('order.completed');