Already using Sentry? Check out these docs instead.
⏱ Estimated Time To Completion: 3 minutes

You can choose to get started with Decipher by using the Loader Script or NPM Package below.

1

Paste the script into your website

Install the SDK by including the script below on your website. Tracing, session replay, and errors will automatically be captured.

You can configure some of the parameters (e.g. to adjust capture rate) below.

Initialization (copy and paste)
<script
  src="https://browser.sentry-cdn.com/8.20.0/bundle.tracing.replay.min.js"
  integrity="sha384-e4DRKCQjGj8HoVTcv07HyAm3g1wDECvRclj9gsw2d06z1aLh+78iJ21phn6RhkJD"
  crossorigin="anonymous"
></script>
<script>
  Sentry.init({
    dsn: "YOUR_DSN_FROM_DECIPHER", // Get this at https://app.getdecipher.com/settings
    integrations: [
        Sentry.browserTracingIntegration(),
        Sentry.replayIntegration({
            maskAllText: false,
            blockAllMedia: false,
            maskAllInputs: true
        }),
    ],
    replaysOnErrorSampleRate: 1.0,
    replaysSessionSampleRate: 1.0,
    tracesSampleRate: 1.0,
  });
</script>

You can get the dsn parameter by logging into Decipher with your work email. On the Settings page, select a new project name and click ”Create New Project”. Decipher will generate a DSN to that you can paste.

2

Test the integration

That’s it! Now test the integration by forcing an error anywhere in your app, e.g.

app/cart.tsx
function Cart() {
    // ... existing code ...

    const handleError = () => {
        throw new Error("This is a test error for Decipher's Sentry integration.");
    };

    return (
        <div>
            <button onClick={handleError}>Trigger Error</button>
        </div>
    );
    // ... existing code ...
}

Check out the Decipher dashboard to see information about your captured error. Decipher will automatically analyze and group your usage and errors to highlight the important, high-impact bugs.

What is Decipher?Already using Sentry?