Set Up JavaScript Error Tracking in 5 Minutes with BugZap SDK

Why Another Error Tracking SDK?

Most error tracking tools give you a stack trace and a timestamp. That's useful, but it does not tell you what the user was doing when the error happened.

BugZap's SDK captures:

Uncaught errors and unhandled promise rejections — automatically
Console logs — the last 50 entries before the error
User context — who was affected
Page URL and browser info — where it happened

Installation

npm install @bugzap/sdk

Quick Setup

import BugZap from '@bugzap/sdk';

// Initialize with your project API key
BugZap.init({
  apiKey: 'your-project-api-key',
});

That is it. Uncaught errors are now automatically captured and sent to your BugZap dashboard.

Identify Users

// After your user logs in
BugZap.setUser({
  email: 'user@example.com',
  name: 'Jane Developer',
});

User context is attached to all subsequent bug reports, making it easy to follow up.

Manual Reporting

// Report a bug from a try/catch
try {
  await processPayment(order);
} catch (err) {
  BugZap.captureException(err);
}

// Report a specific bug with full context
BugZap.report({
  title: 'Checkout flow broken',
  description: 'Payment processing fails for international cards',
  severity: 'critical',
});

Advanced: beforeSend Hook

Filter or modify reports before they are sent:

BugZap.init({
  apiKey: 'your-key',
  beforeSend: (report) => {
    // Do not report errors from browser extensions
    if (report.title?.includes('chrome-extension')) {
      return null; // Drop the report
    }
    return report;
  },
});

Under the Hood

The SDK is designed to be lightweight and production-safe:

Retry queue — failed reports are retried with exponential backoff (up to 3 attempts)
Payload size limit — reports are capped at 64KB to prevent oversized payloads
Circular reference handling — safe JSON serialization for complex objects
Console buffer — circular buffer of 50 entries, each truncated at 1,024 characters
Clean teardown — call destroy() to remove all event listeners and flush pending reports

What About the Browser Extension?

The SDK is perfect for programmatic error tracking. For visual bug reporting (screenshots, screen recording, session replay), use the BugZap browser extension.

Both tools work together — they report to the same project dashboard and use the same API key.

Get Started

Install: npm install @bugzap/sdk
Get your API key from Project Settings > Channels > JavaScript SDK
Add the init call to your app entry point
Errors start appearing in your dashboard immediately