「Codebase to Course」是一款 Claude Code Skill，能將任何程式庫自動轉換成精美、互動式的單頁 HTML 課程，針對不具傳統電腦科學背景、靠自然語言指令 AI 工具來開發的開發者設計。

目標使用者及應用場景

該工具主要面向「直覺型開發者」——透過向人工智慧編碼工具自然語言指令來建構軟體，卻缺乏傳統資訊科學教育的人。使用者往往已完成某個專案或發現了有趣的開源程式，知道它能運作，但不理解內部工作原理。該課程以追蹤應用實際執行情況的方式教學，而非傳統講座形式。使用者的目標具體而非學術性：

• 更聰明地指導人工智慧編碼工具（做出更優的架構決策）
• 偵測人工智慧的錯誤（識別幻覺現象、發現不良模式）
• 在人工智慧卡住時進行除錯（打破除錯迴圈）
• 與軟體工程師溝通時保持自信

課程呈現方式與互動設計

輸出為單一 HTML 檔案，無相依套件、無安裝步驟、可離線運作，包含下列功能：

• 捲動式模組設計，搭配進度追蹤和鍵盤導航
• 程式碼與平白英文並排對照——左側是實際程式碼，右側標註其含義
• 動畫化的資料流可視化、元件間的互動示意、架構圖表
• 互動式測驗，重點在應用而非死記（例如「你想新增收藏功能——哪些檔案會改變？」）
• 詞彙表工具提示——滑過任何技術術語可查看平白英文定義
• 溫暖、獨特的設計風格，刻意避免典型的紫色漸層人工智慧風格

設計理念與教學方法

該工具顛覆傳統資訊科學教育流程。舊方式是「死記概念多年→最終建構某物→終於看到意義」（多數人在第三步前放棄），新方式是「先建構→體驗它運作→再理解工作原理」。

每個螢幕至少 50% 是視覺化內容，文字區塊最多 2~3 句。若某物能以圖表、動畫或互動元素呈現，就不應該用段落文字。測驗不問「API 是什麼縮寫」，而問「使用者反映在切換頁面後資料過舊——你首先要看什麼？」——測驗考的是能否用所學知識解決新問題。

每個概念搭配專門設計的比喻——資料庫是有目錄卡片的圖書館、認證是檢查身分的保鏢、API 流量限制是有容納上限的夜店——從不重複使用同一個比喻。所有程式碼片段都直接複製自真實程式庫，絕不修改或簡化，讓學習者可開啟實際檔案驗證所學內容。

使用方式與觸發指令

將 codebase-to-course 資料夾複製到 ~/.claude/skills/，在 Claude Code 中開啟任意專案，說出「Turn this codebase into an interactive course」或其他觸發短語如「Explain this codebase interactively」、「Make a course from this project」、「Teach me how this code works」即可啟動。