> ## Documentation Index
> Fetch the complete documentation index at: https://docs.trevosdk.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Quickstart

> Install the SDK, read a variant, and record a conversion in about ten minutes.

By the end of this page your app will be assigning users to a variant and sending
conversions back to Trevo.

You need a workspace and its SDK key. The key is in **Settings → API keys** and looks like
`tsk_live_…`. It is publishable — it ships in your JavaScript bundle by design, and it
cannot read or change anything in your workspace.

## 1. Install

```bash theme={null}
npm install @trevosdk/browser
```

No bundler? Load the CDN build instead — it exposes a global called `Trevo`. Pin the exact
version in production:

```html theme={null}
<script src="https://cdn.trevosdk.com/browser/v0.2.4/trevo.min.js"></script>
```

## 2. Initialise

Once, as early as your app boots:

```ts theme={null}
import trevo from '@trevosdk/browser';

trevo.init({ apiKey: 'tsk_live_…' });
```

Call `identify()` when you know who the user is — usually right after login:

```ts theme={null}
trevo.identify(currentUser.id);
```

Identity decides which variant a user gets, so calling `identify()` later can move
someone from one variant to another. Call it as early as you can, and before rendering
anything you are testing.

## 3. Read a variant

```ts theme={null}
const variant = trevo.getVariant('checkout-cta');

if (variant === 'treatment') {
  // your alternate experience
} else {
  // your current experience
}
```

`getVariant()` is synchronous and does no network call — assignment is a local hash of
the user's identity and the experiment key. The same user always gets the same variant.

It returns `'control'` for an experiment key it does not recognise, so shipping this code
before the experiment exists in Trevo is safe.

Calling `getVariant()` also records an **exposure** — "this user saw this variant". That
is the denominator for your results, so only call it where the user genuinely sees the
thing. To read an assignment without recording an exposure:

```ts theme={null}
const variant = trevo.getVariant('checkout-cta', { trackExposure: false });
```

## 4. Record a conversion

Nothing is tracked automatically. A conversion exists only where you write one:

```ts theme={null}
trevo.track('purchase_completed', { value: 49.99, plan: 'pro' });
```

Events are batched and sent in the background, including on page unload. You do not need
to flush manually, though `trevo.flush()` exists if you want to force it.

## 5. Check it arrived

Open **Data → Events** in your workspace. Your event should appear within a few seconds.

If nothing shows up, see [No events arriving](/troubleshooting/no-events-arriving).

## What to do next

* **Using React?** [`install/react`](/install/react) has a provider and a hook that
  handle initialisation for you.
* **On Next.js?** [`install/nextjs`](/install/nextjs) resolves variants on the server
  so the first paint is already correct — no flash of the control version.
* **Tracking conversions on a backend?** [`install/node`](/install/node). Server-side
  events are immune to ad blockers and closed tabs, which improves the numbers for your
  browser experiments too.
* **Multiple variants?** `defineExperiment()` gives you a typed union and makes an
  unhandled variant a compile error. See [Browser API](/reference/browser-api).

## The whole thing

```ts theme={null}
import trevo from '@trevosdk/browser';

trevo.init({ apiKey: 'tsk_live_…' });
trevo.identify(currentUser.id);

const variant = trevo.getVariant('checkout-cta');
if (variant === 'treatment') {
  showNewCheckout();
} else {
  showCurrentCheckout();
}

// later, when the user converts
trevo.track('purchase_completed', { value: 49.99, plan: 'pro' });
```