# Install OakData in 4 steps

> Go from zero to live analytics in a few minutes: create a project, drop in the snippet, identify your users, and watch the first events land.

Source: https://oakdata.co/docs/install

---

OakData is one small snippet plus, optionally, a call to say who each visitor is. This page is the quickest path from an empty project to real data in your dashboard. Prefer your framework's guide? Jump straight to it:[Next.js](https://oakdata.co/docs/quickstart/nextjs)[React](https://oakdata.co/docs/quickstart/react)[Vue](https://oakdata.co/docs/quickstart/vue)[Script tag](https://oakdata.co/docs/quickstart/script)[Server-side](https://oakdata.co/docs/quickstart/server)

In a hurry? Hand the whole setup to your AI coding agent - paste this and give it your public key when asked:

**Prompt for a coding agent:**

```
Add OakData product analytics to this site.

1. Install the SDK with 'npm i oakdata-js', then import it and call oak.init('<my public key, starts with oak_pub_>', { api_host: 'https://oakdata.co' }) once, as early as possible. Use the framework-native place for setup code (e.g. Next.js instrumentation-client.ts, or a root layout). For a backend, use the oakdata-node package instead.
2. If the site has a login flow, call oak.identify(user.id, { email: user.email }) when the user resolves, and oak.reset() on logout.
3. Don't add any other analytics providers, and show me the changes before applying them.

Ask me for the public key value if you don't already have it.
```

## The four steps

### Create a project and copy your key

In the [OakData dashboard](https://oakdata.co/app/projects), create a project for your site. Open its settings and copy the **public key** - it starts with `oak_pub_` and is safe to ship in the browser.

> **Two keys, two jobs** Public keys (`oak_pub_…`) can only *write* events and belong in your site. Secret keys (`oak_sec_…`) stay on your server and are the only keys that can *read* data back through the [REST API](https://oakdata.co/docs/api/rest) and [MCP server](https://oakdata.co/docs/api/mcp).

### Add the SDK to your site

Install the package, then initialise it once as early as possible - or follow your framework's guide above for the exact place to put it:

**terminal**

```bash
npm i oakdata-js
```

**app entry**

```ts
import oak from 'oakdata-js'

oak.init('oak_pub_xxxxxxxxxxxxxxxxxxxxxxxx', {
  api_host: 'https://oakdata.co',
})
```

That boots the tracker: pageviews fire on load and [autocapture](https://oakdata.co/docs/sdk/autocapture) records clicks and form submits. No build step? Load it from a [CDN via a script tag](https://oakdata.co/docs/quickstart/script) instead. Capturing events from your backend? Use [oakdata-node](https://oakdata.co/docs/quickstart/server).

### Identify your users (recommended)

Once someone signs in, tell OakData who they are. Their earlier anonymous activity is stitched onto the identified profile - see [identity resolution](https://oakdata.co/docs/concepts/identity).

**on sign-in**

```ts
oak.identify(user.id, { email: user.email, name: user.name })

// …and on sign-out:
oak.reset()
```

### Watch the first events land

Load a page on your site, then open **Live** in the dashboard. Your visit should appear within a second or two, with its country, device, and page. That's it - you're tracking.

> **Nothing showing up?** A wrong key, localhost, or an ad-blocker can all swallow events. Work through [Not seeing data](https://oakdata.co/docs/troubleshooting/no-data) - it covers each cause in order.

## Where to next

- [Filter your data](https://oakdata.co/docs/using/filters) - Slice any report down to the visitors that matter.

- [Events & properties](https://oakdata.co/docs/concepts/events) - Understand what OakData captures and how to add your own.

- [Connect an AI agent](https://oakdata.co/docs/api/mcp) - Let Claude or Cursor read your analytics over MCP.

- [SDK reference](https://oakdata.co/docs/sdk/reference) - Every method and init option in one place.