Add analytics to Next.js in five minutes
Install @dumbledor/sdk, wire the provider, and track pageviews plus custom events without touching your ingest API keys in the browser.
Next.js App Router makes it easy to ship fast. Analytics should not be the part that slows you down. The @dumbledor/sdk package wraps our browser tracker with typed helpers for React and server components.
Install and configure
Run npm install @dumbledor/sdk, then wrap your root layout with DumbledorProvider and pass your project website ID from the dashboard. Pageviews fire automatically on route changes in the App Router.
Track custom events
Call useDumbledor().track() inside client components for signup, checkout, or feature usage. On the server, import track from @dumbledor/sdk/server for API route or webhook events that should never touch the client.
Keep secrets off the client
The website ID is safe to expose. Query API keys stay on the server. Splitting client and server entry points means you get type safety without leaking credentials into the bundle.