Next.js SDK
Install @errtap/next and capture errors on both sides of a Next.js app — the server via instrumentation.ts, the browser via instrumentation-client.ts.
Install
npm i @errtap/next@errtap/next is two thin wrappers: @errtap/next/server wraps @errtap/node, and
@errtap/next/client wraps @errtap/browser. Initialise both to cover Server Components,
Route Handlers, and everything that runs in the browser.
Server — instrumentation.ts
Next.js calls register() once per server boot:
// instrumentation.ts
import { init } from '@errtap/next/server';
export async function register() {
init({
dsn: process.env.ERRTAP_DSN!, // https://et_…@host
environment: process.env.NODE_ENV,
release: process.env.VERCEL_GIT_COMMIT_SHA,
});
}Browser — instrumentation-client.ts
Requires Next.js 15.3+. The file runs before your app hydrates:
// instrumentation-client.ts
import { init } from '@errtap/next/client';
init({
dsn: process.env.NEXT_PUBLIC_ERRTAP_DSN!,
environment: process.env.NODE_ENV,
});The browser side needs a NEXT_PUBLIC_-prefixed env var — DSN keys are write-only, so
exposing one to the client is by design.
Manual capture
Import from the side you're on:
import { captureException, captureMessage, logger } from '@errtap/next/server';
// or '@errtap/next/client' in Client Components
logger.info('checkout started', { cartId });
try {
await chargeCard();
} catch (err) {
captureException(err as Error, { tags: { flow: 'checkout' } });
throw err;
}Options
| Field | Type | Description |
|---|---|---|
dsn | string | URL DSN (https://et_…@host) or bare key (requires endpoint) |
endpoint | string | Override ingest URL; optional when dsn is a URL DSN |
environment | string | e.g. production, preview |
release | string | Ties errors to a deploy — pair with release tracking |
tags | Record<string, unknown> | Attached to every event |