How to add analytics to a Replit app

Replit's built-in analytics vs VibeMetrics

Replit can show basic traffic for a published app: visitors, top pages and the sites that sent them. That tells you a Reddit post brought 50 visitors. It doesn't tell you whether any of them signed up or paid.

If you only want to know how many people visit, Replit's own numbers are enough. If you want to know which channel brings paying customers, read on.

Before you start

• An app built with Replit Agent, published on its live address (yourapp.replit.app or your own domain).
• A VibeMetrics account. Signing up is free and needs no card.

1. Add your app

In VibeMetrics, click "Add app". Give it a name, enter its published address (for example myapp.replit.app) and pick Replit as what you built it with.

2. Paste the install prompt into Replit Agent

VibeMetrics shows your personal prompt with your own site ID. Copy it and paste it into the Replit Agent chat. It looks like this:

Add website analytics to this app.

In index.html, inside <head>, add exactly these two lines and nothing else:

<script defer data-site="YOUR-SITE-ID" src="https://www.vibemetrics.app/s.js"></script>
<script>window.vm=window.vm||function(){(window.vm.q=window.vm.q||[]).push(arguments)};</script>

Rules:
- Add them once only. Do not add any other analytics tool, cookie banner or tracking code.
- Do not move or change any other code.
- If this project uses Next.js instead of index.html, add the same script in the root layout using next/script with strategy="afterInteractive", plus the second line as an inline script.

When done, tell me which file you changed.

Replit apps are often React with an Express server; the page Agent edits is usually client/index.html. If your app is Next.js, the prompt tells Agent to use the root layout instead. Either way, Agent tells you which file it changed.

3. Republish, then open your app

Changes in the editor only reach your live app after you republish. Republish, then open the published address in your browser. Within a few seconds, VibeMetrics shows "We see your app! ✅" with where that first visit came from.

Visits from the Replit editor's preview (addresses ending in replit.dev) aren't counted, so testing while you build doesn't fill your numbers with your own clicks.

4. See who signs up and who pays

Traffic is the start. On your app's Signups page, copy the signup prompt and paste it into Replit Agent. It is written for Supabase sign-in; if your app uses Replit Auth or another sign-in, ask Agent to call window.vm('track', 'signup') and then window.vm('identify', <the new user's ID>) right after a successful signup instead, and never to send the user's email or name.

Then open the Payments page and connect Stripe. From then on, every payment is matched to the visitor who made it, so your dashboard reads like: 50 visitors from Reddit, 4 signed up, 1 paid $29.

If nothing shows up

• Republish: the script only reaches your live app after a new publish.
• Open the published address, not the editor's preview.
• Check that the address matches the one you added. If your app also runs on a custom domain, add it in Settings.
• Ask Agent to show you the <head> of the page it changed; the two lines should be there once. The install page also has a fix-it prompt for this.