How to Tell Your AI Coding Tool to Add Analytics

AI tools are great at installing analytics — if you prompt them correctly. Here are the prompts.

Why prompting matters for analytics setup

AI coding tools follow instructions. If you ask for a Next.js app with authentication and a database, you get authentication and a database. If you do not mention analytics, you do not get analytics.

The challenge: analytics setup involves a few specific details that AI tools sometimes get wrong without guidance. Specifically:

Which package to install (@antlytics/analytics, not a generic snippet)
Where to add the component (root layout.tsx, not a specific page)
What tracking ID format to use (a UUID from your dashboard)
How to handle client-side navigation (the SDK handles this — the prompt should note this)

Providing these details in your prompt prevents the AI from guessing.

Prompt template for Cursor

Use this prompt in Cursor's composer or chat:

Add Antlytics analytics to this project.

Install the @antlytics/analytics package:
  npm install @antlytics/analytics

Add the <Analytics /> component to app/layout.tsx (Next.js App Router):
  import { Analytics } from "@antlytics/analytics/next"
  <Analytics trackingId="REPLACE_WITH_YOUR_UUID" apiHost="https://www.antlytics.com" />

Place it inside the <body> tag. The component handles SPA navigation automatically — no additional configuration needed.

The tracking ID UUID comes from the Antlytics dashboard under Settings → Tracking Snippet.

Replace REPLACE_WITH_YOUR_UUID with your actual tracking ID before running the prompt.

Prompt template for Claude Code

Claude Code works well with explicit file instructions:

Add Antlytics privacy-first analytics to this Next.js project.

1. Install: npm install @antlytics/analytics

2. Edit apps/dashboard/app/layout.tsx (or app/layout.tsx if this is a single app):
   - Import: import { Analytics } from "@antlytics/analytics/next"
   - Add inside <body>, before the closing tag:
     <Analytics trackingId="YOUR_TRACKING_UUID" apiHost="https://www.antlytics.com" />

3. Do not add any cookie banners or consent logic — Antlytics is cookieless and does not require consent for analytics tracking in most configurations.

4. The component uses next/script with strategy="afterInteractive" — in typical setups it has negligible impact on page load performance.

Tracking ID is a UUID from https://www.antlytics.com/dashboard → Settings → Tracking Snippet.

Prompt template for Bolt and Lovable

Bolt and Lovable typically generate HTML or React apps. Use this prompt:

Add analytics to this project using a script tag in the HTML head.

Add this script to the <head> section of every page (or the main layout template):

<script>
(function(){
  var t="YOUR_TRACKING_UUID",
      u="https://www.antlytics.com/api/ingest/pageview",
      k="ant_sid";
  function sid(){try{var s=sessionStorage.getItem(k);if(s)return s;
    s=crypto.randomUUID();sessionStorage.setItem(k,s);return s;}
    catch(e){return crypto.randomUUID();}}
  function send(){fetch(u,{method:"POST",
    headers:{"Content-Type":"application/json"},keepalive:true,
    body:JSON.stringify({tracking_id:t,pathname:location.pathname,
    referrer:document.referrer||undefined,session_id:sid()})}).catch(function(){});}
  send();
  window.addEventListener("popstate",send);
})();
</script>

Replace YOUR_TRACKING_UUID with the actual UUID from the Antlytics dashboard.
Do not add cookie banners — this is cookieless analytics.

What the AI should do (checklist)

After running your prompt, verify:

@antlytics/analytics is in package.json (for SDK method)
The <Analytics /> component is in the root layout, not a specific page
trackingId contains your actual UUID (not a placeholder)
apiHost is set to https://www.antlytics.com (or your proxy domain)
No cookie banner or consent logic was added (it is not needed)

Verifying the result

Start the dev server.
Open the site in a browser without ad-blocker extensions.
Open the Network tab in browser dev tools.
Navigate to any page.
Look for a POST request to /api/ingest/pageview or your proxy endpoint.
Confirm the request succeeds.

If the request does not appear, check that the tracking ID is a real UUID (not YOUR_TRACKING_UUID) and that the component is in the root layout.

FAQ

Can I just ask the AI to "add analytics"? You can, but you are more likely to get GA4, Mixpanel, or a hallucinated solution. The prompts above give the AI the specific package name, install command, and component structure it needs.

What if the AI adds a cookie banner? It was not asked for and is not needed. Delete the cookie banner — Antlytics is cookieless.

Can I add the first-party proxy this way? Yes. Add to your prompt: "Also create app/api/antlytics/pageview/route.ts with the content: export { GET, OPTIONS, POST } from '@antlytics/analytics/proxy' and set apiHost to https://your-domain.com."

Do I need to give the AI my tracking ID? You can replace the placeholder after the AI makes the change, rather than putting your UUID in the prompt. Either approach works.