Monitoring & Error Tracking

What you instrument

Errors — Sentry / Datadog / Bugsnag for thrown exceptions in Server Components, Server Actions, and Client Components alike.
Performance — Web Vitals (LCP, CLS, INP) per page; Vercel Speed Insights or your own reporter.
Logs — structured logs from console calls; pipe them into your log aggregator.

The instrumentation file

instrumentation.ts at the root runs once when the server starts. Use it to initialize Sentry / OpenTelemetry / any monitoring SDK once at boot. Stable since Next.js 15.

Instrument outcomes before incidents: structured logs with request and release IDs, traces across external calls, error reports with source maps, and Web Vitals by route and device. Define alert ownership and a small set of symptoms tied to user impact. Collecting everything is not observability. High-cardinality fields, personal data, noisy alerts, and unbounded retention increase cost while hiding the signal. A dashboard no one owns is decoration.

Trigger a controlled server error, client error, slow dependency, and degraded interaction in a preview deployment. Follow each signal from the user's route to the release and trace, verify redaction, and confirm the alert reaches an owner with a useful runbook.

Code

Sentry setup wizard·bash

npx @sentry/wizard@latest -i nextjs
# Wizard creates instrumentation.ts, sentry.client.config.ts,
# sentry.server.config.ts, and updates next.config.ts.

Vercel Analytics + Speed Insights·tsx

// app/layout.tsx
import { Analytics } from '@vercel/analytics/react';
import { SpeedInsights } from '@vercel/speed-insights/next';

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html><body>
      {children}
      <Analytics />
      <SpeedInsights />
    </body></html>
  );
}

instrumentation.ts boot hook·ts

// instrumentation.ts
export async function register() {
  if (process.env.NEXT_RUNTIME === 'nodejs') {
    await import('./lib/sentry.server');
  }
  if (process.env.NEXT_RUNTIME === 'edge') {
    await import('./lib/sentry.edge');
  }
}

What you instrument

The instrumentation file

Code

External links

Exercise

Progress

Comments 0