# Quickstart (/docs/quickstart)
The dashboard copies a single script tag. The framework examples below set the same attributes. Replace `YOUR_SITE_ID` with the project id and `YOUR_WRITE_KEY` with the `dbw_` secret shown once when you create the site.
### Sign up [#sign-up]
Create an account at [databob.dev/sign-up](https://databob.dev/sign-up). Sign-in is Clerk. Organizations and billing are off. The first sign-in creates a free org. If the Clerk webhook is late, the dashboard creates that same org once. A deleted account is not created again.
### Add a site [#add-a-site]
Open [Overview](https://databob.dev/dashboard). Create a project with a name, an `https` site URL, and an optional goal event name.
The site URL allows that host and its `www` counterpart. `https://example.com` also allows `https://www.example.com`, and the other way around. The write key is shown once. Rotating it makes the old key stop working immediately. The key starts with `dbw_`. It is not a data API key.
### Install the snippet [#install-the-snippet]
Paste the tag on the site whose origin you just allowed. The script will not send a pageview from a different origin.
The dashboard copies this exact tag. `YOUR_SITE_ID` and `YOUR_WRITE_KEY` are placeholders until the secret is on screen.
```html title="index.html"
```
```tsx title="app/databob.tsx" {9}
import Script from "next/script";
export function Databob() {
return (
);
}
```
`dataset.key` becomes the `data-key` attribute the tracker reads.
```tsx title="databob.tsx" {9}
import { useEffect } from "react";
export function Databob() {
useEffect(() => {
const script = document.createElement("script");
script.async = true;
script.src = "https://databob.dev/databob.js";
script.dataset.site = "YOUR_SITE_ID";
script.dataset.key = "YOUR_WRITE_KEY";
script.dataset.collect = "https://us-ingest.databob.dev/v1/collect";
script.dataset.config =
"https://savory-yak-367.convex.site/v1/consent/YOUR_SITE_ID";
script.dataset.choices = "https://databob.dev";
document.head.appendChild(script);
return () => {
script.remove();
};
}, []);
return null;
}
```
```js title="install.js" {5}
const script = document.createElement("script");
script.async = true;
script.src = "https://databob.dev/databob.js";
script.setAttribute("data-site", "YOUR_SITE_ID");
script.setAttribute("data-key", "YOUR_WRITE_KEY");
script.setAttribute("data-collect", "https://us-ingest.databob.dev/v1/collect");
script.setAttribute(
"data-config",
"https://savory-yak-367.convex.site/v1/consent/YOUR_SITE_ID",
);
script.setAttribute("data-choices", "https://databob.dev");
document.head.appendChild(script);
```
### See the first pageview [#see-the-first-pageview]
Open the site and watch the network request to `https://us-ingest.databob.dev/v1/collect`. A stored anonymous pageview responds `202` with `{ "stored": true }`.
That pageview is cookieless. It stores the path, the content id (the path, because the script does not send `content_id`), the country, and a device class. It does not store an IP address, the full user agent, an email, or a visitor id.
The dashboard does not chart it. Realtime, Pages, and Sources stay empty until those reports exist. Counts are on the [data API](/docs/data-api), from a snapshot rebuilt daily at 04:00 UTC. Until a snapshot exists, each item is `views: 0`, `previous_views: 0`, and `enough_data: false`. `GET /v1/reports/content` records the content id so the next rebuild refreshes it.
The first pageview does not include the referrer or the campaign. Turn enhanced analytics on under Consent, and a visitor has to accept the current version, before those fields are stored. [Consent and the banner](/docs/consent) explains the categories.