Skip to content

docs: add a hands-on 'Build a Server Data Inspector' tutorial - #290

Merged
antfu merged 8 commits into
mainfrom
docs/project-structure
Aug 26, 2026
Merged

docs: add a hands-on 'Build a Server Data Inspector' tutorial#290
antfu merged 8 commits into
mainfrom
docs/project-structure

Conversation

@antfubot

@antfubot antfubot commented Aug 25, 2026

Copy link
Copy Markdown
Collaborator

What

Adds a hands-on, from-zero tutorial to the top of the guide, so newcomers get a build-along path before the reference pages.

Tutorial: Build a Server Data Inspector (/guide/tutorial-server-data-inspector)

Builds a devtool from an empty folder, then grows it one capability at a time — each step one new concept:
defineDevframe + ctx.rpc.register → a client via connectDevframe() → run it with devframeViteBridge → a hub dock (clientAssets + viteDevframeHub) → a static build (snapshot + createBuild) → a standalone server (createDevServer) → a CLI (createCac).

Placement

Slots in as guide page 1 (after the Introduction): Introduction → Tutorial → Devframe Definition → RPC → … The reference pages are renumbered accordingly (git-tracked renames; links use path names, so nothing breaks), and the intro's "What's next" links to it.

Notes

  • Docs-only and fully type-along; every code block is complete and grounded in the real APIs (verified against source: the Vite bridge/hub plugins, createBuild/createDevServer/createCac).
  • A second tutorial on client scripts / host↔panel communication / the messages feed was drafted here but removed for now — too much for an intro. It can return later as a more advanced page.
  • Supersedes the earlier "Project Structure" page that briefly lived on this branch, dropped per review.

This PR was created with the help of an agent.

@vercel

vercel Bot commented Aug 25, 2026

Copy link
Copy Markdown

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

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
devframe Ignored Ignored Preview Aug 26, 2026 4:03am

Adds a step-by-step, human-oriented guide that builds a simplified
data-inspector devframe from zero to an MVP (client + RPC over a Vite
bridge), then layers on a hub dock, static build, standalone server, and
CLI — one concept per step. Slots in as guide page 1 (after the intro);
drops the earlier Project Structure page per review.
@antfubot antfubot changed the title docs: add Project Structure guide page docs: add 'Build a Data Inspector' tutorial guide page Aug 26, 2026
…messages

Adds 'An Inspector That Talks to the Page' as guide page 2: a self-contained,
vanilla-TS walkthrough building an accessibility inspector whose in-page agent
(a dock client script) scans the host page, coordinates with the panel iframe
over a same-origin BroadcastChannel, and reports scans to the hub messages feed
via ctx.messages. Renumbers the reference pages down by one.
@antfubot antfubot changed the title docs: add 'Build a Data Inspector' tutorial guide page docs: add two hands-on tutorials (Data Inspector + A11y Inspector) Aug 26, 2026
antfu and others added 3 commits August 26, 2026 12:44
Polish the server data inspector tutorial for natural flow (fix awkward
phrasings and grammar, normalize 'Step N — Title' headers, correct the stale
src/devframe.ts references to src/data-inspector.ts) and fix the renamed
tutorial's link in the intro. Apply the same voice and closing conventions to
the a11y tutorial.
Drop the second tutorial (client scripts / host↔panel comms / messages) — too
much for an intro tutorial. Renumber the reference pages back up by one and
remove its link from the intro.
@antfubot antfubot changed the title docs: add two hands-on tutorials (Data Inspector + A11y Inspector) docs: add a hands-on 'Build a Server Data Inspector' tutorial Aug 26, 2026
@antfu
antfu merged commit 7c73b20 into main Aug 26, 2026
11 checks passed
@antfu
antfu deleted the docs/project-structure branch August 26, 2026 04:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants