Timmy c33806679d 新增 Frontend Design Claude Code plugin 安裝筆記
安裝 frontend-design@claude-plugins-official(Anthropic 官方 skill),
用於讓 Claude 產出有美學方向的前端程式碼、避開 AI 罐頭介面。於
README、SUMMARY、QUICKSTART 建立索引。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-19 12:19:55 +08:00

tool-notes

個人工具安裝與使用筆記(繁體中文)。每份筆記都是獨立的 Markdown 檔記錄一項工具的安裝、API 與常用範例,方便日後查閱。

收錄工具

工具 用途 筆記
MarkItDown 把 PDF / Office / 音訊 / YouTube 等格式轉成 Markdown markitdown-notes.md
MemPalace 階層式本地記憶庫Wing / Room / Drawer支援向量搜尋與 MCP 整合 mempalace-notes.md
Playwright (Python) 瀏覽器自動化、E2E 測試、截圖與 PDF 輸出 playwright-notes.md
Playwright Plugin (Claude Code) 讓 Claude 直接操作瀏覽器的官方 pluginMCP server playwright-plugin-notes.md
Context7 Plugin (Claude Code) Upstash 出品,即時拉取 library 官方文件餵給 Claude context7-plugin-notes.md
Frontend Design Plugin (Claude Code) Anthropic 官方 skill讓 Claude 產出有設計感的前端而非 AI 罐頭介面 frontend-design-plugin-notes.md

目錄結構

tool-notes/
├── README.md              # 本檔
├── QUICKSTART.md          # 三個工具的最短上手指令
├── SUMMARY.md             # 工具重點摘要與對照
├── CLAUDE.md              # 給 Claude Code 用的專案說明
├── markitdown-notes.md
├── mempalace-notes.md
├── playwright-notes.md
├── playwright-plugin-notes.md
├── context7-plugin-notes.md
├── frontend-design-plugin-notes.md
└── mempalace.yaml         # 本目錄的 MemPalace 設定

撰寫慣例

  • 以繁體中文(台灣用語)書寫
  • 每份筆記固定章節:基本資訊 → 安裝 → 核心用法 → 進階功能
  • 保留完整 CLI 指令與程式碼片段,可直接複製使用
  • 不做摘要式描述,以「可執行」為優先

如何新增一份筆記

  1. 在根目錄建立 <tool>-notes.md
  2. 依現有筆記結構填寫(可參考 markitdown-notes.md 作為模板)
  3. README.md 的「收錄工具」表格新增一列
  4. SUMMARY.md 的對照表新增對應項目

遠端位置

  • Giteahttp://192.168.42.124:31337/timmy/tool-notes
Description
工具安裝與使用筆記
Readme 66 KiB
Languages
Markdown 100%