wiki-page-writer
Generate Technical Documentation with Mermaid Diagrams
Creating comprehensive technical documentation requires significant time and consistent formatting. This skill automates wiki page generation with evidence-based citations, dark-mode Mermaid diagrams, and VitePress-compatible structure for Claude, Codex, and Claude Code.
スキルZIPをダウンロード
Claudeでアップロード
設定 → 機能 → スキル → スキルをアップロードへ移動
オンにして利用開始
テストする
「wiki-page-writer」を使用しています。 Document the authentication middleware in src/middleware/auth.ts
期待される結果:
- Generated documentation page with:
- - Overview explaining authentication flow and security model
- - Sequence diagram showing request authentication lifecycle
- - Component table listing middleware functions with descriptions
- - Code citations: (src/middleware/auth.ts:45), (src/utils/jwt.ts:22), (src/config/auth.ts:8)
「wiki-page-writer」を使用しています。 Create documentation for the data pipeline in src/pipeline/
期待される結果:
- Generated documentation page with:
- - Architecture diagram showing data flow through pipeline stages
- - Class diagram of processor hierarchy and interfaces
- - Implementation details with pseudocode examples
- - Citations from 7 source files with specific line numbers
セキュリティ監査
安全Static analyzer detected 34 patterns (external_commands, weak_crypto, reconnaissance) but all are FALSE POSITIVES. The skill contains only markdown documentation syntax with code blocks and YAML frontmatter examples. No executable code, network calls, or cryptographic operations exist. Safe for publication.
品質スコア
作れるもの
Document CI/CD Pipeline Architecture
Generate comprehensive documentation for a CI/CD pipeline with sequence diagrams showing build stages, component citations, and deployment flow visualizations.
Create Open Source Feature Documentation
Produce detailed feature documentation for open source projects with architecture diagrams, API reference tables, and code path citations for community contributors.
Build Internal Technical Wiki
Generate consistent internal documentation pages for engineering teams with standardized diagrams, evidence-based citations, and searchable structure.
これらのプロンプトを試す
Create a documentation page for the [component name] in [file path]. Include an overview, architecture diagram, and cite at least 3 source files with line numbers.
Write comprehensive documentation for the [feature name] feature. Analyze all files in [directory path], create 3+ Mermaid diagrams (sequence, class, and flowchart), trace the complete data flow, and cite specific code paths with file:line references.
Generate API reference documentation for [module/service]. Include endpoint tables with parameters and return types, usage examples in code blocks, and sequence diagrams showing request flows. Cite implementation files for each endpoint.
Create a migration guide from [old system] to [new system]. Include architecture comparison diagrams, component mapping tables, data flow changes, and step-by-step migration procedures with code citations from both systems.
ベストプラクティス
- Always trace actual code paths before documenting functionality
- Use consistent dark-mode colors in Mermaid diagrams for visual coherence
- Cite specific file paths and line numbers for every technical claim
回避
- Making claims about functionality without reading the actual implementation code
- Using Mermaid syntax that breaks dark-mode rendering or VitePress compatibility
- Generating placeholder documentation without evidence-based source citations