React Native

Learn how to set up Sentry's React Native SDK.

Read on to find out how to set up Sentry's React Native SDK which will automatically report errors and exceptions in your application. If you prefer to follow video instructions, see How to Install the Sentry React Native SDK in 60 Seconds.

If you don't already have an account and Sentry project established, head over to sentry.io, then return to this page.

In addition to capturing errors, you can monitor interactions between multiple services or applications by enabling tracing. You can also collect and analyze performance profiles from real users with profiling.

Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below.

Sentry captures data by using an SDK within your application's runtime. These are platform-specific and allow Sentry to have a deep understanding of how your application works.

To install, run @sentry/wizard:

Copied
npx @sentry/wizard@latest -i reactNative

Sentry Wizard will patch your project accordingly, though you can set up manually if you prefer. You only need to patch the project once. Then you can add the patched files to your version control system.

The following tasks will be performed by the Sentry Wizard

  • Install the @sentry/react-native package.
  • Add the @sentry/react-native/metro to the metro.config.js Metro configuration.
  • Add the @sentry/react-native/expo to the app.json Expo configuration.
  • Enable the Sentry React Native Gradle build step for Android to auto-upload generated source maps and debug symbols.
  • Wrap the Bundle React Native code and images Xcode project build phase script to upload generated source maps and collect bundled node modules.
  • Add Upload Debug Symbols to Sentry Xcode project build phase.
  • Run pod install.
  • Store build credentials in ios/sentry.properties, android/sentry.properties and env.local.
  • Configure Sentry for the supplied DSN in your layout.tsx/_App.tsx_file.

If you're using Expo, read our docs to learn how to add Sentry to your Expo project. This SDK will work for both managed and bare projects.

To capture all errors, initialize the Sentry React Native SDK as soon as possible.

App.js
Copied
import * as Sentry from "@sentry/react-native";

Sentry.init({
  dsn: "https://examplePublicKey@o0.ingest.sentry.io/0",
  // Set tracesSampleRate to 1.0 to capture 100% of transactions for tracing.
  // We recommend adjusting this value in production.
  // Learn more at
  // https://docs.sentry.io/platforms/javascript/configuration/options/#traces-sample-rate
  tracesSampleRate: 1.0,
  // profilesSampleRate is relative to tracesSampleRate.
  // Here, we'll capture profiles for 100% of transactions.
  profilesSampleRate: 1.0,
});

To automatically instrument your app with touch event tracking and automatic tracing, wrap it with Sentry.wrap:

App.js
Copied
export default Sentry.wrap(App);

This is not required if your app does not have a single parent "App" component.

Verify that your app is sending events to Sentry by adding the following snippet, which includes an intentional error. You should see the error reported in Sentry within a few minutes.

Copied
throw new Error("My first Sentry error!");

Previous
Welcome to Sentry
Next
Features
Help improve this content
Our documentation is open source and available on GitHub. Your contributions are welcome, whether fixing a typo (drat!) or suggesting an update ("yeah, this would be better").