Sentry Integration
Guidelines for using Sentry for error monitoring and performance tracing.
Exception Catching
Use Sentry.captureException(error) in try/catch blocks:
javascripttry { await riskyOperation(); } catch (error) { Sentry.captureException(error); throw error; }
Performance Tracing
Create spans for meaningful actions like button clicks, API calls, and function calls.
UI Actions
javascriptfunction handleClick() { Sentry.startSpan( { op: "ui.click", name: "Submit Form" }, (span) => { span.setAttribute("formId", formId); submitForm(); } ); }
API Calls
javascriptasync function fetchData(id) { return Sentry.startSpan( { op: "http.client", name: `GET /api/items/${id}` }, async () => { const response = await fetch(`/api/items/${id}`); return response.json(); } ); }
Configuration (Next.js)
Sentry initialization files:
sentry.client.config.ts- Client-sidesentry.server.config.ts- Server-sidesentry.edge.config.ts- Edge runtime
Import with import * as Sentry from "@sentry/nextjs" - no need to initialize in other files.
Basic Setup
javascriptimport * as Sentry from "@sentry/nextjs"; Sentry.init({ dsn: process.env.NEXT_PUBLIC_SENTRY_DSN, enableLogs: true, });
With Console Logging
javascriptSentry.init({ dsn: process.env.NEXT_PUBLIC_SENTRY_DSN, integrations: [ Sentry.consoleLoggingIntegration({ levels: ["log", "warn", "error"] }), ], });
Structured Logging
Use logger.fmt for template literals with variables:
javascriptconst { logger } = Sentry; logger.trace("Starting connection", { database: "users" }); logger.debug(logger.fmt`Cache miss for: ${userId}`); logger.info("Updated profile", { profileId: 345 }); logger.warn("Rate limit reached", { endpoint: "/api/data" }); logger.error("Payment failed", { orderId: "order_123" }); logger.fatal("Connection pool exhausted", { activeConnections: 100 });

