# Examples

Three smallest-possible integrations. All talk to `https://app.nisebookings.com` and work with a
[sandbox](../08-sandbox.md) key, so you can try them without touching a real account.

| File | What it shows |
|---|---|
| [`embed.html`](embed.html) | The widget on a page: script tag + `<nise-booking>` + `<nise-events>`, one CSS token override. Replace `YOUR_PUBLIC_KEY`. |
| [`headless.mjs`](headless.mjs) | The REST flow without the widget: `services` → `slots` → `quote` → `bookings`. Node 18+, no dependencies. |
| [`nextjs/`](nextjs/README.md) | A complete Next.js app with both paths — the widget in a client component and an own UI on the API (server-side catalogue, slots, booking, 409 handling). Explained step by step in [`../11-nextjs.md`](../11-nextjs.md). |

None of the examples contains credentials; all take your public key from an environment variable or a
literal placeholder.

## Get a test key

```bash
curl -s -X POST https://app.nisebookings.com/api/sandbox   # → {publicKey, apiKey, expiresAt, …}
```

Use the `publicKey` below. A sandbox lives 24 hours, never delivers mail and fakes Mollie payments;
see [`08-sandbox.md`](../08-sandbox.md).

## Run the widget example

Replace `YOUR_PUBLIC_KEY` in `embed.html` with the sandbox `publicKey` (or, later, your own key from
**Instellingen → Insluiten**), then open the file from any web server, for example:

```bash
python3 -m http.server 8899   # in the folder that holds embed.html, then open /embed.html
```

A sandbox accepts every origin. On a real account, the site that embeds the widget must be in
**Toegestane websites**, or that list must be empty.

## Run the headless example

```bash
KEY=<public key> node headless.mjs
```

Options (environment variables): `KEY` (required), `API` (default `https://app.nisebookings.com`),
`GATEWAY` (`local` by default, `mollie` to create a checkout — set the `returnUrl` line in the
script first), `EMAIL`.

The script creates **one real booking** in the account behind the key. With `GATEWAY=local` it stays
pending at the desk; with `mollie` it returns a checkout URL (on a sandbox: the fake checkout page).
Everything before `POST /bookings` is read-only. On a sandbox, read the confirmation mail it would
have sent via `GET /api/v1/outbox`.

## What these examples deliberately do not show

- Authentication — the public API has none beyond the public key.
- Payment webhooks and return polling — see
  [`04-public-api.md`](../04-public-api.md#payment-lifecycle) and the widget's built-in handling.
- Configuring the account from code — see the [management API](../../api/README.md) and
  [webhooks](../10-webhooks.md).
