Developer

Install and quickstart the Apex SDK

Choose the hosted script snippet or npm package, initialize Apex, and send your first SDK events.

The Apex SDK runs experiments, applies DOM mutations, evaluates flags, and sends storefront events to the Apex Worker. Use the hosted script for most storefront installs. Use the npm package when your app needs typed code-owned experiments, React bindings, or direct module imports.

Prerequisites

  • An Apex shop identifier from the installation screen.
  • The public Worker endpoint, usually https://events.drip-apex.com.
  • For npm usage, Node.js 18 or newer in your storefront build pipeline (the SDK package itself targets external consumers; developing inside the Apex monorepo requires Node.js 22.22+).

Hosted script

Add the hosted SDK before the closing </head> tag and initialize it with a placeholder shop ID:

html
<script>
  window.drip = window.drip || [];
  window.Drip = window.Drip || {
    init(config) { window.drip.push({ type: "init", config }); },
    track(type, data) { window.drip.push({ type: "track", event: type, data }); },
    trackGoal(goalId, data) { window.drip.push({ type: "trackGoal", goalId, data }); },
    setConsent(granted) { window.drip.push({ type: "setConsent", granted }); }
  };
</script>
<script async src="https://sdk.drip-apex.com/drip.js"></script>
<script>
  Drip.init({
    shopId: "demo-shop",
    endpoint: "https://events.drip-apex.com"
  });
</script>

Use this path for Shopify theme snippets, Shopware plugins, WooCommerce templates, static storefronts, or headless sites where Apex should own assignment, anti-flicker, pageview tracking, and mutation delivery.

npm package

Install the SDK when you want module imports:

bash
npm install @drip-apex/sdk

Initialize with fetched experiments:

ts
import { init, track, trackGoal } from "@drip-apex/sdk";
 
init({
  shopId: "demo-shop",
  endpoint: "https://events.drip-apex.com",
  trackingStart: "idle"
});
 
track("add_to_cart", {
  product_id: "gid://shopify/Product/example",
  value: 49,
  currency: "EUR"
});
 
trackGoal("product-page-cta-click", {
  source: "custom-button"
});

Initialize with local experiments:

ts
import { defineExperiment, init } from "@drip-apex/sdk";
 
const heroCopy = defineExperiment({
  slug: "homepage-hero-copy",
  name: "Homepage hero copy",
  variations: [
    { id: "control", weight: 0.5, isControl: true },
    {
      id: "proof-copy",
      weight: 0.5,
      mutations: [
        { selector: "[data-hero-title]", action: "text", text: "Trusted by growing teams" }
      ]
    }
  ]
});
 
init({
  experiments: [heroCopy],
  endpoint: "https://events.drip-apex.com"
});

Track your first conversion

ts
import { trackRevenue } from "@drip-apex/sdk";
 
trackRevenue(89.99, {
  orderId: "order-example-1001",
  currency: "EUR"
});

trackRevenue sends a goal event with the reserved __revenue__ goal ID for each active assignment.