From fb368b9ec1ca28518a9bc46465d90c7d50b45fa3 Mon Sep 17 00:00:00 2001 From: Alex Krawiec Date: Mon, 20 Jul 2026 14:49:22 -0700 Subject: [PATCH 1/7] feat(homepage): Mock up a bifurcated AI vs manual setup homepage MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Prototype a simplified docs homepage with a bifurcated "get started" UX, inspired by braintrust.dev/docs. Replaces the busy hero + feature/"get to know us" grids with a slim hero and two equal-weight setup paths — Set up with AI and Set up manually — plus a popular-SDKs strip and quick links. Also renders the docs sidebar on the homepage (Product tree as a stand-in). Mockup for design review; the setup CTAs and sidebar contents are placeholders. Co-Authored-By: Claude Opus 4.8 (1M context) --- src/components/home.tsx | 708 ++++++++++++---------------------------- 1 file changed, 213 insertions(+), 495 deletions(-) diff --git a/src/components/home.tsx b/src/components/home.tsx index 9020124ecd2ac8..a679114687bb15 100644 --- a/src/components/home.tsx +++ b/src/components/home.tsx @@ -1,30 +1,14 @@ import Link from 'next/link'; import {Banner} from 'sentry-docs/components/banner'; import {extractPlatforms, getDocsRootNode} from 'sentry-docs/docTree'; -import AiInSentryHero from 'sentry-docs/imgs/AI-in-Sentry.jpeg'; -import AiSentryHero from 'sentry-docs/imgs/ai-sentry-hero.jpeg'; -import PlugImage from 'sentry-docs/imgs/api.png'; -import ChatBubble from 'sentry-docs/imgs/chat-bubble.png'; -import TerminalImage from 'sentry-docs/imgs/cli.png'; -import ConceptsImage from 'sentry-docs/imgs/concepts-reference.png'; -import ErrorMonitoringHero from 'sentry-docs/imgs/error-monitoring-hero.png'; -import GuidesImage from 'sentry-docs/imgs/guides.png'; -import AiImage from 'sentry-docs/imgs/integrate.png'; -import OrganizationImage from 'sentry-docs/imgs/organization.png'; -import CalculatorImage from 'sentry-docs/imgs/pricing.png'; -import RocketImage from 'sentry-docs/imgs/rocket.png'; -import SecurityImage from 'sentry-docs/imgs/security.png'; -import SquiggleSVG from 'sentry-docs/imgs/squiggle.svg'; -import SupportImage from 'sentry-docs/imgs/support.png'; import AskAiSearchParams from './askAiSearchParams'; -import {Card} from './card'; import {Header} from './header'; import {HomeSearchObserver} from './homeSearchVisibility'; import {NavLink, NavLinkProps} from './navlink'; -import {PlatformFilter} from './platformFilter'; import {PlatformIcon} from './platformIcon'; import {Search} from './search'; +import {Sidebar} from './sidebar'; import {SentryWordmarkLogo} from './wordmarkLogo'; export async function Home() { @@ -43,11 +27,12 @@ export async function Home() { {key: 'php-laravel', title: 'Laravel', url: '/platforms/php/guides/laravel/'}, {key: 'apple', title: 'Apple', url: '/platforms/apple/'}, {key: 'android', title: 'Android', url: '/platforms/android/'}, - {key: 'dart', title: 'Dart', url: '/platforms/dart/'}, - {key: 'javascript', title: 'JavaScript', url: '/platforms/javascript/'}, - {key: 'unity', title: 'Unity', url: '/platforms/unity/'}, - {key: 'unreal', title: 'Unreal', url: '/platforms/unreal/'}, + {key: 'go', title: 'Go', url: '/platforms/go/'}, + {key: 'dotnet', title: '.NET', url: '/platforms/dotnet/'}, + {key: 'java', title: 'Java', url: '/platforms/java/'}, + {key: 'ruby', title: 'Ruby', url: '/platforms/ruby/'}, ]; + return (
-
+
+ +
- {/* Hero Banner with Two-Column Layout */} -
- {/* Single decorative squiggle at top right */} - - - {/* Content Container */} -
-
- {/* Left Column: Welcome Text + Search */} -
-

- Welcome To Sentry Docs -

-

- Sentry provides end-to-end distributed tracing, enabling developers to - identify and debug performance issues and errors across their systems - and services. -

- -
- -
- -
- {/* Right Column: SDK Section */} -
-
-
- {mostViewedSDKs.map(platform => ( - - - - {platform.title} - - - ))} -
- - GO TO ALL SDKS - -
+ {/* Hero */} +
+
+

+ Get started with Sentry +

+

+ Sentry provides end-to-end distributed tracing, enabling developers to + identify and debug performance issues and errors across their systems and + services. +

+ +
+
-
+
-
-
- {/* Sentry Features Header */} -

Sentry Features

-
- {/* Debugging in Sentry */} -
- - Debugging in Sentry - -
-

- - Debugging in Sentry - -

-

- Monitor, identify, and resolve errors and performance issues across your - applications using{' '} - - Error Monitoring - - ,{' '} - - Tracing - - ,{' '} - - Session Replay - - ,{' '} - - Logs - - , and{' '} - - more - - . -

+
+ + {/* Bifurcated setup paths */} +
+
+ {/* AI setup */} + +
+ + + +
-
+

Set up with AI

+

+ Let your AI coding assistant install and configure Sentry for you, using + Sentry's agent skills, editor rules, and MCP server. +

+ + Start AI setup + + + - {/* Fix Faster with Seer */} -
- - Fix Faster with Seer - -
-

- - Fix Faster with Seer - -

-

- Debug applications with{' '} - - Seer - - . Get{' '} - - AI-powered answers - {' '} - to questions using your application data in Sentry. Have{' '} - - Autofix - {' '} - generate fixes, and{' '} - - review code changes - {' '} - before merging PRs. -

+ {/* Manual setup */} + +
+ + + + +
-
+

Set up manually

+

+ Choose your platform and follow a step-by-step guide to install the SDK + and send your first event. +

+ + Choose your platform + + + +
+
- {/* AI in Sentry */} -
+ {/* Popular SDKs */} +
+
+

Popular SDKs

+ + View all SDKs + +
+
+ {mostViewedSDKs.map(platform => ( - AI in Sentry + + {platform.title} + -
-

- - AI in Sentry - -

-

- Integrate Sentry into your AI coding assistants using Sentry's{' '} - - Skills - {' '} - and{' '} - - MCP server - {' '} - with your agents. Debug agents and MCP servers by{' '} - - monitoring your AI features - - . -

-
-
-
-
- + ))}
-

Get to know us

-
- {/* Row 1: What is Sentry and Sentry for AI */} - + + {/* Secondary quick links */} +
+
+ - - - - {/* Row 2: Guides and Pricing & Billing */} - - - - - {/* Row 3: Organization Settings and Integrations */} - - - - - {/* Row 4: API and CLI */} - - - - - {/* Row 5: Security, Legal & PII and Concepts & References */} - - - -
-

Talk to us

-
- - -
-
-
+
- {/* First row */}
Security, Legal & PII Contribute @@ -509,7 +198,6 @@ export async function Home() { Changelog
- {/* Second row */}
Sandbox @@ -520,18 +208,6 @@ export async function Home() { Developer docs - - Sentry Discord - - - -

@@ -542,74 +218,116 @@ export async function Home() {

+ + ); } +function Arrow() { + return ( + + + + + ); +} + +function QuickLink({href, title, desc}: {desc: string; href: string; title: string}) { + return ( + +
{title}
+
{desc}
+ + ); +} + function FooterLink({ children, external, From 91c2bcea0dbcfb21feb4346faeab3651804c2205 Mon Sep 17 00:00:00 2001 From: Alex Krawiec Date: Tue, 21 Jul 2026 10:46:26 -0700 Subject: [PATCH 2/7] feat(homepage): Bifurcated homepage without sidebar (variant) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Second mockup option: same simplified, bifurcated AI-vs-manual setup homepage, but without the docs sidebar — the content spans the full width. Companion to the sidebar variant for side-by-side design review. Co-Authored-By: Claude Opus 4.8 (1M context) --- src/components/home.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/src/components/home.tsx b/src/components/home.tsx index a679114687bb15..8374ff4881c2d4 100644 --- a/src/components/home.tsx +++ b/src/components/home.tsx @@ -8,7 +8,6 @@ import {HomeSearchObserver} from './homeSearchVisibility'; import {NavLink, NavLinkProps} from './navlink'; import {PlatformIcon} from './platformIcon'; import {Search} from './search'; -import {Sidebar} from './sidebar'; import {SentryWordmarkLogo} from './wordmarkLogo'; export async function Home() { @@ -41,9 +40,7 @@ export async function Home() { useStoredSearchPlatforms={false} platforms={platforms} /> -
- -
+
@@ -218,8 +215,7 @@ export async function Home() { -
-
+