Setting Up Sentry for Next.js: A Step-by-Step Guide

Sentry + Next.js: Complete Setup Guide

Error monitoring is essential for any production application. Here's how to set up Sentry with Next.js 15.

Step 1: Install the Package

pnpm add @sentry/nextjs

Step 2: Configure Sentry

Create sentry.client.config.ts, sentry.server.config.ts, and sentry.edge.config.ts:

import * as Sentry from "@sentry/nextjs";

Sentry.init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
  tracesSampleRate: 1.0,
  debug: false,
});

Step 3: Add Environment Variables

NEXT_PUBLIC_SENTRY_DSN=https://your-dsn@sentry.io/your-project
SENTRY_ORG=your-org
SENTRY_PROJECT=your-project
SENTRY_AUTH_TOKEN=your-token

Step 4: Deploy

Sentry will automatically upload source maps during build. Errors in production will have full stack traces.