diff --git a/docs/platforms/react-native/common/index.mdx b/docs/platforms/react-native/common/index.mdx
index e4fa6fe685fd6..9eeba5ed57b18 100644
--- a/docs/platforms/react-native/common/index.mdx
+++ b/docs/platforms/react-native/common/index.mdx
@@ -1,6 +1,6 @@
---
title: React Native
-description: Learn how to set up Sentry's React Native SDK.
+description: Learn how to set up Sentry's React Native SDK and capture your first events.
sdk: sentry.javascript.react-native
fallbackPlatform: javascript
caseStyle: camelCase
@@ -9,125 +9,140 @@ categories:
- mobile
---
-
+
-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](https://vimeo.com/899369012).
+Read on to find out how to set up Sentry's React Native SDK, which automatically reports errors and exceptions in your application. If you prefer video instructions, see [How to Install the Sentry React Native SDK in 60 Seconds](https://vimeo.com/899369012).
-If you don't already have an account and Sentry project established, head over to [sentry.io](https://sentry.io/signup/), then return to this page.
+If you don't already have an account and Sentry project, head over to [sentry.io](https://sentry.io/signup/), then return to this page.
-## Features
-
-In addition to [error monitoring](/product/issues/), here are some of the features you can configure when installing Sentry:
-
-- **[Logs](/platforms/react-native/logs/)**: Send, view, and query logs from your app alongside your errors to get richer context when debugging.
-- **[Tracing](/platforms/react-native/tracing/)**: Monitor the timing and flow of requests and operations as they happen across different systems in your application to improve performance.
-- **[Session Replay](/platforms/react-native/session-replay/)**: Get reproductions of user sessions to improve your app experience.
-- **[Profiling](/platforms/react-native/profiling/)**: Collect and analyze function-level information about your code to fine-tune performance.
-- **[Application Metrics](/platforms/react-native/metrics/)**: Send, view, and query counters, gauges, and measurements from your app to track health and drill down into related traces, logs, and errors.
-- **[User Feedback](/platforms/react-native/user-feedback/)**: Collect user feedback from anywhere inside your application at any time, without needing an error event to occur first.
-- **[Size Analysis](/platforms/react-native/size-analysis/)**: Monitor your mobile app's size in pre-production to prevent unexpected size increases (regressions) from reaching users.
-
-Tracing, profiling, session replay, and logs can be added via the [Configure](#configure) section below. For the other features, refer to each product page for instructions on getting started.
-
## Install
-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.
+Sentry captures data by using an SDK within your application's runtime. These platform-specific SDKs give Sentry a deeper understanding of how your application works.
-To install, run `@sentry/wizard`:
+Run `@sentry/wizard` to install and configure the SDK:
```bash {tabTitle:npm}
npx @sentry/wizard@latest -i reactNative
```
-[Sentry Wizard](https://github.com/getsentry/sentry-wizard) will patch your project accordingly, though you can [set up manually](/platforms/react-native/manual-setup/manual-setup/) if you prefer. You only need to patch the project once. Then you can add the patched files to your version control system.
+[Sentry Wizard](https://github.com/getsentry/sentry-wizard) patches your project. You only need to do this once; then add the patched files to version control. If you prefer, follow the [manual setup guide](/platforms/react-native/manual-setup/manual-setup/).
- 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.
+- Add `@sentry/react-native/metro` to the _*metro.config.js*_ Metro configuration.
+- Add `@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.
+- Add the _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.
+- Store build credentials in _*ios/sentry.properties*_, _*android/sentry.properties*_, and _*.env.local*_.
+- Configure Sentry with the supplied DSN in your _*layout.tsx*_ or _*App.tsx*_ file.
-If you're using Expo, [read our Expo guide](/platforms/react-native/guides/expo/) to learn how to add Sentry to your Expo project. This SDK will work for both managed and bare projects.
-
+If you're using Expo, follow the [Expo guide](/platforms/react-native/guides/expo/) for Expo-specific setup. The SDK works with both managed and bare projects.
## Configure
-
+**Error Monitoring** starts working as soon as you call `Sentry.init()`. **Logs** need `enableLogs: true` in the initialization snippet below, and you'll learn how to send them in [Send Logs](#send-logs). **Application Metrics** need no extra configuration, and you'll learn how to send them in [Send Application Metrics](#send-application-metrics-).
+
+This guide also enables **Tracing**, **Profiling**, **Session Replay**, and **User Feedback**. **Size Analysis** uses a separate build-time setup; see Size Analysis.
+
+
-To capture all errors, initialize the Sentry React Native SDK as soon as possible.
+To capture errors, initialize the Sentry React Native SDK as early as possible in your application's lifecycle.
+
+The snippet also turns on:
+
+- Tracing: via `tracesSampleRate`
+- Profiling: via `profilesSampleRate` (see Profiling)
+- Session Replay: via `mobileReplayIntegration()` and the replay sample rates (see Session Replay)
+- User Feedback: via `feedbackIntegration()` (see User Feedback)
+- Logs: via `enableLogs`
+
+Don't need a feature? Remove its integration and options from the snippet.
```javascript {filename:App.js}
import * as Sentry from "@sentry/react-native";
Sentry.init({
dsn: "___PUBLIC_DSN___",
- // Adds more context data to events (IP address, cookies, user, etc.)
- // For more information, visit: https://docs.sentry.io/platforms/react-native/data-management/data-collected/
+ // Adds context data to events, such as IP address, cookies, and user.
sendDefaultPii: true,
- // ___PRODUCT_OPTION_START___ performance
- // 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/react-native/configuration/options/#traces-sample-rate
+
+ integrations: [
+ // Enables Session Replay
+ Sentry.mobileReplayIntegration(),
+ // Enables User Feedback. Open the form with Sentry.showFeedbackWidget().
+ Sentry.feedbackIntegration(),
+ ],
+
+ // Enables Tracing.
+ // Set to 1.0 to capture 100% of spans for tracing.
+ // We recommend reducing this value in production.
tracesSampleRate: 1.0,
- // ___PRODUCT_OPTION_END___ performance
- // ___PRODUCT_OPTION_START___ logs
- // Enable logs to be sent to Sentry
- // Learn more at https://docs.sentry.io/platforms/react-native/logs/
- enableLogs: true,
- // ___PRODUCT_OPTION_END___ logs
- // ___PRODUCT_OPTION_START___ profiling
- // profilesSampleRate is relative to tracesSampleRate.
- // Here, we'll capture profiles for 100% of transactions.
+
+ // Enables Profiling for 100% of sampled transactions.
profilesSampleRate: 1.0,
- // ___PRODUCT_OPTION_END___ profiling
- // ___PRODUCT_OPTION_START___ session-replay
- // Record session replays for 100% of errors and 10% of sessions
- replaysOnErrorSampleRate: 1.0,
+
+ // Enables Logs to be sent to Sentry.
+ enableLogs: true,
+
+ // Capture replays for 10% of sessions and 100% of sessions with an error.
replaysSessionSampleRate: 0.1,
- integrations: [Sentry.mobileReplayIntegration()],
- // ___PRODUCT_OPTION_END___ session-replay
+ replaysOnErrorSampleRate: 1.0,
});
```
-
+### Wrap Your App
-#### Wrap Your App
-
-To automatically instrument your app with [touch event tracking](/platforms/react-native/configuration/touchevents/) and [automatic tracing](/platforms/react-native/tracing/instrumentation/automatic-instrumentation/), wrap it with `Sentry.wrap`:
+To automatically instrument your app with [touch event tracking](/platforms/react-native/configuration/touchevents/) and [automatic tracing](/platforms/react-native/tracing/instrumentation/automatic-instrumentation/), wrap its root component with `Sentry.wrap`:
```javascript {filename:App.js}
export default Sentry.wrap(App);
```
-This is not required if your app does not have a single parent "App" component.
+You don't need this if your app doesn't have a single parent `App` component.
+
+## Send Logs
-
+Use `Sentry.logger` to send logs at different levels. You can include attributes to search or filter by later.
+
+The SDK can capture `console.*` calls when Logs are enabled. See the [Console logging integration](/platforms/react-native/integrations/console-logging/) for details.
+
+```javascript
+Sentry.logger.info("Order processed", { order_id: "order-123" });
+Sentry.logger.warn("Slow operation detected", {
+ operation: "data_fetch",
+ duration_ms: 3500,
+});
+```
+See Set Up Logs for all available logging methods and message formatting options.
-## Verify
+## Send Application Metrics
-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.
+Application Metrics are supported in React Native SDK 7.8.0 and newer. No extra option is needed after SDK initialization. Use `Sentry.metrics` to send counters, gauges, and distributions:
+
+```javascript
+Sentry.metrics.count("checkout.failed", 1);
+Sentry.metrics.gauge("active_connections", 42);
+Sentry.metrics.distribution("api_latency", 187, { unit: "millisecond" });
+```
+
+See Set Up Metrics for all available metric types and configuration options.
+
+## Verify Your Setup
+
+Trigger a test error to confirm that Sentry is receiving events. You should see the error in Sentry within a few minutes.
```javascript {tabTitle:Throw Error} {mdExpandTabs}
throw new Error("My first Sentry error!");
@@ -137,12 +152,21 @@ throw new Error("My first Sentry error!");
Sentry.nativeCrash();
```
-Alternatively, you can use the Sentry Playground to interactively test your SDK setup with multiple error scenarios.
+Alternatively, use the Sentry Playground to test your setup interactively with multiple error scenarios.
+
+### View Captured Data in Sentry
+Head over to your project on [Sentry.io](https://sentry.io) to view the captured error.
+
+
## Next Steps
+At this point, you should have integrated Sentry into your React Native application. Here's what to explore next:
+
+{/* prettier-ignore */}
- Explore [practical guides](/get-started/guides/) on what to monitor, log, track, and investigate after setup
-- Learn about the features of Sentry's React Native SDK
+- Explore React Native features
- Add readable stack traces to errors
-- Add Apple Privacy manifest
+- Add the Apple Privacy Manifest
+- Troubleshoot your setup
diff --git a/docs/platforms/react-native/guides/expo/index.mdx b/docs/platforms/react-native/guides/expo/index.mdx
index 718a87dcc941a..559425fa0c623 100644
--- a/docs/platforms/react-native/guides/expo/index.mdx
+++ b/docs/platforms/react-native/guides/expo/index.mdx
@@ -1,6 +1,6 @@
---
title: Expo
-description: "Learn how to set up an Expo project with Sentry's React Native SDK, including the Sentry Expo config plugin, Expo Router tracing, Expo Updates context, and the EAS dashboard integration."
+description: "Learn how to set up Sentry in an Expo project and capture your first events, including Expo config plugin, Expo Router tracing, Expo Updates context, and EAS dashboard integration."
caseStyle: camelCase
supportLevel: production
sdk: sentry.javascript.react-native
@@ -11,23 +11,19 @@ categories:
-Use this guide to get fully set up with Sentry's React Native SDK in an [Expo](https://expo.dev/) project. The same `@sentry/react-native` SDK powers both bare React Native and Expo apps. This guide covers the Expo-specific setup (config plugin, Metro, EAS) and integrations.
+Use this guide to set up Sentry's React Native SDK in an [Expo](https://expo.dev/) project. The same `@sentry/react-native` SDK powers bare React Native and Expo apps. This guide covers Expo-specific setup, including the config plugin, Metro, and EAS.
-If you don't already have an account and Sentry project established, head over to [sentry.io](https://sentry.io/signup/), then return to this page.
+If you don't already have an account and Sentry project, head over to [sentry.io](https://sentry.io/signup/), then return to this page.
-## Prerequisites
+## Install
-- [Expo SDK 50](https://docs.expo.dev/workflow/upgrading-expo-sdk-walkthrough/) or newer. The `@sentry/react-native` SDK requires Expo SDK 50+.
- - On [Expo SDK 49](https://docs.expo.dev/guides/using-sentry/) or older, the legacy `sentry-expo` package was used. It's now deprecated — [migrate to `@sentry/react-native`](/platforms/react-native/guides/expo/migration/sentry-expo/) to keep receiving updates.
-- [Sign up for an account](https://sentry.io/signup/).
+You need Expo SDK 50 or newer. The `@sentry/react-native` SDK requires Expo SDK 50+. On [Expo SDK 49](https://docs.expo.dev/guides/using-sentry/) or older, the deprecated `sentry-expo` package was used; [migrate to `@sentry/react-native`](/platforms/react-native/guides/expo/migration/sentry-expo/) to keep receiving updates.
-## Automatic Install
-
-Use the Sentry Wizard to patch your project automatically, as shown below. Alternatively, you can follow the [Manual Install](#manual-install) if you prefer. You only need to patch the project once. Then, you can add the patched files to your version control system.
+Use the Sentry Wizard to patch your project automatically:
```bash {tabTitle:npm}
npx @sentry/wizard@latest -i reactNative
@@ -36,20 +32,22 @@ npx @sentry/wizard@latest -i reactNative
- 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.
+- Add `@sentry/react-native/metro` to the _*metro.config.js*_ Metro configuration.
+- Add `@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.
+- Add the _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*_ file.
+- Store build credentials in _*ios/sentry.properties*_, _*android/sentry.properties*_, and _*.env.local*_.
+- Configure Sentry with the supplied DSN in your _*layout.tsx*_ file.
-## Manual Install
+You only need to patch the project once. Add the patched files to version control. If you prefer, use the [manual install](#manual-install) below.
+
+### Manual Install
-If you don't use the Wizard, install the `@sentry/react-native` package:
+If you don't use the Wizard, install `@sentry/react-native`:
```bash {tabTitle:Expo}
npx expo install @sentry/react-native
@@ -67,59 +65,58 @@ yarn add @sentry/react-native
pnpm add @sentry/react-native
```
+## Configure
+
+**Error Monitoring** starts working as soon as you call `Sentry.init()`. **Logs** need `enableLogs: true` in the initialization snippet below, and you'll learn how to send them in [Send Logs](#send-logs). **Application Metrics** need no extra configuration, and you'll learn how to send them in [Send Application Metrics](#send-application-metrics-).
+
+This guide also enables **Tracing**, **Profiling**, **Session Replay**, and **User Feedback**.
+
+
+
### Initialize the SDK
-
+Import `@sentry/react-native` and initialize the SDK in your Expo Router root layout or app entry point.
+
+The snippet also turns on:
-Import the `@sentry/react-native` package and call `init` with your DSN:
+- Tracing: via `tracesSampleRate`
+- Profiling: via `profilesSampleRate` (see Profiling)
+- Session Replay: via `mobileReplayIntegration()` and the replay sample rates (see Session Replay)
+- User Feedback: via `feedbackIntegration()` (see User Feedback)
+- Logs: via `enableLogs`
+
+Don't need a feature? Remove its integration and options from the snippet.
```javascript {tabTitle:App.js or app/_layout.js}
-import { Stack } from "expo-router";
import * as Sentry from "@sentry/react-native";
Sentry.init({
dsn: "___PUBLIC_DSN___",
- // Adds more context data to events (IP address, cookies, user, etc.)
- // For more information, visit: https://docs.sentry.io/platforms/react-native/data-management/data-collected/
+ // Adds context data to events, such as IP address, cookies, and user.
sendDefaultPii: true,
- // ___PRODUCT_OPTION_START___ performance
- // 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/react-native/configuration/options/#traces-sample-rate
+
+ integrations: [
+ // Enables Session Replay
+ Sentry.mobileReplayIntegration(),
+ // Enables User Feedback. Open the form with Sentry.showFeedbackWidget().
+ Sentry.feedbackIntegration(),
+ ],
+
+ // Enables Tracing.
+ // Set to 1.0 to capture 100% of spans for tracing.
+ // We recommend reducing this value in production.
tracesSampleRate: 1.0,
- // ___PRODUCT_OPTION_END___ performance
- // ___PRODUCT_OPTION_START___ logs
- // Enable logs to be sent to Sentry
- // Learn more at https://docs.sentry.io/platforms/react-native/logs/
- enableLogs: true,
- // ___PRODUCT_OPTION_END___ logs
- // ___PRODUCT_OPTION_START___ profiling
- // profilesSampleRate is relative to tracesSampleRate.
- // Here, we'll capture profiles for 100% of transactions.
+
+ // Enables Profiling for 100% of sampled transactions.
profilesSampleRate: 1.0,
- // ___PRODUCT_OPTION_END___ profiling
- // ___PRODUCT_OPTION_START___ session-replay
- // Record session replays for 100% of errors and 10% of sessions
- replaysOnErrorSampleRate: 1.0,
- replaysSessionSampleRate: 0.1,
- integrations: [Sentry.mobileReplayIntegration()],
- // ___PRODUCT_OPTION_END___ session-replay
-});
-function RootLayout() {
- return ;
-}
+ // Enables Logs to be sent to Sentry.
+ enableLogs: true,
-export default Sentry.wrap(RootLayout);
+ // Capture replays for 10% of sessions and 100% of sessions with an error.
+ replaysSessionSampleRate: 0.1,
+ replaysOnErrorSampleRate: 1.0,
+});
```
### Wrap Your App
@@ -127,39 +124,66 @@ export default Sentry.wrap(RootLayout);
Wrap the root component of your application with `Sentry.wrap`:
```javascript {tabTitle:App.js or app/_layout.js}
+import { Stack } from "expo-router";
+import * as Sentry from "@sentry/react-native";
+
+function RootLayout() {
+ return ;
+}
+
export default Sentry.wrap(RootLayout);
```
### Add the Sentry Expo Plugin
-To ensure bundles and source maps are automatically uploaded during the native application builds, add the Sentry plugin to your Expo app configuration. Add it to the `plugins` array in `app.json`, or wrap your config with `withSentry` in `app.config.js`/`app.config.ts`:
+To upload bundles and source maps automatically during native builds, add the Sentry plugin to your Expo app configuration. Add it to the `plugins` array in `app.json`, or wrap your config with `withSentry` in `app.config.js` or `app.config.ts`:
-### Add Sentry Metro Plugin
+### Add the Sentry Metro Plugin
-To ensure unique Debug IDs get assigned to the generated bundles and source maps, add Sentry Serializer to the Metro configuration:
+Add Sentry Serializer to the Metro configuration to assign unique Debug IDs to generated bundles and source maps:
-### Add Privacy Manifest
+### Add the Apple Privacy Manifest
-The SDK needs access to certain information about the device and the application for its essential functionality. Some of the APIs required for this are considered privacy-relevant. Add the privacy manifest to your Xcode project to ensure your app is compliant with Apple's guidelines. Read the [Apple Privacy Manifest](/platforms/react-native/guides/expo/data-management/apple-privacy-manifest/) guide for more info on how to add records required for the Sentry SDKs.
+The SDK needs access to some device and application information for essential functionality. Add the privacy manifest to your Xcode project to meet Apple's guidelines. See the [Apple Privacy Manifest guide](/platforms/react-native/guides/expo/data-management/apple-privacy-manifest/) for the records required by the Sentry SDKs.
-## Verify Setup
+### Integrate Sentry With Your EAS Dashboard
-To verify that everything is working as expected, build the `Release` version of your application and send a test event to Sentry by adding:
+Connect Sentry to [Expo Application Services (EAS)](https://expo.dev/eas) to view crash reports and [Session Replays](/platforms/react-native/guides/expo/session-replay/) for deployments in the EAS dashboard, with direct links to Sentry stack traces and debugging context.
-```javascript
-