GET STARTED
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.
v0 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
Option A: prompt v0
Paste this into v0, replacing the tracking ID with yours:
Add Attrifast analytics to this app. In app/layout.tsx, import Script from
"next/script" and render inside the root layout:
<Script defer data-tracking-id="YOUR_TRACKING_ID" src="https://api.attrifast.com/af.js" />
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.
Option B: edit the layout yourself
In app/layout.tsx:
import Script from 'next/script';
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<body>
{children}
<Script defer data-tracking-id="YOUR_TRACKING_ID" src="https://api.attrifast.com/af.js" />
</body>
</html>
);
}
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.