Docs: Rework Get Started page CTA positioning and copy

[Sidnioulz]

What I did

Do not merge that just yet. Content changes for growth experiment.

Checklist for Contributors

Testing

N/A

Documentation

• Add or update documentation reflecting your changes
• If you are deprecating/removing a feature, make sure to update
  MIGRATION.MD

Checklist for Maintainers

• When this PR is ready for testing, make sure to add ci:normal, ci:merged or ci:daily GH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found in code/lib/cli-storybook/src/sandbox-templates.ts

• Make sure this PR contains one of the labels below:

  Available labels

  • bug: Internal changes that fixes incorrect behavior.
  • maintenance: User-facing maintenance tasks.
  • dependencies: Upgrading (sometimes downgrading) dependencies.
  • build: Internal-facing build tooling & test updates. Will not show up in release changelog.
  • cleanup: Minor cleanup style change. Will not show up in release changelog.
  • documentation: Documentation only changes. Will not show up in release changelog.
  • feature request: Introducing a new feature.
  • BREAKING CHANGE: Changes that break compatibility in some way with current major version.
  • other: Changes that don't fit in the above categories.

🦋 Canary release

This PR does not have a canary release associated. You can request a canary release of this pull request by mentioning the @storybookjs/core team here.

core team members can create a canary release here or locally with gh workflow run --repo storybookjs/storybook publish.yml --field pr=<PR_NUMBER>

Summary by CodeRabbit

• Documentation
  • Streamlined installation instructions with command-focused guidance for new users
  • Added Supported Frameworks section highlighting framework compatibility
  • Introduced Additional Resources section for further learning
  • Reorganized documentation structure for improved navigation and clarity

[coderabbitai]

📝 Walkthrough

Walkthrough

Documentation homepage restructuring that updates installation instructions to be command-focused, removes introductory content, adds new sections for Supported Frameworks and Additional Resources, swaps code snippet variants to target new users, and reorganizes overall page layout with new components.

Changes

Cohort / File(s)	Change Summary
Documentation homepage restructuring docs/index.mdx	Removed "What is Storybook?" intro section; replaced generic install description with command-focused instruction; changed code snippet to use "new-users" variant; added "Supported Frameworks" section with HomeRenderers component; inserted HomeConcepts component in Main concepts area; added "Additional resources" section with HomeResources component; reorganized overall page structure

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

• Single documentation file modified with content restructuring and component updates
• No logic changes or functional implications
• Changes are cosmetic and structural in nature

Tip

📝 Customizable high-level summaries are now available in beta!

You can now customize how CodeRabbit generates the high-level summary in your pull requests — including its content, structure, tone, and formatting.

• Provide your own instructions using the high_level_summary_instructions setting.
• Format the summary however you like (bullet lists, tables, multi-section layouts, contributor stats, etc.).
• Use high_level_summary_in_walkthrough to move the summary from the description to the walkthrough section.

Example instruction:

"Divide the high-level summary into five sections:

1. 📝 Description — Summarize the main change in 50–60 words, explaining what was done.
2. 📓 References — List relevant issues, discussions, documentation, or related PRs.
3. 📦 Dependencies & Requirements — Mention any new/updated dependencies, environment variable changes, or configuration updates.
4. 📊 Contributor Summary — Include a Markdown table showing contributions:
   | Contributor | Lines Added | Lines Removed | Files Changed |
5. ✔️ Additional Notes — Add any extra reviewer context.
   Keep each section concise (under 200 words) and use bullet or numbered lists for clarity."

Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later.

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 8f6ab08 and fdb87d2.

📒 Files selected for processing (1)

• docs/index.mdx (1 hunks)

🧰 Additional context used

🧠 Learnings (2)

📚 Learning: 2025-11-05T09:38:47.712Z

Learnt from: Sidnioulz
Repo: storybookjs/storybook PR: 32458
File: code/core/src/components/components/Select/Select.tsx:200-204
Timestamp: 2025-11-05T09:38:47.712Z
Learning: Repo: storybookjs/storybook — Guidance: Until Storybook 11 is released, do not suggest using React.useId anywhere (e.g., in code/core/src/components/components/Select/Select.tsx) to maintain compatibility with React 17 runtimes. Prefer advising: accept a caller-provided props.id and, if needed, generate a client-only fallback id to minimize SSR hydration issues — but avoid useId. Resume prompting for useId after Storybook 11.

Applied to files:

• docs/index.mdx

📚 Learning: 2025-11-05T09:37:25.920Z

Learnt from: Sidnioulz
Repo: storybookjs/storybook PR: 32458
File: code/core/src/components/components/tooltip/WithTooltip.tsx:54-96
Timestamp: 2025-11-05T09:37:25.920Z
Learning: Repo: storybookjs/storybook — In code/core/src/components/components/tooltip/WithTooltip.tsx, the legacy WithTooltip implementation is intentionally reintroduced for backward compatibility and is deprecated; maintainers (per Sidnioulz) do not want maintenance or improvements on it. Prefer WithTooltipNew/Popover; avoid suggesting changes to WithTooltip.* going forward.

Applied to files:

• docs/index.mdx

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

• GitHub Check: Danger JS
• GitHub Check: Core Unit Tests, windows-latest

🔇 Additional comments (3)

docs/index.mdx (3)

1-30: Clarify discrepancy with AI-generated summary.

The AI summary claims "removed introductory blurb and the 'What is Storybook?' subsection," but line 6 still contains the introductory paragraph. Confirm whether the summary is outdated or if the annotated code view is incomplete.

---

16-30: CTA positioning restructuring looks good.

The reordering and addition of new sections align with the growth experiment objectives: moving framework selection and concepts higher on the page improves discoverability for new users, and the "Additional resources" section provides natural next steps. The copy changes at line 10 are also more action-oriented.

---

10-12: Verify that CodeSnippets component supports the variant prop.

The code uses variant="new-users" on the CodeSnippets component. Documentation indicates CodeSnippets supports filename, language, renderer, packageManager, tabTitle, path, and usesCsf3 props, but does not list variant as a supported attribute. Confirm this prop is intentionally supported in your Storybook version or that the component gracefully ignores it.

The referenced snippet file exists at docs/_snippets/create-command.md, and the new HomeRenderers, HomeConcepts, and HomeResources components appear properly integrated as globally available MDX components.

[nx-cloud]

View your CI Pipeline Execution ↗ for commit 0115ec1

Command	Status	Duration	Result
nx run-many -t compile --parallel=3	✅ Succeeded	45s	View ↗

---

☁️ Nx Cloud last updated this comment at 2025-12-01 15:12:47 UTC

[kylegach]

These changes are great! Thanks, @Sidnioulz!