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

# Quickstart

> Add Aptly data to your app in under 5 minutes. One script tag, copy-paste example, working code.

Add one script tag to your HTML `<head>`:

```html theme={null}
<script src="https://preview.getaptly.com/api/ai/app-builder/sdk.js"></script>
```

That's the entire install. `window.aptly` is ready immediately after the tag.

***

## Copy-paste starting point

This is a complete working app. Replace `BOARD_ID` with your config variable name and fill in the render logic.

```html theme={null}
<!DOCTYPE html>
<html>
<head>
  <script src="https://preview.getaptly.com/api/ai/app-builder/sdk.js"></script>
</head>
<body>
  <div id="app">Loading…</div>

  <script>
    async function init() {
      // Request a token — use version: 2 for structured error handling
      const { token, error } = await aptly.requestToken({ version: 2 });

      if (error?.code === 'RATE_LIMITED') {
        console.warn(error.message);
        setTimeout(init, error.retryAfterMs);
        return;
      }
      if (!token) {
        document.getElementById('app').textContent = 'Could not connect to Aptly.';
        return;
      }

      // aptly.config holds admin-declared variables (board IDs, thresholds, etc.)
      const boardId = aptly.config.BOARD_ID;

      // aptly.fetch is auth-aware — auto-retries on 401, prepends the API base URL
      const res     = await aptly.fetch('/board/' + boardId + '?page=0');
      const { records } = await res.json();

      // render your data
      document.getElementById('app').textContent =
        'Loaded ' + records.length + ' records for ' + aptly.org.name;
    }

    init();
  </script>
</body>
</html>
```

***

## Testing before your app is embedded in Aptly

Get a **dev token** from **Settings → Profile → Developer Tools** (your Aptly admin must grant you the Developer Tools permission first).

Paste this block right after the SDK script tag. Remove it before you ship.

```html theme={null}
<script src="https://preview.getaptly.com/api/ai/app-builder/sdk.js"></script>

<!-- DEV ONLY — remove before deploy -->
<script>
  aptly.startEmulation('PASTE_DEV_TOKEN_HERE', {
    config: { BOARD_ID: 'lease' }   // override config for local testing
  }).then(init);
</script>
```

`startEmulation` verifies the token against the Aptly API and populates `aptly.user`, `aptly.org`, and `aptly.config` with real data — the same values your app will see when embedded. Tokens can be issued with up to 7-day expiry.

> **Note:** When your app runs inside Aptly, the SDK ignores `startEmulation` entirely — the live postMessage context always takes priority.

***

## What's in `window.aptly`

```js theme={null}
aptly.org.id          // logged-in user's company ID
aptly.org.name        // company display name
aptly.user.email      // logged-in user's email
aptly.user.firstName
aptly.user.lastName
aptly.user.role       // role name assigned in this org
aptly.user.teams      // array of team IDs
aptly.config          // admin-declared config variables — read any key directly
aptly.board           // { id, schema } if the app is embedded as a board tab, else null
```

For the full reference — all properties, config scoping rules, URL param testing — see the [SDK Reference](/aptly-sdk-reference).

***

## Next steps

* **Deploy to Replit** — publish your app, then paste the URL into an Aptly board tab or dashboard panel
* **Declare config variables** — add fields like `BOARD_ID` in the app store admin panel so users can configure them on install
* **UI actions** — use `aptly.openEmailComposer()`, `aptly.createCard()`, `aptly.createTask()`, and other named methods to trigger actions in the parent Aptly window. Actions are gated by `aptly.actions` (admin-configured allowlist)
* **Full API reference** — [Delegate Tokens](/delegate-tokens) covers server-side token exchange, scopes, and advanced auth patterns
