update

pages/demo/webmcp-project.md

@@ -0,0 +1,40 @@
+# Demo 3：WebMCP 原始工程能跑起来
+
+<div class="grid grid-cols-[1.05fr_0.95fr] gap-8 mt-8">
+
+<div class="card">
+<div class="font-semibold mb-3">工程文件</div>
+
+```txt
+public/demo/webmcp/
+├── index.html   # 业务 UI + 声明式表单工具
+├── styles.css   # 演示界面样式
+└── app.js       # registerTool + mock runtime + 执行日志
+```
+
+</div>
+
+<div class="card-blue">
+<div class="font-semibold mb-3">运行入口</div>
+<div class="space-y-3 text-sm">
+
+- 启动：`pnpm dev`
+- 打开：`/demo/webmcp/index.html`
+- 无 WebMCP 环境：走本地 mock runtime
+- 有 WebMCP 环境：优先调用 `navigator.modelContext`
+
+</div>
+</div>
+
+</div>
+
+<div class="mt-8 card-green text-sm">
+这页要现场打开工程，不只讲链接。观众能看到“页面 UI”和“Agent 工具视角”同时存在。
+</div>
+
+<!--
+现场建议：
+1. 先打开 http://localhost:3030/demo/webmcp/index.html 或实际 dev server URL。
+2. 展示左侧 HTML 表单和右侧工具列表。
+3. 再切到 app.js，解释 registerTool 的 name / description / inputSchema / execute。
+-->