Dirstarter uses two analytics tools for different purposes:

1. PostHog - For user behavior tracking and event analytics
2. Plausible - For privacy-friendly website analytics

While they are recommended, you can use any other analytics tool you want.

PostHog

PostHog is used for detailed user behavior tracking and event analytics. It's particularly useful for:

• Tracking user interactions (clicks, form submissions)
• Monitoring conversion rates
• Analyzing user flows
• Custom event tracking

Setup

1. Create a PostHog account at posthog.com
2. Create a new project
3. Get your API key from Project Settings > Project API Key
4. Add the following environment variables:

NEXT_PUBLIC_POSTHOG_API_KEY=your_api_key
NEXT_PUBLIC_POSTHOG_HOST=https://app.posthog.com

Configuration

PostHog is configured with the following settings:

posthog.init(env.NEXT_PUBLIC_POSTHOG_API_KEY, {
  ui_host: env.NEXT_PUBLIC_POSTHOG_HOST,
  api_host: "/_proxy/posthog/ingest",
  person_profiles: "identified_only",
  capture_pageview: false,
  capture_pageleave: true,
})

Usage

The boilerplate automatically tracks:

• Page views (via PosthogPageview component)
• External link clicks
• Newsletter subscriptions
• Tool submissions
• Stripe checkout events

To track custom events:

import { posthog } from "posthog-js"
 
// Track an event
posthog.capture("event_name", {
  property1: "value1",
  property2: "value2"
})

Plausible

Plausible is used for privacy-friendly website analytics. It's particularly useful for:

• Basic website traffic metrics
• Page view statistics
• Visitor demographics
• No cookie consent required

Setup

1. Create a Plausible account at plausible.io
2. Add your website
3. Get your domain and API key
4. Add the following environment variables:

NEXT_PUBLIC_PLAUSIBLE_DOMAIN=your-domain.com
NEXT_PUBLIC_PLAUSIBLE_URL=https://plausible.io
PLAUSIBLE_API_KEY=your_api_key

Usage

The boilerplate automatically includes the Plausible script in the root layout:

<Script
  defer
  data-domain={env.NEXT_PUBLIC_PLAUSIBLE_DOMAIN}
  src={`${env.NEXT_PUBLIC_PLAUSIBLE_URL}/js/script.js`}
/>

Admin Dashboard Integration

The admin dashboard includes an analytics card that shows:

• Total visitors (30-day period)
• Average daily visitors
• Visitor trends

Why Two Separate Tools?

The boilerplate uses both tools for different purposes:

• PostHog: Detailed user behavior tracking, conversion monitoring, and custom event tracking
• Plausible: Privacy-friendly basic analytics that don't require cookie consent

This combination provides:

1. Comprehensive analytics for business insights (PostHog)
2. Privacy-friendly basic metrics (Plausible)
3. GDPR compliance through Plausible's cookie-free approach
4. Detailed user behavior analysis through PostHog