Web SDK

# Using Yarn
yarn add @dittofeed/sdk-web

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

import { DittofeedSdk } from '@dittofeed/sdk-web';

// Initialize the sdk with a writeKey, which is used to identify your
// workspace. This key can be found at
// https://dittofeed.com/dashboard/settings
await DittofeedSdk.init({
  writeKey: "Basic 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.
DittofeedSdk.identify({
  userId: "123",
  traits: {
    email: "[email protected]",
    firstName: "John"
  },
});

// The track call is how you record any actions your users perform, along
// with any properties that describe the action.
DittofeedSdk.track({
  userId: "123",
  event: "Made Purchase",
  properties: {
    itemId: "abc",
  },
});

// 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.
DittofeedSdk.screen({
  userId: "123",
  name: "Recipe Screen",
  properties: {
    recipeType: "Soup",
  },
});

// Lets you subscribe a user to a subscription group.
DittofeedSdk.subscribe({
  userId: "123",
  subscriptionGroupId: "23b5757f-15a5-4477-858f-a96913b2a3f1",
});

// Lets you unsubscribe a user from a subscription group.
DittofeedSdk.unsubscribe({
  userId: "123",
  subscriptionGroupId: "23b5757f-15a5-4477-858f-a96913b2a3f1",
});

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

DittofeedSdk.identify({
  traits: {
    email: "[email protected]",
  },
});

const anonymousId = DittofeedSdk.getAnonymousId();

DittofeedSdk.resetAnonymousId();

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

  (function () {
    var methods = ["track", "identify", "page", "flush", "subscribe", "unsubscribe", "getAnonymousId", "resetAnonymousId"];
    methods.forEach(function (method) {
      _df[method] = function () {
        _df.push([method].concat(Array.prototype.slice.call(arguments)));
      };
    });

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

    // If you're self-hosting the Dittofeed dashboard, you'll need to to
    // specificy your own host.
    script.src = "https://app.dittofeed.com/dashboard/public/dittofeed.umd.js";

    script.id = "df-tracker";
    // Replace with your own write key found on: https://app.dittofeed.com/dashboard/settings
    script.setAttribute("data-write-key", "Basic my-write-key");
    // If you're self-hosting dittofeed, you'll need to to specificy your own host.
    // script.setAttribute("data-host", "http://localhost:3001");

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

  _df.identify({
    userId: "123",
    email: "[email protected]"
  });
</script>