Cookieless analytics for Next.js in 2 minutes

1. Install#

npm i @shipabase/js

NEXT_PUBLIC_SHIPABASE_KEY=SB-EU-xxxxxxxxxx

2. Call init once, on the client#

1"use client";2 3import { useEffect } from "react";4import { init } from "@shipabase/js";5 6export function Providers({ children }: { children: React.ReactNode }) {7  useEffect(() => {8    init(process.env.NEXT_PUBLIC_SHIPABASE_KEY!);9  }, []);10  return <>{children}</>;11}

Wrap {children} in app/layout.tsx with <Providers>. Never call init in a Server Component.

3. Track what matters#

1import { trackEvent } from "@shipabase/js";2 3trackEvent("project_created", { plan: "pro" });

• Name events in snake_case, object_verb, past tense: signup_completed, invoice_sent.
• 5 to 15 events is typical. Track actions, not every click.
• Keep props anonymous: plan, count, variant. Never emails or user IDs.

Why no cookie banner?#

The SDK stores nothing in the browser: no cookies, no localStorage. Visitors are counted with an anonymous hash that changes every day. See how visitors are counted for the details.