用 AI 做單檔 HTML、一鍵托管於 tmuh.ai

從 Claude Cowork 的創意對談、Design 的視覺產出，到 Claude Code 完成上傳 —— 整條流程都在 Claude Desktop 裡， 5 分鐘從概念到上線。

看看別人在做什麼

這些頁面都是 teach-server 上實際存在的作品。

三者是 Claude Desktop 裡平行的頁籤，由你手動切換與整合。Cowork 是創意主場；要視覺稿時另開 Design、把輸出帶回 Cowork；頁面成型後切到 Code 完成上傳。

Claude Design 另開頁籤

●

▭

↓ 輸出素材（圖、排版、動態 preview）

Claude Cowork 創意主場

幫我做一頁量子糾纏互動解釋，給高中生

想像「一對共舞的球」。先定結構：標題＋球連線動畫＋AI 問答。

我剛在 Design 畫了視覺稿（附圖），排版用這個

收到。我把控制元件、GPT-4o 問答整合到一個 HTML 檔，等等切到 Code 上傳。

→切換到 code、指向同資料夾

Claude Code 執行層

$ read page.html

$ audit → ok

$ POST /api/pages

→ /u/you/slug/

→上傳

tmuh.ai live page

⚡

Instant hosting

上傳 5 秒即生效。沒有 build、沒有 deploy pipeline、沒有 git push——POST /api/pages 就完事。

🤖

Per-page AI proxy

頁面 JS 呼叫 /api/ai/v1/chat/completions，支援 gpt、o1/o3、gemini。每頁自訂密碼保護、使用者有日配額上限。

📦

Single HTML, ≤ 5 MB

inline CSS/JS、data: URI、https CDN。CSP 嚴格但清楚，agent 會幫你 audit 過。

✉️

Invite-only quality

admin 手動發邀請，每位作者有自己的 /u/<name>/ 前綴，不會被洗版。

構思
打開 Cowork，丟素材（文字、圖、參考資料）給 Claude。跟它對談出頁面的主題、對象、結構、互動細節。這一步產出的是頁面的「概念定稿」。
視覺化
需要具體排版時，你自己在 Claude Desktop 另開 Design 頁籤做個視覺稿（artboard、色彩、動態 preview）。完成後把 Design 的輸出（截圖、匯出檔、文字描述）貼回 Cowork 對話當 reference，繼續發展內容。Cowork 不會「呼叫」Design，整合由你做。
交付
當頁面 HTML 接近完成，切到 Code 並指向同一個工作資料夾。Code 是執行層：補腳本細節、讀檔、做 CSP 審查、準備上傳。這時 Cowork 的創意任務結束。
托管
Code 讀 https://tmuh.ai/llms.txt 取得 API 規格、向你要一次密碼、算 hash 後 POST /auth/login 拿 api-key、最後 POST /api/pages 上傳。即刻生效於 /u/<你>/<slug>/。

admin 看到後會決定是否發邀請連結給你（手動）。同一個 email 在處理前只能投一次。