Skip to content

feat(docs): Update quick start guide template #19295

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
inventarSarah wants to merge 3 commits into
base: master
Choose a base branch
from
+103 −23
Draft

feat(docs): Update quick start guide template #19295

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
03d55db
draft
inventarSarah Sep 8, 2026
778719d
draft feedback
inventarSarah Sep 10, 2026
a156a6f
fix link
inventarSarah Sep 10, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
102 changes: 87 additions & 15 deletions docs/platforms/javascript/guides/ember/index.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,11 @@ Run the command for your preferred package manager to add the Sentry SDK to your

## Configure

Choose the features you want to configure, and this guide will show you how:
### Initialize the SDK

Initializing the Sentry SDK enables core features such as **Error Monitoring**, **Logs**, and **Application Metrics** by default. While Sentry automatically reports errors, you'll need to send logs and metrics manually. We'll show you how that works in steps [#3](#send-logs-optional) and [#4](#send-application-metrics-optional-).

Choose additional features you want to configure, and this guide will show you how to get set up:

<OnboardingOptionButtons
options={[
Comment on lines 40 to 42

@sfanahata sfanahata Sep 10, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's not the worst experience, but something still feels off about having the error monitoring button greyed out, while excluding logs and app metrics from this list. I wonder if we get rid of the error monitoring button since we share that "
Initializing the Sentry SDK enables core features such as Error Monitoring, Logs, and Application Metrics by default." at the top of the section?

Expand All @@ -45,8 +49,6 @@ Choose the features you want to configure, and this guide will show you how:

<Include name="quick-start-features-expandable" />

### Initialize the SDK

<SplitLayout>
<SplitSection>
<SplitSectionText>
Expand All @@ -66,8 +68,8 @@ import * as Sentry from "@sentry/ember";

Sentry.init({
dsn: "___PUBLIC_DSN___",

// ___PRODUCT_OPTION_START___ session-replay

integrations: [
Sentry.replayIntegration(),
// ___PRODUCT_OPTION_START___ user-feedback
Expand All @@ -78,8 +80,8 @@ Sentry.init({
// ___PRODUCT_OPTION_END___ user-feedback
],
// ___PRODUCT_OPTION_END___ session-replay

// ___PRODUCT_OPTION_START___ performance

// Set tracesSampleRate to 1.0 to capture 100%
// of transactions for tracing.
// We recommend adjusting this value in production
Expand Down Expand Up @@ -121,6 +123,85 @@ export default class App extends Application {

<PlatformContent includePath="getting-started-data-collection" />

## Send Logs (Optional)

Logs are enabled by default and let you send, view, and query logs from your app within Sentry.

<SplitLayout>
<SplitSection>
<SplitSectionText>

Use `Sentry.logger` to send logs at different levels, such as `info` or `warn`, and attach a message.
You can pass any attributes you want and search or filter by them later.
Comment thread
inventarSarah marked this conversation as resolved.

See <PlatformLink to="/logs/">Set Up Logs</PlatformLink> for all available logging methods and the syntax for formatting messages.


</SplitSectionText>
<SplitSectionCode>

```javascript
// a simple "info" level log
Sentry.logger.info("User example action completed");

// "warn" log with attributes
Sentry.logger.warn("Slow operation detected", {
operation: "data_fetch",
duration: 3500,
});

// "error" log with attributes
Sentry.logger.error("Validation failed", {
form_field: "email",
reason: "Invalid email",
});
```

</SplitSectionCode>
</SplitSection>
</SplitLayout>


## Send Application Metrics (Optional) <FeatureBadge type="new" />

Application Metrics are enabled by default and allow you to send, view, and query various metrics from your app.

<SplitLayout>
<SplitSection>
<SplitSectionText>

Use `Sentry.metrics` to send counters, gauges, and distributions from your app to Sentry.
You can pass any attributes you want and search or filter by them later.
Comment thread
inventarSarah marked this conversation as resolved.

See <PlatformLink to="/metrics/">Set Up Metrics</PlatformLink> for all available metric types and configuration options.


</SplitSectionText>
<SplitSectionCode>

```javascript
// a simple "count" metric
Sentry.metrics.count("checkout.failed", 1)

// "gauge" metric with one attribute
Sentry.metrics.gauge("time_since_refresh", 4, { unit: "hour" });

// "count" metric with multiple attributes attached
Sentry.metrics.count("api_calls", 1, {
attributes: {
endpoint: "/api/orders",
user_tier: "pro",
region: "us-west",
user_id: user.id,
order_id: order.id,
},
});
```

</SplitSectionCode>
</SplitSection>
</SplitLayout>

## Verify Your Setup

Let's test your setup and confirm that Sentry is working correctly and sending data to your Sentry project.
Expand Down Expand Up @@ -211,14 +292,6 @@ export default class ApplicationController extends Controller {

</OnboardingOption>

<OnboardingOption optionId="logs">

<Include name="logs/javascript-quick-start-verify-logs-splitlayout" />

</OnboardingOption>

<Include name="metrics/javascript-quick-start-verify-metrics-splitlayout" />

### View Captured Data in Sentry

Now, head over to your project on [Sentry.io](https://sentry.io) to view the collected data (it takes a couple of moments for the data to appear).
Expand All @@ -233,9 +306,8 @@ Now's a good time to customize your setup and look into more advanced topics.
Our next recommended steps for you are:

- Explore [practical guides](/get-started/guides/) on what to monitor, log, track, and investigate after setup
- Learn how to [manually capture errors](/platforms/javascript/guides/ember/usage/)
- <PlatformLink to="/agent-tracing/">Set up Agent Tracing</PlatformLink> to monitor your AI systems
- Continue to [customize your configuration](/platforms/javascript/guides/ember/configuration/)
- Get familiar with [Sentry's product features](/product/) like tracing, insights, and alerts

<Expandable permalink={false} title="Are you having problems setting up the SDK?">

Expand Down
6 changes: 3 additions & 3 deletions includes/quick-start-features-expandable.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@ import { FeatureInfo } from "sentry-docs/components/featureInfo";
"profiling",
"sessionReplay",
"logs",
"userFeedback",
"metrics"
"metrics",
"userFeedback"
]}
type="learnMore"
/>
Expand All @@ -21,7 +21,7 @@ import { FeatureInfo } from "sentry-docs/components/featureInfo";
<PlatformSection supported={["javascript", "javascript.angular", "javascript.electron", "javascript.ember", "javascript.gatsby", "javascript.nuxt", "javascript.react", "javascript.solid", "javascript.solidstart", "javascript.svelte", "javascript.sveltekit", "javascript.tanstackstart-react", "javascript.vue"]}>

<FeatureInfo
features={["issues", "tracing", "sessionReplay", "logs", "userFeedback", "metrics"]}
features={["issues", "tracing", "sessionReplay", "logs", "metrics", "userFeedback"]}
type="learnMore"
/>

Expand Down
8 changes: 4 additions & 4 deletions includes/quick-start-locate-data-expandable.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { FeatureInfo } from "sentry-docs/components/featureInfo";

<Expandable title="Need help locating the captured errors in your Sentry project?">
<Expandable title="Need help locating captured data in your Sentry project?">

<PlatformSection supported={["javascript.astro", "javascript.react-router", "javascript.remix"]}>

Expand All @@ -11,8 +11,8 @@ import { FeatureInfo } from "sentry-docs/components/featureInfo";
"profiling",
"sessionReplay",
"logs",
"userFeedback",
"metrics"
"metrics",
"userFeedback"
]}
type="findInSentry"
/>
Expand All @@ -21,7 +21,7 @@ import { FeatureInfo } from "sentry-docs/components/featureInfo";
<PlatformSection supported={["javascript", "javascript.angular", "javascript.electron", "javascript.ember", "javascript.gatsby", "javascript.nuxt", "javascript.react", "javascript.solid", "javascript.solidstart", "javascript.svelte", "javascript.sveltekit", "javascript.tanstackstart-react", "javascript.vue"]}>

<FeatureInfo
features={["issues", "tracing", "sessionReplay", "logs", "userFeedback", "metrics"]}
features={["issues", "tracing", "sessionReplay", "logs", "metrics", "userFeedback"]}
type="findInSentry"
/>

Expand Down
10 changes: 9 additions & 1 deletion src/components/onboarding/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -354,7 +354,15 @@ export function OnboardingOptionButtons({
const codeContext = useContext(CodeContext);
const {emit} = usePlausibleEvent();

const normalizedOptions = initialOptions
// temporary filter to remove error-monitoring from rendering even if it is requested
const filteredOptions = initialOptions.filter(option => {
if (typeof option === 'string') {
return option !== 'error-monitoring';
}
return true;
});

const normalizedOptions = filteredOptions
.map(option => {
if (typeof option === 'string') {
return {
Expand Down
Loading