Grab theSentry React SDK:

npm install @sentry/react

Configure your DSN:

import React from "react";import ReactDOM from "react-dom";import * as Sentry from "@sentry/react";import App from "./App";Sentry.init({  dsn: "https://<key>@sentry.io/<project>",  // This enables automatic instrumentation (highly recommended)  // If you only want to use custom instrumentation:  // * Remove the BrowserTracing integration  // * add Sentry.addTracingExtensions() above your Sentry.init() call  integrations: [    Sentry.browserTracingIntegration(),    // Or, if you are using react router, use the appropriate integration    // See docs for support for different versions of react router    // https://docs.sentry.io/platforms/javascript/guides/react/configuration/integrations/react-router/    Sentry.reactRouterV6BrowserTracingIntegration({      useEffect: React.useEffect,      useLocation,      useNavigationType,      createRoutesFromChildren,      matchRoutes,    }),  ],  // For finer control of sent transactions you can adjust this value, or  // use tracesSampler  tracesSampleRate: 1.0,  // Set tracePropagationTargets to control for which URLs distributed tracing should be enabled  tracePropagationTargets: ['localhost', /^https://yourserver.io/api/],});ReactDOM.render(<App />, document.getElementById("root"));

How to install the React SDK

React Performance Monitoring

Quickly identifyperformance issues and view full end-to-end distributed trace to see the exact poor-performing API call and surface any related React errors. Improve React performance with max efficiency, not max effort.

See a Sample Transaction

React Error Monitoring With Complete Stack Traces

See the error and React stack trace previously only visible in your user’s debug console. Apply source maps automatically to convert minified, compiled, or transpiled code back to its original form. Keep your React source maps private by uploading them directly to Sentry.

See a Sample Stack Trace

Issues, replayed

Get to the root cause of an error or latency issue faster with context like DOM events, console logs, and network calls within one visual replay on your web application.

Fill In The Blanks About React Errors

See what the app was doing when the React error occurred: user interactions, AJAX requests, console log messages, and more. Learn in which version a bug first appeared, merge duplicates, and know if things regress in a future release

Check out Breadcrumbs

We collect PII about people browsing our website, users of the Sentry service, prospective customers, and people who otherwise interact with us.

What if my PII is included in data sent to Sentry by a Sentry customer (e.g., someone using Sentry to monitor their app)? In this case you have to contact the Sentry customer (e.g., the maker of the app). We do not control the data that is sent to us through the Sentry service for the purposes of application monitoring.

• PII provided by you and related to your
• Account, profile, and login
• Requests and inquiries
• Purchases
• PII collected from your device and usage
• PII collected from third parties (e.g., social media)

• To operate our site and service
• To protect and improve our site and service
• To provide customer care and support
• To communicate with you
• For other purposes (that we inform you of at collection)

We may disclose your PII to the following type of recipients:

• Subsidiaries and other affiliates
• Service providers
• Partners (go-to-market, analytics)
• Third-party platforms (when you connect them to our service)
• Governmental authorities (where necessary)
• An actual or potential buyer

• We do not use advertising or targeting cookies
• We use necessary cookies to run and improve our site and service
• You can disable cookies but this can impact your use or access to certain parts of our site and service

You may have the following rights related to your PII:

• Access, correct, and update
• Object to or restrict processing
• Port over
• Opt-out of marketing
• Be forgotten by Sentry
• Withdraw your consent
• Complain about us