Zenovay
Next.js

Next.js Integration

Add Zenovay to Next.js

Use the built-in Script component for optimal loading. Works with App Router and Pages Router. Setup in under 2 minutes.

Get Started Free

App Router setup

Recommended for Next.js 13+ projects

1

Sign up for Zenovay

Create your free Zenovay account at auth.zenovay.com.

2

Copy your tracking script

In your Zenovay dashboard, go to Settings and copy your domain-specific tracking details.

3

Add the Script component to your layout

Import Script from next/script and add it to your root layout.tsx (App Router) or _app.tsx (Pages Router).

4

Verify installation

Run npm run dev, visit your site, and check your Zenovay dashboard. Data should appear within seconds.

Why Next.js developers choose Zenovay

SPA route tracking

Zenovay automatically tracks client-side navigation. No router integration or manual pageview calls needed.

Perfect Lighthouse scores

Under 1 KB script with afterInteractive loading. Zero impact on your Next.js performance metrics.

Works with static export

Using output: "export" for Vercel, Netlify, or Cloudflare Pages? Zenovay works perfectly with static builds.

Frequently asked questions

Should I use the Script component or a regular script tag?

Use the Next.js Script component with strategy="afterInteractive" for optimal loading. This ensures the tracking script loads after the page is interactive, giving you the best balance of performance and data accuracy.

Does it work with the App Router and Pages Router?

Yes. For the App Router, add the Script component to your root layout.tsx. For the Pages Router, add it to _app.tsx or _document.tsx. Both approaches work identically.

Does Zenovay track client-side route changes?

Yes. Zenovay automatically detects client-side navigation in Next.js single-page applications. Every route change is tracked as a new pageview without any additional configuration.

Will it affect my Lighthouse score?

No. The Zenovay script is under 1 KB and loads asynchronously. Using the Script component with afterInteractive strategy ensures it never blocks rendering or affects your Lighthouse performance score.

Can I use Zenovay with Next.js static exports?

Yes. Zenovay works perfectly with static Next.js exports (output: "export"). The tracking script loads client-side and communicates with the Zenovay API directly.

Add analytics to your Next.js app

One Script component. Automatic route tracking. Free plan included.

Get Started Free