Set Up Bugsly for Next.js

1. Install the SDK

2. Configure Bugsly

Add the following to your application entry point. Replace the DSN with your project DSN from the Bugsly dashboard.

// instrumentation-client.ts (browser)
import * as Bugsly from "@bugsly/nextjs";

Bugsly.init({
  dsn: "https://your-dsn@bugsly.dev/1",
  tracesSampleRate: 1.0,
});
export const onRouterTransitionStart = Bugsly.captureRouterTransitionStart;

// instrumentation.ts (server and edge)
import * as Bugsly from "@bugsly/nextjs";

export function register() {
  Bugsly.init({
    dsn: "https://your-dsn@bugsly.dev/1",
    tracesSampleRate: 1.0,
  });
}
export const onRequestError = Bugsly.captureRequestError;

// next.config.js
const { withBugslyConfig } = require("@bugsly/nextjs");
module.exports = withBugslyConfig({ /* your config */ }, { silent: true });

3. Verify It Works

Trigger a test error in your application and check your Bugsly dashboard. The error should show up as an issue within a few seconds.

Want to check your DSN before touching any code? From a macOS, Linux or WSL terminal, this sends one real error without any SDK (replace your-dsn with the key from your DSN):

curl -sS -X POST "https://bugsly.dev/api/1/envelope/" \
  -H "X-Sentry-Auth: Sentry sentry_version=7, sentry_key=your-dsn" \
  --data-binary $'{}\n{"type":"event"}\n{"level":"error","platform":"other","exception":{"values":[{"type":"CurlTestError","value":"Hello from my terminal"}]}}'

Comparing options for the client side? See the best React error tracking tools in 2026.

Frequently Asked Questions