diff --git a/docs/platforms/javascript/common/best-practices/index.mdx b/docs/platforms/javascript/common/best-practices/index.mdx index 95789708bd623..d6e04b869c500 100644 --- a/docs/platforms/javascript/common/best-practices/index.mdx +++ b/docs/platforms/javascript/common/best-practices/index.mdx @@ -1,7 +1,8 @@ --- title: Special Use Cases description: "Learn how to set up Sentry for several specific use cases with these best practice guides." -sidebar_order: 8000 +sidebar_order: 18 +sidebar_section: configuration notSupported: - javascript.node - javascript.aws-lambda diff --git a/docs/platforms/javascript/common/apis.mdx b/docs/platforms/javascript/common/configuration/apis.mdx similarity index 99% rename from docs/platforms/javascript/common/apis.mdx rename to docs/platforms/javascript/common/configuration/apis.mdx index 0c22a8482fc8b..6ccb63c505895 100644 --- a/docs/platforms/javascript/common/apis.mdx +++ b/docs/platforms/javascript/common/configuration/apis.mdx @@ -1,8 +1,7 @@ --- title: APIs description: "Learn more about APIs of the SDK." -customCanonicalTag: "/platforms/javascript/apis/" -sidebar_order: 3 +sidebar_order: 1 --- This page shows all available top-level APIs of the SDK. You can use these APIs as the primary way to: diff --git a/docs/platforms/javascript/common/configuration/index.mdx b/docs/platforms/javascript/common/configuration/index.mdx index a62e57d704dce..d1695eed74753 100644 --- a/docs/platforms/javascript/common/configuration/index.mdx +++ b/docs/platforms/javascript/common/configuration/index.mdx @@ -1,7 +1,9 @@ --- -title: Configuration +title: Extended Configuration +sidebar_title: Extended Configuration description: "Learn about additional configuration options for the JavaScript SDKs." -sidebar_order: 2 +sidebar_order: 13 +sidebar_section: configuration --- diff --git a/docs/platforms/javascript/common/crons/index.mdx b/docs/platforms/javascript/common/crons/index.mdx index d8727d026c0fd..082712d69496d 100644 --- a/docs/platforms/javascript/common/crons/index.mdx +++ b/docs/platforms/javascript/common/crons/index.mdx @@ -2,7 +2,8 @@ title: Set Up Crons sidebar_title: Crons description: "Sentry Crons allows you to monitor the uptime and performance of any scheduled, recurring job in your application." -sidebar_order: 5750 +sidebar_order: 9 +sidebar_section: features supported: - javascript.nextjs - javascript.sveltekit diff --git a/docs/platforms/javascript/common/data-management/index.mdx b/docs/platforms/javascript/common/data-management/index.mdx index ff50566053576..0cb4455ff7269 100644 --- a/docs/platforms/javascript/common/data-management/index.mdx +++ b/docs/platforms/javascript/common/data-management/index.mdx @@ -1,7 +1,8 @@ --- title: Data Management description: Learn about different ways to scrub data within your SDK before it gets sent to Sentry. -sidebar_order: 7 +sidebar_order: 16 +sidebar_section: configuration --- diff --git a/docs/platforms/javascript/common/enriching-events/index.mdx b/docs/platforms/javascript/common/enriching-events/index.mdx index 050223cad6110..69b6849a2980c 100644 --- a/docs/platforms/javascript/common/enriching-events/index.mdx +++ b/docs/platforms/javascript/common/enriching-events/index.mdx @@ -1,7 +1,8 @@ --- title: Enriching Events description: Add additional data to your events to make them easier to debug. -sidebar_order: 5 +sidebar_order: 12 +sidebar_section: configuration --- In addition to the data that the Sentry SDK automatically captures, you can add additional data to events to help you debug them. diff --git a/docs/platforms/javascript/common/feature-flags/index.mdx b/docs/platforms/javascript/common/feature-flags/index.mdx index d003e03e02df8..9b7795f20c406 100644 --- a/docs/platforms/javascript/common/feature-flags/index.mdx +++ b/docs/platforms/javascript/common/feature-flags/index.mdx @@ -1,7 +1,8 @@ --- title: Set Up Feature Flags sidebar_title: Feature Flags -sidebar_order: 7000 +sidebar_order: 15 +sidebar_section: features description: With Feature Flags, Sentry tracks feature flag evaluations in your application, keeps an audit log of feature flag changes, and reports any suspicious updates that may have caused an error. --- diff --git a/docs/platforms/javascript/common/logs/index.mdx b/docs/platforms/javascript/common/logs/index.mdx index 50022148b3356..ce5229f21c055 100644 --- a/docs/platforms/javascript/common/logs/index.mdx +++ b/docs/platforms/javascript/common/logs/index.mdx @@ -2,7 +2,9 @@ title: Set Up Logs sidebar_title: Logs description: "Structured logs allow you to send, view and query logs sent from your applications within Sentry." -sidebar_order: 5755 +sidebar_order: 4 +sidebar_section: features +new: true notSupported: - javascript.deno - javascript.cordova diff --git a/docs/platforms/javascript/common/metrics/index.mdx b/docs/platforms/javascript/common/metrics/index.mdx index 8f547f1a5e352..659bd8c3e09d3 100644 --- a/docs/platforms/javascript/common/metrics/index.mdx +++ b/docs/platforms/javascript/common/metrics/index.mdx @@ -2,7 +2,9 @@ title: Set Up Metrics sidebar_title: Metrics description: "Metrics allow you to send, view and query counters, gauges and measurements from your Sentry-configured apps to track application health and drill down into related traces, logs, and errors." -sidebar_order: 5755 +sidebar_order: 7 +sidebar_section: features +beta: true notSupported: - javascript.deno - javascript.cordova diff --git a/docs/platforms/javascript/common/migration/index.mdx b/docs/platforms/javascript/common/migration/index.mdx index d331144e3f2fc..ee087710683e4 100644 --- a/docs/platforms/javascript/common/migration/index.mdx +++ b/docs/platforms/javascript/common/migration/index.mdx @@ -1,7 +1,8 @@ --- title: Migration Guide description: "Migrate from an older version of our Sentry JavaScript SDK." -sidebar_order: 8100 +sidebar_order: 19 +sidebar_section: configuration notSupported: - javascript.capacitor - javascript.cordova diff --git a/docs/platforms/javascript/common/opentelemetry/index.mdx b/docs/platforms/javascript/common/opentelemetry/index.mdx index 83e98b38e24c6..88e6968abbb9d 100644 --- a/docs/platforms/javascript/common/opentelemetry/index.mdx +++ b/docs/platforms/javascript/common/opentelemetry/index.mdx @@ -1,7 +1,8 @@ --- title: OpenTelemetry Support description: "Learn how to use OpenTelemetry with Sentry." -sidebar_order: 7000 +sidebar_order: 14 +sidebar_section: configuration supported: - javascript.nextjs - javascript.node @@ -25,6 +26,7 @@ supported: - javascript.tanstackstart-react notSupported: - javascript +beta: true --- The Sentry SDK uses [OpenTelemetry](https://opentelemetry.io/) under the hood. This means that any OpenTelemetry instrumentation that emits spans will automatically be picked up by Sentry without any further configuration. diff --git a/docs/platforms/javascript/common/profiling/index.mdx b/docs/platforms/javascript/common/profiling/index.mdx index a04da12b821ae..38e10b04e7699 100644 --- a/docs/platforms/javascript/common/profiling/index.mdx +++ b/docs/platforms/javascript/common/profiling/index.mdx @@ -1,7 +1,8 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 +sidebar_section: features description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations. Get started with profiling to understand your application's performance." notSupported: - javascript.bun diff --git a/docs/platforms/javascript/common/configuration/sampling.mdx b/docs/platforms/javascript/common/sampling.mdx similarity index 99% rename from docs/platforms/javascript/common/configuration/sampling.mdx rename to docs/platforms/javascript/common/sampling.mdx index 88bb3498add9e..725ad22dde21d 100644 --- a/docs/platforms/javascript/common/configuration/sampling.mdx +++ b/docs/platforms/javascript/common/sampling.mdx @@ -1,7 +1,8 @@ --- title: Sampling description: "Learn how to configure the volume of error and transaction events sent to Sentry." -sidebar_order: 50 +sidebar_order: 11 +sidebar_section: configuration --- Adding Sentry to your app gives you a great deal of very valuable information about errors and performance you wouldn't otherwise get. And lots of information is good -- as long as it's the right information, at a reasonable volume. diff --git a/docs/platforms/javascript/common/security-policy-reporting/index.mdx b/docs/platforms/javascript/common/security-policy-reporting/index.mdx index 862fcb12452c4..6e41e3a10dd42 100644 --- a/docs/platforms/javascript/common/security-policy-reporting/index.mdx +++ b/docs/platforms/javascript/common/security-policy-reporting/index.mdx @@ -1,7 +1,8 @@ --- title: Set Up Security Policy Reporting sidebar_title: Security Policy Reporting -sidebar_order: 7500 +sidebar_order: 17 +sidebar_section: configuration description: "Learn how Sentry can help manage Content-Security-Policy violations and reports here." --- diff --git a/docs/platforms/javascript/common/session-replay/index.mdx b/docs/platforms/javascript/common/session-replay/index.mdx index 2f0a0749385ac..cf94f16f7b30a 100644 --- a/docs/platforms/javascript/common/session-replay/index.mdx +++ b/docs/platforms/javascript/common/session-replay/index.mdx @@ -1,7 +1,8 @@ --- title: Set Up Session Replay sidebar_title: Session Replay -sidebar_order: 5500 +sidebar_order: 5 +sidebar_section: features notSupported: - javascript.cordova - javascript.wasm diff --git a/docs/platforms/javascript/common/sourcemaps/index.mdx b/docs/platforms/javascript/common/sourcemaps/index.mdx index 0a67387ae019b..d940d5931771e 100644 --- a/docs/platforms/javascript/common/sourcemaps/index.mdx +++ b/docs/platforms/javascript/common/sourcemaps/index.mdx @@ -1,6 +1,7 @@ --- title: Source Maps sidebar_order: 3 +sidebar_section: features description: "Upload your source maps to Sentry to enable readable stack traces in your errors." --- diff --git a/docs/platforms/javascript/common/tracing/index.mdx b/docs/platforms/javascript/common/tracing/index.mdx index 5761afcadeb79..6ec8f6179e4ae 100644 --- a/docs/platforms/javascript/common/tracing/index.mdx +++ b/docs/platforms/javascript/common/tracing/index.mdx @@ -2,7 +2,8 @@ title: Set Up Tracing sidebar_title: Tracing description: "Learn how to enable tracing in your app." -sidebar_order: 4000 +sidebar_order: 6 +sidebar_section: features --- With [tracing](/product/insights/overview/), Sentry automatically tracks your software performance across your application services, measuring metrics like throughput and latency, and displaying the impact of errors across multiple systems. diff --git a/docs/platforms/javascript/common/troubleshooting/index.mdx b/docs/platforms/javascript/common/troubleshooting/index.mdx index e47edf6bbb532..3d0acedd992d4 100644 --- a/docs/platforms/javascript/common/troubleshooting/index.mdx +++ b/docs/platforms/javascript/common/troubleshooting/index.mdx @@ -3,6 +3,7 @@ title: Troubleshooting description: >- If you need help solving issues with your Sentry JavaScript SDK integration, you can read the edge cases documented below. +sidebar_section: configuration keywords: - adblocker - blocked @@ -11,7 +12,7 @@ keywords: - "404" notSupported: - javascript.capacitor -sidebar_order: 9000 +sidebar_order: 20 og_image: /og-images/platforms-javascript-common-troubleshooting.png --- diff --git a/docs/platforms/javascript/common/usage/index.mdx b/docs/platforms/javascript/common/usage/index.mdx index d402ccad46bb8..dc686940799ab 100644 --- a/docs/platforms/javascript/common/usage/index.mdx +++ b/docs/platforms/javascript/common/usage/index.mdx @@ -1,7 +1,8 @@ --- -title: Capturing Errors and Events +title: Capturing Errors description: "Learn how to use the SDK to manually capture errors and other events." -sidebar_order: 4 +sidebar_order: 2 +sidebar_section: features --- Sentry's SDK hooks into your runtime environment and automatically reports errors, uncaught exceptions, and unhandled rejections as well as other types of errors depending on the platform. diff --git a/docs/platforms/javascript/common/user-feedback/index.mdx b/docs/platforms/javascript/common/user-feedback/index.mdx index 033750ca59a14..719a05e2ae9fe 100644 --- a/docs/platforms/javascript/common/user-feedback/index.mdx +++ b/docs/platforms/javascript/common/user-feedback/index.mdx @@ -2,7 +2,8 @@ title: Set Up User Feedback sidebar_title: User Feedback description: Learn how to enable User Feedback in your app. -sidebar_order: 6000 +sidebar_order: 10 +sidebar_section: features og_image: /og-images/platforms-javascript-common-user-feedback.png --- diff --git a/docs/platforms/javascript/guides/angular/manual-setup.mdx b/docs/platforms/javascript/guides/angular/manual-setup.mdx index 14107a5273ede..e79b1054c393d 100644 --- a/docs/platforms/javascript/guides/angular/manual-setup.mdx +++ b/docs/platforms/javascript/guides/angular/manual-setup.mdx @@ -21,20 +21,6 @@ You need: ## Step 1: Install -Choose the features you want to configure, and this guide will show you how: - - - - - ### Install the Sentry SDK ```bash {tabTitle:npm} @@ -77,6 +63,20 @@ If you're updating your Sentry SDK to the latest version, check out our [migrati ## Step 2: Configure +Choose the features you want to configure, and this guide will show you how: + + + + + The main configuration should happen as early as possible in your app's lifecycle. Typically that means in your `main.ts` file. In addition, you'll need to register some providers to fully instrument your application. diff --git a/docs/platforms/javascript/guides/astro/index.mdx b/docs/platforms/javascript/guides/astro/index.mdx index 3631ee6b0a5d2..7225a95e40047 100644 --- a/docs/platforms/javascript/guides/astro/index.mdx +++ b/docs/platforms/javascript/guides/astro/index.mdx @@ -26,17 +26,6 @@ Before we get started, make sure you have the following: ## Install - - Sentry captures data by using an SDK within your application's runtime. Install the SDK by using the `astro` CLI: @@ -75,6 +64,17 @@ To finish the setup, configure the Sentry integration. ## Configure + + To set up the Sentry SDK, register the Sentry integration and initialize the SDK for client and server in the root directory of your project: ### Astro Integration Setup diff --git a/docs/platforms/javascript/guides/astro/profiling/index.mdx b/docs/platforms/javascript/guides/astro/profiling/index.mdx index 358ff175b7055..e2d49d44b7141 100644 --- a/docs/platforms/javascript/guides/astro/profiling/index.mdx +++ b/docs/platforms/javascript/guides/astro/profiling/index.mdx @@ -1,8 +1,9 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations." +sidebar_section: features --- diff --git a/docs/platforms/javascript/guides/capacitor/index.mdx b/docs/platforms/javascript/guides/capacitor/index.mdx index 15b8c852d3101..5435a6d6f16d0 100644 --- a/docs/platforms/javascript/guides/capacitor/index.mdx +++ b/docs/platforms/javascript/guides/capacitor/index.mdx @@ -8,16 +8,8 @@ categories: - mobile --- -## Features - -In addition to capturing errors, you can monitor interactions between multiple services or applications by [enabling tracing](/concepts/key-terms/tracing/). You can also get to the root of an error or performance issue faster, by watching a video-like reproduction of a user session with [session replay](/product/explore/session-replay/web/getting-started/). - -Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below. - ## Install - - Sentry captures data by using an SDK within your application's runtime. Install the Sentry Capacitor SDK alongside the corresponding Sentry SDK for the framework you're using: @@ -97,6 +89,12 @@ Both Frameworks are fully compatible with the current and beta versions of Sentr ## Configure +In addition to capturing errors, you can monitor interactions between multiple services or applications by [enabling tracing](/concepts/key-terms/tracing/). You can also get to the root of an error or performance issue faster, by watching a video-like reproduction of a user session with [session replay](/product/explore/session-replay/web/getting-started/). + +Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below. + + + Configuration should happen as early as possible in your application's lifecycle. Then forward the `init` method from the sibling Sentry SDK for the framework you use, such as Angular in this example: diff --git a/docs/platforms/javascript/guides/electron/index.mdx b/docs/platforms/javascript/guides/electron/index.mdx index f86092d85198a..e5c2c278b5496 100644 --- a/docs/platforms/javascript/guides/electron/index.mdx +++ b/docs/platforms/javascript/guides/electron/index.mdx @@ -11,20 +11,6 @@ categories: ## Step 1: Install -Choose the features you want to configure, and this guide will show you how: - - - - - ### Install the Sentry SDK Run the command for your preferred package manager to add the Sentry SDK to your application: @@ -43,6 +29,20 @@ pnpm add @sentry/electron ## Step 2: Configure +Choose the features you want to configure, and this guide will show you how: + + + + + You should initialize the SDK in both the `main` process and every `renderer` process you spawn. ### Configure the Main Process diff --git a/docs/platforms/javascript/guides/ember/index.mdx b/docs/platforms/javascript/guides/ember/index.mdx index 72ac43fcd4781..df76bcee5c681 100644 --- a/docs/platforms/javascript/guides/ember/index.mdx +++ b/docs/platforms/javascript/guides/ember/index.mdx @@ -11,6 +11,14 @@ categories: ## Step 1: Install +### Install the Sentry SDK + +Run the command for your preferred package manager to add the Sentry SDK to your application: + + + +## Step 2: Configure + Choose the features you want to configure, and this guide will show you how: -### Install the Sentry SDK - -Run the command for your preferred package manager to add the Sentry SDK to your application: - - - -## Step 2: Configure - ### Initialize the SDK Configuration should happen as early as possible in your application's lifecycle. Add the following to your `app/app.js` file: diff --git a/docs/platforms/javascript/guides/gatsby/index.mdx b/docs/platforms/javascript/guides/gatsby/index.mdx index 46f1d1b8d891c..5197cf2caeb6f 100644 --- a/docs/platforms/javascript/guides/gatsby/index.mdx +++ b/docs/platforms/javascript/guides/gatsby/index.mdx @@ -7,24 +7,8 @@ categories: - browser --- -## Features - -In addition to capturing errors, you can monitor interactions between multiple services or applications by [enabling tracing](/concepts/key-terms/tracing/). You can also get to the root of an error or performance issue faster, by watching a video-like reproduction of a user session with [session replay](/product/explore/session-replay/web/getting-started/). - -Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below. - ## Install - - To use Sentry with your Gatsby application, you will need to use `@sentry/gatsby` (Sentry's Gatsby SDK): ```bash {tabTitle:npm} @@ -59,6 +43,20 @@ module.exports = { ## Configure +In addition to capturing errors, you can monitor interactions between multiple services or applications by [enabling tracing](/concepts/key-terms/tracing/). You can also get to the root of an error or performance issue faster, by watching a video-like reproduction of a user session with [session replay](/product/explore/session-replay/web/getting-started/). + +Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below. + + + Then, configure your `Sentry.init`. For this, create a new file called `sentry.config.js` in the root of your project and add the following code: ```javascript {filename:sentry.config.(js|ts)} diff --git a/docs/platforms/javascript/guides/gatsby/profiling/index.mdx b/docs/platforms/javascript/guides/gatsby/profiling/index.mdx index 358ff175b7055..e2d49d44b7141 100644 --- a/docs/platforms/javascript/guides/gatsby/profiling/index.mdx +++ b/docs/platforms/javascript/guides/gatsby/profiling/index.mdx @@ -1,8 +1,9 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations." +sidebar_section: features --- diff --git a/docs/platforms/javascript/guides/nestjs/index.mdx b/docs/platforms/javascript/guides/nestjs/index.mdx index 747b8380253a4..016bade28f993 100644 --- a/docs/platforms/javascript/guides/nestjs/index.mdx +++ b/docs/platforms/javascript/guides/nestjs/index.mdx @@ -13,14 +13,6 @@ categories: ## Step 1: Install -Choose the features you want to configure, and this guide will show you how: - - - - - ### Install the Sentry SDK Run the command for your preferred package manager to add the Sentry SDK to your application: @@ -29,6 +21,14 @@ Run the command for your preferred package manager to add the Sentry SDK to your ## Step 2: Configure +Choose the features you want to configure, and this guide will show you how: + + + + + ### Initialize the Sentry SDK To import and initialize Sentry, create a file named `instrument.ts` in the root directory of your project and add the following code: diff --git a/docs/platforms/javascript/guides/nextjs/index.mdx b/docs/platforms/javascript/guides/nextjs/index.mdx index 3306adfe15844..08878b10dbb60 100644 --- a/docs/platforms/javascript/guides/nextjs/index.mdx +++ b/docs/platforms/javascript/guides/nextjs/index.mdx @@ -13,33 +13,17 @@ categories: -## Features + -In addition to capturing errors, you can monitor interactions between multiple services or applications by [enabling tracing](/concepts/key-terms/tracing/). You can also get to the root of an error or performance issue faster, by watching a video-like reproduction of a user session with [session replay](/product/explore/session-replay/web/getting-started/). - -Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below. - - +## Install -## Step 1: Install + + + -To install Sentry using the installation wizard, run the following command within your project: +To install Sentry using the installation wizard, run the command on the right within your project directory. -```bash -npx @sentry/wizard@latest -i nextjs -``` - -The wizard then guides you through the setup process, asking you to enable additional (optional) Sentry features for your application beyond error monitoring. - - +The wizard guides you through the setup process, asking you to enable additional (optional) Sentry features for your application beyond error monitoring. This guide assumes that you enable all features and allow the wizard to create an example page and route. You can add or remove features at any time, but setting them up now will save you the effort of configuring them manually later. @@ -54,12 +38,50 @@ This guide assumes that you enable all features and allow the wizard to create a -## Step 2: Configure + + + +```bash +npx @sentry/wizard@latest -i nextjs +``` + + + + + +## Configure If you prefer to configure Sentry manually, here are the configuration files the wizard would create: +In addition to capturing errors, you can monitor interactions between multiple services or applications by [enabling tracing](/concepts/key-terms/tracing/). You can also get to the root of an error or performance issue faster, by watching a video-like reproduction of a user session with [session replay](/product/explore/session-replay/web/getting-started/). + +Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below. + + + + + + + + + ### Client-Side Configuration +The wizard creates a client configuration file that initializes the Sentry SDK in your browser. + +The configuration includes your DSN (Data Source Name), which connects your app to your Sentry project, and enables the features you selected during installation. + + + + ```javascript {tabTitle:Client} {filename:instrumentation-client.(js|ts)} import * as Sentry from "@sentry/nextjs"; @@ -111,8 +133,21 @@ export const onRouterTransitionStart = Sentry.captureRouterTransitionStart; // ___PRODUCT_OPTION_END___ performance ``` + + + + + + ### Server-Side Configuration +The wizard also creates a server configuration file for Node.js and Edge runtimes. + +For more advanced configuration options or to set up Sentry manually, check out our [manual setup guide](/platforms/javascript/guides/nextjs/manual-setup/). + + + + ```javascript {tabTitle:Server} {filename:sentry.server.config.(js|ts)} import * as Sentry from "@sentry/nextjs"; @@ -139,9 +174,11 @@ Sentry.init({ }); ``` -For detailed manual setup instructions, see our [manual setup guide](/platforms/javascript/guides/nextjs/manual-setup/). + + + -## Step 3: Verify Your Setup +## Verify Your Setup @@ -188,3 +225,5 @@ Our next recommended steps for you are: - [Get support](https://sentry.zendesk.com/hc/en-us/) + + diff --git a/docs/platforms/javascript/guides/nextjs/manual-setup.mdx b/docs/platforms/javascript/guides/nextjs/manual-setup.mdx index 092f6597dacb2..c80b373dc8538 100644 --- a/docs/platforms/javascript/guides/nextjs/manual-setup.mdx +++ b/docs/platforms/javascript/guides/nextjs/manual-setup.mdx @@ -13,20 +13,6 @@ description: "Learn how to manually set up Sentry in your Next.js app and captur ## Step 1: Install -Choose the features you want to configure, and this guide will show you how: - - - - - ### Install the Sentry SDK Run the command for your preferred package manager to add the Sentry SDK to your application: @@ -45,6 +31,20 @@ pnpm add @sentry/nextjs ## Step 2: Configure +Choose the features you want to configure, and this guide will show you how: + + + + + ### Apply Instrumentation to Your App Extend your app's default Next.js options by adding `withSentryConfig` into your `next.config.(js|mjs)` file: diff --git a/docs/platforms/javascript/guides/nextjs/profiling/index.mdx b/docs/platforms/javascript/guides/nextjs/profiling/index.mdx index 358ff175b7055..0de973726e974 100644 --- a/docs/platforms/javascript/guides/nextjs/profiling/index.mdx +++ b/docs/platforms/javascript/guides/nextjs/profiling/index.mdx @@ -1,7 +1,8 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 +sidebar_section: features description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations." --- diff --git a/docs/platforms/javascript/guides/nuxt/profiling/index.mdx b/docs/platforms/javascript/guides/nuxt/profiling/index.mdx index 358ff175b7055..e2d49d44b7141 100644 --- a/docs/platforms/javascript/guides/nuxt/profiling/index.mdx +++ b/docs/platforms/javascript/guides/nuxt/profiling/index.mdx @@ -1,8 +1,9 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations." +sidebar_section: features --- diff --git a/docs/platforms/javascript/guides/react-router/index.mdx b/docs/platforms/javascript/guides/react-router/index.mdx index 09148c55e2353..6e3291a074fda 100644 --- a/docs/platforms/javascript/guides/react-router/index.mdx +++ b/docs/platforms/javascript/guides/react-router/index.mdx @@ -26,24 +26,6 @@ If you're using React Router in library mode, follow the instructions in our [Re ## Step 1: Install -Choose the features you want to configure, and this guide will show you how: - - - - - ### Install the Sentry SDK Run the command for your preferred package manager to add the SDK package to your application: @@ -81,6 +63,24 @@ pnpm add @sentry/react-router ## Step 2: Configure +Choose the features you want to configure, and this guide will show you how: + + + + + ### Expose Entry Point Files Before configuring Sentry, you need to make React Router's entry files (`entry.client.tsx` and `entry.server.tsx`) visible in your project. Run this command to expose them: diff --git a/docs/platforms/javascript/guides/react-router/profiling/index.mdx b/docs/platforms/javascript/guides/react-router/profiling/index.mdx index 358ff175b7055..e2d49d44b7141 100644 --- a/docs/platforms/javascript/guides/react-router/profiling/index.mdx +++ b/docs/platforms/javascript/guides/react-router/profiling/index.mdx @@ -1,8 +1,9 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations." +sidebar_section: features --- diff --git a/docs/platforms/javascript/guides/react/index.mdx b/docs/platforms/javascript/guides/react/index.mdx index 84b3aae3aad26..bfff6a42407e2 100644 --- a/docs/platforms/javascript/guides/react/index.mdx +++ b/docs/platforms/javascript/guides/react/index.mdx @@ -17,20 +17,6 @@ categories: ## Install -Choose the features you want to configure, and this guide will show you how: - - - - - ### Install the Sentry SDK Run the command for your preferred package manager to add the Sentry SDK to your application: @@ -53,6 +39,20 @@ pnpm add @sentry/react ## Configure +Choose the features you want to configure, and this guide will show you how: + + + + + ### Initialize the Sentry SDK To import and initialize Sentry, create a file in your project's root directory, for example, `instrument.js`, and add the following code: diff --git a/docs/platforms/javascript/guides/remix/profiling/index.mdx b/docs/platforms/javascript/guides/remix/profiling/index.mdx index 358ff175b7055..e2d49d44b7141 100644 --- a/docs/platforms/javascript/guides/remix/profiling/index.mdx +++ b/docs/platforms/javascript/guides/remix/profiling/index.mdx @@ -1,8 +1,9 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations." +sidebar_section: features --- diff --git a/docs/platforms/javascript/guides/solid/index.mdx b/docs/platforms/javascript/guides/solid/index.mdx index 5e1ffb6533545..0bd3f56f44706 100644 --- a/docs/platforms/javascript/guides/solid/index.mdx +++ b/docs/platforms/javascript/guides/solid/index.mdx @@ -8,24 +8,8 @@ categories: -## Features - -In addition to capturing errors, you can monitor interactions between multiple services or applications by [enabling tracing](/concepts/key-terms/tracing/). You can also get to the root of an error or performance issue faster, by watching a video-like reproduction of a user session with [session replay](/product/explore/session-replay/web/getting-started/). - -Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below. - ## Install - - Sentry captures data by using an SDK within your application's runtime. ```bash {tabTitle:npm} @@ -42,6 +26,20 @@ pnpm add @sentry/solid ## Configure +In addition to capturing errors, you can monitor interactions between multiple services or applications by [enabling tracing](/concepts/key-terms/tracing/). You can also get to the root of an error or performance issue faster, by watching a video-like reproduction of a user session with [session replay](/product/explore/session-replay/web/getting-started/). + +Select which Sentry features you'd like to install in addition to Error Monitoring to get the corresponding installation and configuration instructions below. + + + Configuration should happen as early as possible in your application's lifecycle. To use the SDK, initialize it in your Solid entry point before bootstrapping your app. In a typical Solid project, that is your `index.jsx` file. diff --git a/docs/platforms/javascript/guides/solidstart/profiling/index.mdx b/docs/platforms/javascript/guides/solidstart/profiling/index.mdx index 358ff175b7055..e2d49d44b7141 100644 --- a/docs/platforms/javascript/guides/solidstart/profiling/index.mdx +++ b/docs/platforms/javascript/guides/solidstart/profiling/index.mdx @@ -1,8 +1,9 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations." +sidebar_section: features --- diff --git a/docs/platforms/javascript/guides/svelte/index.mdx b/docs/platforms/javascript/guides/svelte/index.mdx index c25b93d7fea23..6391d42ceb9ec 100644 --- a/docs/platforms/javascript/guides/svelte/index.mdx +++ b/docs/platforms/javascript/guides/svelte/index.mdx @@ -15,20 +15,6 @@ categories: ## Install -Choose the features you want to configure, and this guide will show you how: - - - - - ### Install the Sentry SDK Run the command for your preferred package manager to add the Sentry SDK to your application: @@ -51,6 +37,20 @@ pnpm add @sentry/svelte ## Configure +Choose the features you want to configure, and this guide will show you how: + + + + + To use the SDK, initialize it in your Svelte entry point before bootstrapping your app. In a typical Svelte project, that is your `main.js` or `main.ts` file. ```javascript {tabTitle: Svelte v5+} {filename: main.js} diff --git a/docs/platforms/javascript/guides/sveltekit/profiling/index.mdx b/docs/platforms/javascript/guides/sveltekit/profiling/index.mdx index 358ff175b7055..e2d49d44b7141 100644 --- a/docs/platforms/javascript/guides/sveltekit/profiling/index.mdx +++ b/docs/platforms/javascript/guides/sveltekit/profiling/index.mdx @@ -1,8 +1,9 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations." +sidebar_section: features --- diff --git a/docs/platforms/javascript/guides/sveltekit/sourcemaps/index.mdx b/docs/platforms/javascript/guides/sveltekit/sourcemaps/index.mdx index cac8ae2f55ccc..c6a6328cb9ca9 100644 --- a/docs/platforms/javascript/guides/sveltekit/sourcemaps/index.mdx +++ b/docs/platforms/javascript/guides/sveltekit/sourcemaps/index.mdx @@ -2,6 +2,7 @@ title: Source Maps sidebar_order: 3 description: "Upload your source maps to Sentry to enable readable stack traces in your errors, along with numerous other benefits. Learn more here." +sidebar_section: features --- diff --git a/docs/platforms/javascript/guides/tanstackstart-react/profiling/index.mdx b/docs/platforms/javascript/guides/tanstackstart-react/profiling/index.mdx index 358ff175b7055..e2d49d44b7141 100644 --- a/docs/platforms/javascript/guides/tanstackstart-react/profiling/index.mdx +++ b/docs/platforms/javascript/guides/tanstackstart-react/profiling/index.mdx @@ -1,8 +1,9 @@ --- title: Set Up Profiling sidebar_title: Profiling -sidebar_order: 5000 +sidebar_order: 8 description: "Collect & view performance insights for JavaScript programs with Sentry's Profiling integrations." +sidebar_section: features --- diff --git a/docs/platforms/javascript/guides/vue/index.mdx b/docs/platforms/javascript/guides/vue/index.mdx index 837feb3018a75..4d33cd0613577 100644 --- a/docs/platforms/javascript/guides/vue/index.mdx +++ b/docs/platforms/javascript/guides/vue/index.mdx @@ -11,20 +11,6 @@ categories: ## Step 1: Install -Choose the features you want to configure, and this guide will show you how: - - - - - ### Install the Sentry SDK Run the command for your preferred package manager to add the Sentry SDK to your application: @@ -43,6 +29,20 @@ pnpm add @sentry/vue ## Step 2: Configure +Choose the features you want to configure, and this guide will show you how: + + + + + To initialize Sentry in your Vue application, add the following code snippet to your `main.js`: ```javascript {tabTitle:Vue 3} {filename:main.js} {3, 12-41} diff --git a/redirects.js b/redirects.js index b3d352c95ed0f..c9d95e88ae87a 100644 --- a/redirects.js +++ b/redirects.js @@ -529,23 +529,23 @@ const userDocsRedirects = [ }, { source: '/platforms/javascript/configuration/draining/', - destination: '/platforms/javascript/apis/#flush', + destination: '/platforms/javascript/configuration/apis/#flush', }, { source: '/platforms/javascript/guides/:guide/configuration/draining/', - destination: '/platforms/javascript/guides/:guide/apis/#flush', + destination: '/platforms/javascript/guides/:guide/configuration/apis/#flush', }, { source: '/platforms/javascript/enriching-events/identify-user/', - destination: '/platforms/javascript/apis/#setUser', + destination: '/platforms/javascript/configuration/apis/#setUser', }, { source: '/platforms/javascript/guides/:guide/enriching-events/identify-user/', - destination: '/platforms/javascript/guides/:guide/apis/#setUser', + destination: '/platforms/javascript/guides/:guide/configuration/apis/#setUser', }, { source: '/platforms/javascript/enriching-events/context/', - destination: '/platforms/javascript/apis/', + destination: '/platforms/javascript/configuration/apis/', }, { source: '/platforms/javascript/guides/:guide/enriching-events/context/', @@ -1118,6 +1118,22 @@ const userDocsRedirects = [ source: '/platforms/javascript/guides/:guide/profiling/browser-profiling/', destination: '/platforms/javascript/guides/:guide/profiling/', }, + { + source: '/platforms/javascript/apis/', + destination: '/platforms/javascript/configuration/apis/', + }, + { + source: '/platforms/javascript/guides/:guide/apis/', + destination: '/platforms/javascript/guides/:guide/configuration/apis/', + }, + { + source: '/platforms/javascript/configuration/sampling/', + destination: '/platforms/javascript/sampling/', + }, + { + source: '/platforms/javascript/guides/:guide/configuration/sampling/', + destination: '/platforms/javascript/guides/:guide/sampling/', + }, { source: '/platforms/javascript/guides/:guide/profiling/node-profiling/', destination: '/platforms/javascript/guides/:guide/profiling/', diff --git a/src/components/docPage/index.tsx b/src/components/docPage/index.tsx index 51e1c7fb995da..58366bef8bf6b 100644 --- a/src/components/docPage/index.tsx +++ b/src/components/docPage/index.tsx @@ -67,10 +67,10 @@ export function DocPage({ {sidebar ?? ( )} -
+
)} - +