feat: revamp doc home

[paulleseute]

Most docs visitors bounce within a minute. We wanted a homepage that hooks developers fast: show them real code, make the value obvious, and give them a clear path forward before they leave.

The structure follows the actual developer journey: see the code → understand the paradigm → build → test → ship → go deeper. Instead of explaining the framework upfront, let the code and the workflow do the talking.

The tone is intentionally a bit salesy for a docs page because this docs home is actually our landing page.

Structure:

• Intro — Title, value proposition and two CTAs. No intro paragraph but instead an invitation to use the framework by scaffolding manually or using the Skill.
• Code preview — a real server + widget pair right away. "Show not tell" example to communicate the DX faster than a description.
• Design — briefly frame the new challenge (user + UI + model) and two key Skybridge benefits: cross-runtime compatibility and familiar React patterns. No implementation details, just the mental model.
• Build — scaffold command + Skill install. Two entry points depending on whether you're starting fresh or migrating.
• Test and ship — the full loop in 3 steps: local DevTools → tunnel + LLM playground → deploy. Shows that Skybridge covers the whole path to production.
• Keep learning — cards to the guides for when you're actively building and need deeper patterns.

Every section ends with clear "go further" cards. The Skill is woven into each phase (design, build) as a natural option, not a separate explainer.

[mintlify]

Preview deployment for your docs. Learn more about Mintlify Previews.

Project	Status	Preview	Updated (UTC)
skybridge-staging	🟢 Ready	View Preview	Mar 27, 2026, 11:08 AM

[greptile-apps]

Grammar issue: missing article and informal phrasing

Two small grammatical issues on this line:

1. "bootstrapping fresh project" is missing the article "a"
2. "we got you covered" should be "we've got you covered" for more natural, grammatically correct phrasing

Suggested change

	You can also empower your AI sidekick with the [Skybridge Skill](/devtools/skills) to do the heavy lifting. From bootstrapping fresh project to **migrating entire codebases**, we got you covered:
	You can also empower your AI sidekick with the [Skybridge Skill](/devtools/skills) to do the heavy lifting. From bootstrapping a fresh project to **migrating entire codebases**, we've got you covered:

Prompt To Fix With AI

This is a comment left during a code review.
Path: docs/home.mdx
Line: 114

Comment:
**Grammar issue: missing article and informal phrasing**

Two small grammatical issues on this line:
1. "bootstrapping fresh project" is missing the article "a"
2. "we got you covered" should be "we've got you covered" for more natural, grammatically correct phrasing

```suggestion
You can also empower your AI sidekick with the [Skybridge Skill](/devtools/skills) to do the heavy lifting. From bootstrapping a fresh project to **migrating entire codebases**, we've got you covered:
```

How can I resolve this? If you propose a fix, please make it concise.

_{Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!}

[greptile-apps]

Unexplained relative import in introductory example

The widget example imports useToolInfo from a relative path "../helpers.js" rather than from the skybridge/web package. On the homepage — which is typically a reader's first exposure to Skybridge — this may confuse newcomers who don't yet know what helpers.js is, where it comes from, or whether they need to create it themselves.

If helpers.js is generated by the scaffold template, a brief inline comment would clarify this:

Suggested change

	import { useToolInfo } from "../helpers.js";
	import { useToolInfo } from "../helpers.js"; // generated by the skybridge template

Alternatively, if useToolInfo is re-exported from skybridge/web, importing it directly from there would make the example self-contained and immediately runnable for a reader following along.

Prompt To Fix With AI

This is a comment left during a code review.
Path: docs/home.mdx
Line: 50

Comment:
**Unexplained relative import in introductory example**

The widget example imports `useToolInfo` from a relative path `"../helpers.js"` rather than from the `skybridge/web` package. On the homepage — which is typically a reader's first exposure to Skybridge — this may confuse newcomers who don't yet know what `helpers.js` is, where it comes from, or whether they need to create it themselves.

If `helpers.js` is generated by the scaffold template, a brief inline comment would clarify this:

```suggestion
import { useToolInfo } from "../helpers.js"; // generated by the skybridge template
```

Alternatively, if `useToolInfo` is re-exported from `skybridge/web`, importing it directly from there would make the example self-contained and immediately runnable for a reader following along.

How can I resolve this? If you propose a fix, please make it concise.

_{Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!}

[greptile-apps]

Missing newline at end of file

The file is missing a trailing newline (visible in the diff as \ No newline at end of file). This is a POSIX convention and can cause noisy diffs or warnings in some tools.

Prompt To Fix With AI

This is a comment left during a code review.
Path: docs/home.mdx
Line: 180

Comment:
**Missing newline at end of file**

The file is missing a trailing newline (visible in the diff as `\ No newline at end of file`). This is a POSIX convention and can cause noisy diffs or warnings in some tools.

How can I resolve this? If you propose a fix, please make it concise.

_{Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!}