Next.js Event Tracking

Track signups, payments, and custom events from your Next.js app. Works in App Router server actions, route handlers, and pages API routes.

Install

bash

npm install logit

Initialize

Create a shared client in lib/logit.ts:

import { init } from "logit";

export const logit = init({ token: process.env.LOGIT_API_KEY! });

In a server action

// app/actions/signup.ts
"use server";

import { logit } from "@/lib/logit";

export async function signupAction(formData: FormData) {
  const email = formData.get("email") as string;

  // ... create user in DB

  await logit.now("signups", {
    event: "New user signed up",
    description: `${email} just created an account`,
    icon: "👤",
    notify: true,
    tags: { source: "landing-page" },
    metadata: { email },
  });
}

In a route handler

// app/api/webhook/route.ts
import { NextResponse } from "next/server";
import { logit } from "@/lib/logit";

export async function POST(req: Request) {
  const body = await req.json() as { type: string; email: string };

  await logit.now("events", {
    event: body.type,
    description: body.email,
    icon: "📦",
    notify: false,
  });

  return NextResponse.json({ ok: true });
}

Environment variable

bash

# .env.local
LOGIT_API_KEY=lk_live_xxxxxxxxxxxxxxxx

Tip: Never import your LogIt client in "use client" components. The API key must stay server-side.

Logit

Next.js

Install

Initialize

In a server action

In a route handler

Environment variable

More integrations