# 影片筆記：Codex + Obsidian：从 0 构建 AI 智能体 Dashboard，一键调用 Claude Code、Skill、RSS 和 GitHub

## 一句話總結

影片介紹如何利用 AI 編程助手（如 Codex、Claude Code）從零構建一個深度集成智能體的 Obsidian Dashboard 插件，實現從 UI 原型設計、插件編寫部署到一鍵調用智能體執行 Skill（如 Deep Research、資料攝入）、拉取外部 API 數據及知識庫健康檢查的全流程自動化。

## 核心重點

1.  **智能體操作系統概念**：傳統 Markdown + DataviewJS 製作的主頁無法與 AI 互動，新的「智能體操作系統」需深度集成智能體，支持一鍵運行腳本、調用 Skill、顯示外部信息（YouTube、Reddit、GitHub、RSS）及知識庫健康檢查。
2.  **四步構建流程**：
    *   **環境初始化**：下載官方插件樣例，安裝依賴及 Skills（frontend-design skill、Obsidian 插件開發 skill），初始化項目並寫入 `AGENTS.md` 賦予 Codex 最高權限。
    *   **UI 原型設計**：使用 `frontend-design skill` 或 `image2_UI_skill`（像素級複製截圖）生成 HTML 原型。
    *   **插件編寫與部署**：根據原型編寫 `main.js`、`styles.css`、`manifest.json`，部署至 Obsidian 插件目錄並加載。
    *   **功能實現**：包括基礎顯示（熱力圖、任務列表）、智能體調用（CLI 調用 Claude Code 執行 Ingest、Deep Research）、外部 API 調用（RSS、GitHub）及知識庫健康檢查（孤島筆記、死鏈、元數據）。
3.  **技術架構**：Obsidian 插件本質為三個文件，無需使用 Superpower、ECC 等厚重編程框架。通過命令行接口（CLI）調用智能體是核心機制。
4.  **趨勢**：LLM Wiki 理念成為主流，硅谷技術圈層深入使用 Obsidian 並與智能體集成，AI 時代智能體全面接管私人知識庫。

## 詳細大綱

### 一、 背景與理念
*   **傳統方法的局限性**：過去使用 Markdown + DataviewJS 製作 Obsidian 主頁，無法與 AI 智能體關聯。
*   **智能體操作系統概念**：
    *   不僅實現傳統主頁功能。
    *   深度集成智能體，支持一鍵運行腳本、調用 Skill。
    *   顯示外部信息（YouTube、Reddit、GitHub、RSS）。
    *   知識庫健康檢查（結構性問題、孤島筆記、死鏈、元數據）。
    *   支持多種配色適配 Obsidian 主題。

### 二、 技術原理與工具
*   **核心工具**：
    *   **Codex**：主要使用的 AI 編程助手。
    *   **Claude Code**：可轉接智譜 GLM5.2 使用。
    *   **Obsidian**：筆記軟件，插件本質為三個文件。
*   **插件結構**：
    *   `main.js`
    *   `styles.css`
    *   `manifest.json`
    *   無需使用 Superpower、ECC 等厚重編程框架。

### 三、 構建流程（四步法）

#### 步驟 1：環境初始化
*   新建空白文件夾，在 Codex 中打開。
*   下載 Obsidian 官方 GitHub 插件倉庫樣例。
*   執行 `npm install` 和 `npm run build`。
*   安裝 Skills：
    *   **frontend-design skill**（Anthropic 發布）：用於設計 UI。
    *   **Obsidian 插件開發 skill**。
*   初始化項目，在 `AGENTS.md` 中寫入項目規則，賦予 Codex 最高權限。

#### 步驟 2：創建 UI 界面原型
*   使用 **frontend-design skill** 創建界面原型。
*   功能模塊示例：
    *   熱力圖（傳統功能）。
    *   按鈕（Deep Research、拉取 RSS、創建日記）。
    *   數據圖表、文件列表。
    *   具體案例：今日 Task、GitHub 最新資訊。
*   **像素級復製技巧**：若需 1:1 復製網上看到的精美主頁，可使用 **image2_UI_skill** 根據截圖生成 HTML。
*   將生成的頁面保存至項目文件夾下的 `prototype` 文件夾。

#### 步驟 3：編寫 Obsidian 插件代碼
*   指示 Codex 根據 UI 原型編寫插件代碼。
*   部署流程：
    *   進入 Obsidian 庫的 `.Obsidian/plugins` 目錄。
    *   新建文件夾（如 `agent-Dashboard`）。
    *   將編譯後的 `main.js`、`styles.css`、`manifest.json` 複製進去。
    *   在 Obsidian 中加載插件，通過命令面板（Ctrl+P）打開。

#### 步驟 4：實現具體功能模塊
*   **基礎顯示功能**：
    *   **熱力圖**：顯示過去 365 天筆記創建情況（分級定義顏色深淺）。
    *   **近期修改/今日 Task**：利用 Obsidian 原生 API 讀取 Workspace。
*   **調用智能體執行任務（核心）**：
    *   **原理**：通過命令行（CLI）調用智能體。
    *   **示例命令**：`claude -p "指令"` 在 Terminal 中執行。
    *   **案例：Inbox Ingest（資料攝入）**：
        *   點擊按鈕後，通過命令行調用 Claude Code。
        *   對 `inbox` 文件夾下的資料進行翻譯、摘要提取，生成中文 Markdown 筆記並保存。
    *   **案例：Deep Research**：調用 NotebookLM 的 Deep Research Skill。
*   **調用外部 API**：
    *   **免費 API**：GitHub API、RSS 訂閱（如拉取 Google/OpenAI 開發者 Blog）。
    *   **收費 API**：如 Twitter，需提供 API 密鑰。
    *   代碼實現：指示 Codex 拉取數據並寫入 Markdown 文件。
*   **知識庫健康檢查**：
    *   顯示健康度評分。
    *   識別問題：孤島筆記、死鏈、元數據覆蓋率缺失。
    *   參考理念：卡帕西（Kapasity）的 LLM Wiki 中的 **lint skill**。

### 四、 總結與趨勢
*   **LLM Wiki 理念**：從紙上談兵成為主流，Google 等硅谷主流技術圈層已深入使用 Obsidian 並與智能體集成。
*   **AI 時代趨勢**：智能體全面接管私人知識庫，Obsidian 是不可或缺的工具。
*   **建議**：根據實際需求逐步完善功能，打造適合自己的智能體操作系統。

## 工具 / 模型 / 名詞整理

*   **軟件/平台**：
    *   Obsidian
    *   Codex
    *   Claude Code
    *   Terminal (Mac 系統命令行)
    *   GitHub
    *   Reddit
    *   YouTube
    *   小紅書
    *   Brat 插件 (用於安裝未發布插件)
    *   Git

*   **AI 模型/服務**：
    *   智譜 GLM5.2
    *   Claude Code (提及可轉接)
    *   NotebookLM (Deep Research 功能)
    *   Google (提及發布開放知識格式)
    *   OpenAI

*   **開發工具/Skills/庫**：
    *   DataviewJS
    *   npm (`npm install`, `npm run build`)
    *   frontend-design skill (Anthropic 發布)
    *   Obsidian 插件開發 skill
    *   image2_UI_skill (用於像素級復製)
    *   yt-dlp (獲取 YouTube 信息)
    *   LLM Wiki 理念 (提及卡帕西 Kapasity)
    *   Ingest skill
    *   lint skill

*   **文件格式/標準**：
    *   Markdown
    *   HTML
    *   main.js, styles.css, manifest.json
    *   AGENTS.md
    *   開放知識格式 (Open Knowledge Format, 提及 Google 發布)

## 操作流程整理

1.  **準備環境**：
    *   新建空白文件夾並在 Codex 中打開。
    *   下載 Obsidian 官方 GitHub 插件倉庫樣例。
    *   執行 `npm install` 和 `npm run build`。
    *   安裝 `frontend-design skill` 和 `Obsidian 插件開發 skill`。
    *   在項目中創建 `AGENTS.md` 寫入規則，賦予 Codex 最高權限。

2.  **設計 UI 原型**：
    *   使用 `frontend-design skill` 或 `image2_UI_skill`（針對截圖）生成 HTML 原型。
    *   包含熱力圖、按鈕（Deep Research、RSS、日記）、數據圖表等模塊。
    *   將生成的頁面保存至項目文件夾下的 `prototype` 文件夾。

3.  **編寫與部署插件**：
    *   指示 Codex 根據 UI 原型編寫 `main.js`、`styles.css` 和 `manifest.json`。
    *   進入 Obsidian 庫的 `.Obsidian/plugins` 目錄。
    *   新建文件夾（如 `agent-Dashboard`）。
    *   將編譯後的三個文件複製進去。
    *   在 Obsidian 中加載插件，通過命令面板（Ctrl+P）打開。

4.  **配置與使用功能**：
    *   **基礎功能**：查看熱力圖、今日任務列表。
    *   **智能體調用**：
        *   點擊按鈕觸發 CLI 命令（如 `claude -p "指令"`）。
        *   執行 Inbox Ingest（資料攝入）：對 `inbox` 資料進行翻譯、摘要，生成中文 Markdown。
        *   執行 Deep Research：調用 NotebookLM 相關 Skill。
    *   **外部數據**：配置 API 密鑰（如 Twitter）或免費 API（GitHub、RSS），拉取數據並寫入 Markdown。
    *   **健康檢查**：運行 lint skill 檢查孤島筆記、死鏈及元數據覆蓋率。

## 值得注意的限制或風險

*   **API 成本**：部分外部 API（如 Twitter）為收費 API，需提供 API 密鑰並可能產生費用。
*   **依賴管理**：需要安裝特定的 Skills（如 frontend-design skill）及 npm 依賴，環境配置相對複雜。
*   **智能體調用穩定性**：通過 CLI 調用智能體依賴於命令行環境及智能體服務的可用性，可能存在延遲或錯誤。
*   **知識庫健康檢查準確性**：依賴於 lint skill 的規則定義，可能無法覆蓋所有結構性問題。

## 逐字稿辨識疑點

*   **Codex**：文中多次提到使用 "Codex" 進行編程和構建，通常指 OpenAI 的 Codex 模型或相關產品，但結合上下文提到的 "Claude Code" 和 "智譜 GLM5.2"，此處 "Codex" 可能指代特定的 AI 編程助手產品或模型版本，需查證具體所指為何種服務（是否為 OpenAI Codex API 或其他同名工具）。
*   **卡帕西 (Kapasity)**：文中多次提及「卡帕西的 LLM Wiki 理念」及「卡帕西的 LLM Wiki 的 skill」。需查證「卡帕西」是否為正確的人名或組織名稱音譯（常見譯名可能為 Kapasity 或其他）。
*   **智譜 GLM5.2**：文中提到「使用 Claude Code 轉接智譜 GLM5.2」。需查證智譜（Zhipu AI）是否有名為「GLM5.2」的具體模型版本，或是否為口誤/聽寫錯誤。
*   **OpenClaw 大龍蝦**：文中提到「OpenClaw 大龍蝦」，需查證「OpenClaw」是否為正確的產品名稱，以及「大龍蝦」是否為其暱稱或誤譯。
*   **Hermes Agent**：文中提到「Hermes Agent」，需查證該產品或代理的名稱是否準確。
*   **Superpower / ECC / everything**：文中提到「Superpower」、「ECC」、「everything Claude Code」等厚重框架，需查證這些是否為真實存在的編程框架名稱，或為口誤。
*   **inbox Ingest**：文中提到按鈕名稱為「inbox Ingest」，需確認這是否為標準術語或特定插件中的命名。
*   **Google 發布的開放知識格式**：文中提到「谷歌發布了一個開放知識格式來適配卡帕西的理念」，需查證 Google 是否確實發布了此特定格式的標準。

## 可延伸追問

*   如何具體配置 `AGENTS.md` 以賦予 Codex 最高權限？
*   `frontend-design skill` 和 `image2_UI_skill` 的具體安裝和使用方法為何？
*   如何安全地管理外部 API 密鑰（如 Twitter API Key）在 Obsidian 插件中的存儲？
*   知識庫健康檢查中的「孤島筆記」和「死鏈」具體由哪些算法或規則定義？
*   如何優化 CLI 調用智能體的速度和穩定性？