analytics

Count page views and button clicks, and send them to the analytics service you choose.

Analytics & errorsClientBuilt onGoogle AnalyticsPlausiblePostHog

What it is

@kitr/analytics is four calls: page, track, identify and reset. Declare your events once, call track anywhere, and every configured adapter gets it. Page views are counted on each route change, and calls wait until the visitor agrees through consent.

Runs in the browser. For server-side events, write to your database or send from a job. For errors, use monitoring.

Install

kitr add analytics

First time? Run npm i -g @kitr/kitr once. Inside a project, the global kitr runs your project's own version.

Adds @kitr/analytics, its provider, config/analytics.ts and app/analytics.ts for your events. Every change.

Quick start

Declare the events your app sends, with their props:

// app/analytics.ts
import type { EventMap } from '@kitr/analytics'

export interface AppEvents extends EventMap {
  'sign-in.completed': { method: 'password' | 'oauth' }
  'project.created': { id: string }
}

Track one after the thing happened:

// app/features/projects/new-project-button.tsx
import { useAnalytics } from '@kitr/analytics/react'
import type { AppEvents } from '#app/analytics'

export function NewProjectButton({ onCreate }: { onCreate: () => Promise<{ id: string }> }) {
  const analytics = useAnalytics<AppEvents>()
  return (
    <button
      type="button"
      onClick={async () => {
        const project = await onCreate()
        analytics.track('project.created', { id: project.id })
      }}
    >
      New project
    </button>
  )
}

With no adapter configured, the console shows [analytics] track project.created { app: 'acme', id: 'prj_42' }. Set VITE_PLAUSIBLE_DOMAIN (or VITE_GA_MEASUREMENT_ID) and the same click reaches Plausible (or Google Analytics). Next in the guide: Track your first event.

Built on

@kitr/analytics is a thin adapter layer. Each adapter speaks to one vendor's script or API:

Adapter Vendor docs
Google Analytics 4 GA4 collection guide
Plausible Plausible docs
PostHog PostHog JavaScript library

kitr adds typed events, page view tracking, the consent queue, error wrapping around vendor calls and a memory adapter for tests.

Problems it solves

Further reading