Appearance
Next.js
Install
sh
npx simpledatalogs initThe command finds your Next.js app, adds the key to .env.local, writes instrumentation-client.ts, shows you the diff first, and sends a test event. Then install the package:
sh
npm install simpledatalogsOr by hand
sh
# .env.local
NEXT_PUBLIC_SIMPLEDATALOGS_KEY=sdl_pub_…ts
// instrumentation-client.ts (next to app/, or in src/)
import { init } from 'simpledatalogs'
init({ key: process.env.NEXT_PUBLIC_SIMPLEDATALOGS_KEY, autocapture: true })instrumentation-client runs in the browser before your app (Next.js 15.3 or later). On older versions, call init() once in a client component rendered by your root layout.
Send everything, or only what you choose
- Everything:
autocapture: true, as above. - Only your own events: leave
autocaptureout and calltrack():
ts
import { init } from 'simpledatalogs'
export const sdl = init({ key: process.env.NEXT_PUBLIC_SIMPLEDATALOGS_KEY })
sdl.track('signup', { plan: 'pro' })In the first minute
session_start, then apage_viewwithpath,title,referrerand anyutm_*parameters.- A
page_viewfor every client-side navigation (<Link>,router.push, back and forward). - Uncaught errors and unhandled promise rejections on the Logs tab, with their stack.
Autocapture defaults
| Feature | autocapture: true |
|---|---|
| Page views (App and Pages Router navigation) | on |
Sessions (session_id, 30 idle minutes) | on |
| Errors and unhandled rejections | on |
| Outbound link clicks | off (autocapture: { outboundLinks: true }) |
| Do Not Track / Global Privacy Control | respected: nothing automatic is sent |
No cookies: the session id lives in sessionStorage. Every option is in the JavaScript SDK reference.