mcpField
A
adding-error-tracking

adding-error-tracking

github.com/revitalb-portDevelopment058 installsUpdated 10w ago
Repository

About adding-error-tracking

A skill for adding Sentry error tracking, crash reporting, exception monitoring, and performance tracing to supported application stacks. It guides setup from framework detection through SDK initialization, source maps, and verification.

Key features

  1. 01Detects the application framework
  2. 02Installs framework-specific Sentry SDKs
  3. 03Configures initialization and environment variables
  4. 04Adds error boundaries and source maps
  5. 05Tests events in the Sentry dashboard

Use cases

  1. 01Add exception monitoring to an application
  2. 02Configure Sentry tracing for a web app
  3. 03Verify error reporting before release

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/revitalb-port/skills-registry-demo --skill adding-error-tracking

After installing, type/adding-error-trackingin Claude Code to confirm it loaded.

Details

From the project README

Add Error Tracking (Sentry)

Use this skill when the user asks to add error tracking, crash reporting, exception monitoring, or performance tracing.

Steps

  1. Detect the framework — check package.json, config files, and directory structure to determine the stack (Next.js, React, Node.js, Python/Django/Flask, etc.).

  2. Install the SDK

    • Next.js: npx @sentry/wizard@latest -i nextjs
    • React (Vite): npm install @sentry/react
    • Node.js: npm install @sentry/node
    • Python: pip install sentry-sdk

  3. Initialize Sentry

    • For Next.js, the wizard creates sentry.client.config.ts, sentry.server.config.ts, and sentry.edge.config.ts. Verify they exist and contain the DSN.

    • For React (Vite), init in main.tsx:

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

Sentry.init({
  dsn: import.meta.env.VITE_SENTRY_DSN,
  integrations: [Sentry.browserTracingIntegration()],
  tracesSampleRate: 1.0,
});

    • For Node.js, init at the very top of the entry file before any other imports.

  4. Add environment variables

    NEXT_PUBLIC_SENTRY_DSN=https://[email protected]/...
SENTRY_AUTH_TOKEN=sntrys_...
SENTRY_ORG=your-org
SENTRY_PROJECT=your-project

  5. Add error boundary — wrap the app (or critical subtrees) with Sentry.ErrorBoundary and a fallback UI.

  6. Source maps — for production builds, configure the Sentry webpack/vite plugin to upload source maps. For Next.js, this is handled by withSentryConfig in next.config.js.

  7. Test the integration — add a temporary button that throws an error to verify events appear in the Sentry dashboard.

Notes

  • Set tracesSampleRate to a lower value (e.g. 0.1) in production to control costs.
  • Add sentry.properties and .sentryclirc to .gitignore.
  • Never commit SENTRY_AUTH_TOKEN.

Comments

Markdown supported