Web SDK - Tranthor

Tranthor’s Web SDK allows you to send events from your web app to Tranthor’s API.

Installation

# Using Yarn
yarn add @tranthor/sdk-web

# Using NPM
npm install --save @tranthor/sdk-web

Usage

Tranthor’s web SDK is used to send events to Tranthor from the browser. Tranthor is an AI-native CRM for ecommerce brands.

import { TranthorSdk } from '@tranthor/sdk-web';

// Initialize the sdk with a writeKey, which is used to identify your
// workspace. This key can be found at
// https://app.tranthor.com/dashboard/settings
await TranthorSdk.init({
  writeKey: "Basic trn_abcdefg...",
});

// Lets you tie a user to their actions and record traits about them. It
// includes a unique User ID and any optional traits you know about the
// user, like their email, name, and more.
TranthorSdk.identify({
  userId: "user-123",
  traits: {
    email: "alex@example.com",
    name: "Alex Smith",
    phone: "+1234567890"
  },
});

// The track call is how you record any actions your users perform, along
// with any properties that describe the action.
TranthorSdk.track({
  userId: "user-123",
  event: "Completed Order",
  properties: {
    orderId: "ORD-789",
    revenue: 99.99
  },
});

// Lets you record whenever a user sees a screen, the mobile equivalent of
// page, in your mobile app, along with any properties about the screen.
TranthorSdk.screen({
  userId: "user-123",
  name: "Product Page",
  properties: {
    category: "Electronics",
    priceRange: "500-1000"
  },
});

// Ensures that asynchronously submitted events are flushed synchronously
// to Tranthor's API.
await TranthorSdk.flush();

Install the Snippet

You can also import the Tranthor snippet into your web app. This snippet will automatically load the Tranthor SDK and initialize it with your write key. This is convenient if you want to use the Tranthor SDK without a build system e.g. in a site builder like Webflow.

<script type="text/javascript">
  var _tr = _tr || [];

  (function () {
    var methods = ["track", "identify", "page", "screen", "flush"];
    methods.forEach(function (method) {
      _tr[method] = function () {
        _tr.push([method].concat(Array.prototype.slice.call(arguments)));
      };
    });

    var script = document.createElement("script");
    script.type = "module";
    script.async = true;

    script.src = "https://app.tranthor.com/dashboard/public/tranthor.umd.js";

    script.id = "tr-tracker";
    // Replace with your own write key found on: https://app.tranthor.com/dashboard/settings
    script.setAttribute("data-write-key", "Basic trn_your_key");
    // The data-host attribute is not needed as Tranthor does not offer self-hosting for this SDK path.

    document.head.appendChild(script);
  })();

  _tr.identify({
    userId: "user-123",
    traits: {
      email: "alex@example.com",
      name: "Alex Smith"
    }
  });
</script>