# Vercel v0
> Add the Attrifast snippet to a v0 app — one prompt or a three-line layout edit with next/script — deploy to Vercel, and see your first pageview.
Last updated: 2026-08-15
Canonical: https://attrifast.com/docs/vercel-v0
[v0](https://v0.dev) generates Next.js apps, and Next.js has a first-class way to load an analytics script: the `Script` component in the **root layout**, so every route tracks. You can prompt v0 to do it, or paste three lines yourself.
Event collection requires an active subscription or trial — start the 7-day free trial during onboarding (no charge today, cancel anytime). On the free plan, the verify step below won't light up because events aren't collected.
## Step 1 — Get your snippet
Add your site in Attrifast (onboarding step 1, or the dashboard), then open onboarding step 2 **"Install script"**, or **Dashboard → Settings → Install script**. Your tracking ID starts with `af_`.
## Step 2 — Add it to the app
Paste this into v0, replacing the tracking ID with yours:
```text
Add Attrifast analytics to this app. In app/layout.tsx, import Script from
"next/script" and render inside the root layout:
Rules: root layout only (not a page component), keep the data-tracking-id
attribute exactly as given, add it once. Confirm the file you changed.
```
In `app/layout.tsx`:
```tsx
import Script from 'next/script';
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
{children}
);
}
```
The `data-tracking-id` attribute passes through `next/script` untouched — that's how the tracker finds its configuration. Client-side route changes are tracked automatically.
## Step 3 — Deploy and verify
Deploy through Vercel (or v0's deploy button) — the script only runs on the deployed site. Then open your live app: the **Verify installation** status in Attrifast onboarding flips to *"First pageview received — tracking is live."*, usually within a minute.
The domain registered in Attrifast must match the domain the app is served from — a `*.vercel.app` preview domain and your production domain are different sites to the tracker. Register the domain you actually care about, and add extras under **Dashboard → Settings → General → Allowed hostnames**.
## If nothing shows up
Check DevTools on the deployed site: you should see `af.js` load and a request to `/api/collect`. The usual suspects — the `Script` ended up in one page instead of the root layout (only that route tracks), the import from `next/script` is missing, or the change was never deployed.