Skip to main content
Analytics tell you what people actually do in your app. In this repo, analytics are provider-agnostic — the app sends the same events to one or multiple providers without changing any feature code.

​
What You Get Out of the Box

The analytics system is already wired up with:
  • An analytics provider loaded at the app root
  • Shared event helpers: trackAnalyticsEvent(), trackAnalyticsPageview(), identifyAnalyticsUser()
  • Support for one provider, multiple providers, or none at all
  • A clean disabled mode with none
Your app code never calls PostHog, Plausible, or DataFast directly. It uses the shared helpers and the right provider gets the data.
Meta Ads attribution is separate from this analytics layer. If you need Meta Pixel + Conversions API checkout tracking, read the Meta Ads guide instead.

​
Pick Your Provider

Best for: Full product analytics, event tracking, and advanced features like session replay and feature flags.
NEXT_PUBLIC_ANALYTICS_PROVIDER=posthog
NEXT_PUBLIC_POSTHOG_KEY=your-posthog-key
NEXT_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com
PostHog is the most full-featured option. If you only want one analytics tool and you want it to grow with you, pick this.

​
Using Multiple Providers

Want more than one? Just comma-separate them: 
NEXT_PUBLIC_ANALYTICS_PROVIDER=posthog,datafast
Want none? Set it to: 
NEXT_PUBLIC_ANALYTICS_PROVIDER=none
If you’re just getting started, pick one provider first. Get it working, then add a second one later if you need it.

​
Setup

1

Create a provider account

Sign up with PostHog, Plausible, or DataFast and create a project/site.
2

Copy your credentials

Grab the API keys, script URLs, or website IDs from your provider dashboard.
3

Add env vars

Add the provider-specific env vars to .env.local (see the tabs above for exact values).
4

Restart and browse

Restart your dev server, open the app, and browse a few pages.
5

Check the dashboard

Confirm that pageviews and events appear in your provider’s dashboard.

​
Key Files

  • lib/analytics/head-scripts.tsx — script injection
  • lib/analytics/provider.tsx — the root analytics provider
  • lib/analytics/client.ts — shared event helpers
  • lib/analytics/providers/* — provider-specific implementations

​
Verify It Works

Your analytics setup is working if:
  • The provider script loads in the browser
  • Pageviews appear in the dashboard
  • Custom events appear after you trigger tracked actions
Make sure NEXT_PUBLIC_ANALYTICS_PROVIDER is exactly posthog, plausible, datafast, or none. Any typo silently disables analytics.
Next.js doesn’t pick up new env vars until you restart the dev server.
Your NEXT_PUBLIC_PLAUSIBLE_DOMAIN must match the site you created in Plausible exactly.
Without NEXT_PUBLIC_DATAFAST_WEBSITE_ID, DataFast won’t know which site to track.

Meta Ads

Need checkout attribution for Meta campaigns? That’s a separate system — read the Meta Ads guide.