Skip to content

feat(js): Add a framework selector to the Node.js, Bun and Deno quick starts - #19974

Merged
JPeer264 merged 11 commits into
jp/poc-c-runtime-quick-startsfrom
jp/poc-selector-2-all-frameworks
Nov 10, 2026
Merged

JPeer264 merged 11 commits into
jp/poc-c-runtime-quick-startsfrom
jp/poc-selector-2-all-frameworks

Conversation

@JPeer264

@JPeer264 JPeer264 commented Oct 14, 2026 •

Copy link
Copy Markdown
Member

DESCRIBE YOUR PR

This turns the Express, Fastify, Hapi and Koa guides into landing pages that link to the Node.js, Bun and Deno quick starts, because the runtime SDKs instrument these frameworks automatically. Their subpages redirect to the Node.js guide.

Image

The runtime quick starts get a "Framework" dropdown with 2 groups:

  • Set up with this guide (Express, Fastify, Koa, Hapi): swaps in the framework's snippets, such as error capture and the test route, and labels each changed block. A line under the dropdown links to the changed steps. The selection is kept in ?framework=express.
  • Set up with its own guide (Next.js, Nuxt, Hono, Elysia and others): opens that framework's guide. On Cloudflare, the dropdown replaces the list of framework guides.

FWIW the dropdown is onkly for humans. Agents already find everything in the respective guide, such as Express. Meta frameworks, that are not based on an integration are baked-in into the markdown, so agents finds it too: https://sentry-docs-git-jp-poc-selector-2-all-frameworks.sentry.dev/platforms/javascript/guides/node.md

Image Image

In addition, /platform-redirect/ links for these guides go to the Node.js page when the guide does not have the requested page.

The selector is ported from #19683.

Known issues

  • Express, Fastify, Koa and Hapi are not in the Cloudflare dropdown, because they have no tested setup on Workers.
  • The table of contents does not show headings that only exist in a swapped-in snippet.
  • The framework snippets load in the browser, so the .md export and agents get only the runtime steps. The setup code is the same for every framework, only the examples differ.

IS YOUR CHANGE URGENT?

Help us prioritize incoming PRs by letting us know when the change needs to go live.
Select exactly one option. For deadlines, replace YYYY-MM-DD with the due date. You can update this information later by editing the PR description.

  • Urgent deadline (GA date, etc.): YYYY-MM-DD
  • Other deadline: YYYY-MM-DD
  • No deadline: Not urgent, can wait up to 1 week+

SLA

  • Teamwork makes the dream work, so please add a reviewer to your PRs.
  • Please give the docs team up to 1 week to review your PR unless you've supplied a deadline.

Thanks in advance for your help!

PRE-MERGE CHECKLIST

Make sure you've checked the following before merging your changes:

  • Checked Vercel preview for correctness, including links
  • PR was reviewed and approved by any necessary SMEs (subject matter experts)
  • PR was reviewed and approved by a member of the Sentry docs team

@vercel

vercel Bot commented Oct 14, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
develop-docs Ready Ready Preview Nov 10, 2026 12:59pm UTC
sentry-docs Ready Ready Preview Nov 10, 2026 12:59pm UTC

Request Review

@github-actions github-actions Bot added the Priority: Normal Docs review has no urgent deadline label Oct 14, 2026
@codeowner-assignment
codeowner-assignment Bot requested a review from a team October 14, 2026 16:22
@JPeer264
JPeer264 force-pushed the jp/poc-selector-2-all-frameworks branch from 47dcefa to 50f36a6 Compare October 21, 2026 09:09
@JPeer264 JPeer264 changed the title docs(js): [Experiment] Server framework landing pages with a framework selector feat(js): Add a framework selector to the Node.js, Bun and Deno quick starts Oct 21, 2026
@JPeer264
JPeer264 force-pushed the jp/poc-selector-2-all-frameworks branch from 50f36a6 to b7f15bd Compare October 21, 2026 11:37
@JPeer264
JPeer264 changed the base branch from master to jp/poc-c-runtime-quick-starts October 21, 2026 11:37
@JPeer264
JPeer264 added this pull request to stack #20127 October 21, 2026 11:38
@JPeer264
JPeer264 force-pushed the jp/poc-selector-2-all-frameworks branch from c64ebf4 to 5df14a0 Compare October 21, 2026 12:13
@JPeer264
JPeer264 force-pushed the jp/poc-selector-2-all-frameworks branch from a08a7c5 to 2aa5701 Compare October 25, 2026 22:25
@cursor

cursor Bot commented Nov 10, 2026

Copy link
Copy Markdown
Contributor

Getting ready to monitor this change · Rollout details

Status Service Environment
⏳ Getting ready to monitor this change

JPeer264 and others added 11 commits November 10, 2026 13:48
… starts

The Express, Fastify, Hapi and Koa guides become landing pages that link
to the Node.js, Bun and Deno quick starts, because the runtime SDKs
instrument these frameworks automatically. Their subpages redirect to the
Node.js guide, and /platform-redirect/ links for these guides go to the
Node.js page when the guide does not have the requested page.

The runtime quick starts get a Framework dropdown. Selecting Express,
Fastify, Koa or Hapi swaps in the framework's snippets, which a static API
route serves per runtime and framework. Frameworks with their own SDK,
such as Next.js or Hono, open their own guide. On Cloudflare, the dropdown
replaces the list of framework guides.

Co-Authored-By: Francesco Novy <francesco.novy@sentry.io>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
Each entry of the framework selector shows the icon of its platform, also
in the selected value. The docs did not use the Hydrogen icon of
platformicons yet, so this registers it.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
The selector renders inside the page content, so the `.prose img` styles
for content images also applied to its icons.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
After a framework is selected, a line under the dropdown names the steps
that changed and links to them. Each changed block gets a "For <framework>"
label, a left border and a short highlight, so the change is visible and
Ctrl+F finds the framework name. The API route now returns a `changed`
flag, so blocks that are the same as without a framework are not marked.

The default entry is now "No framework", and the dropdown uses the same
arrow icon as the sidebar platform selector.

The dropdown works with the keyboard. Radix finds the options for the
arrow keys and typeahead only inside a `Viewport`, so the options are in
one now, and the focused option is highlighted. The summary is a
`role="status"` region, so screen readers announce it, and the icons are
hidden from screen readers.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
The Koa install snippet still had the old feature options, so selecting
Koa showed an install command without `@sentry/profiling-node`, while the
config snippet uses `nodeProfilingIntegration()`. Koa installs the same
packages as Node.js, so Koa now uses the Node.js snippet.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
The framework selector on the Cloudflare quick start links to the
Cloudflare quick starts in the framework guides. The old Cloudflare >
Frameworks URLs only redirect there.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
The tests fail when a framework selector entry links to a page that does
not exist, or when a guide has quick starts for more than one runtime and
one of them is missing from the framework selector of its runtime.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
The framework selector renders its options only while it's open, and its
guide entries navigate with the router. So the page HTML, and with it the
Markdown export for AI agents, had no links to the framework guides. On
the Cloudflare quick start, which the old Cloudflare > Frameworks URLs
redirect to, this dropped every link to the framework guides.

The selector now also renders its guides as plain links that are hidden
from people, who use the dropdown.

Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
The Markdown export showed the dropdown's label as a lone "Framework"
line. It now skips the dropdown and keeps only the guide links.

Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
The Fastify error handler page moved into the Fastify integration page, so
the link now points there. It stays a PlatformLink, like before.

Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
The framework versions of the Node.js, Bun and Deno quick starts only show
up after selecting a framework, so changes to them are easy to miss in
review. Document how the selector resolves framework files, and check in
a test that every switchable include path is listed in RUNTIMES.

Co-Authored-By: Jan Peer Stöcklmair <jan.peer@sentry.io>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

This branch was successfully deployed

2 active deployments
Preview – sentry-docs — 4a89b0fd Deployed Nov 10, 2026 by vercel[bot]
Preview – develop-docs — 4a89b0fd Deployed Nov 10, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Priority: Normal Docs review has no urgent deadline

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants