technical-doc-creator

Create HTML technical documentation with code blocks, API workflows, system architecture diagrams, and syntax highlighting. Use when users request t…

不碰外部（只输出文字）无严重或高危命中mhattingpete/claude-skills-marketplace

它会碰到什么

扫了多少3 个文本文件，30 KB

它会碰到什么不碰外部（只输出文字）

命中总数0 处

命中统计严重 0 · 高 0 · 中 0 · 低 0

这一栏是扫描器报的事实，不是结论。命中多不等于有毒（安全工具、规则库、示例脚本本来就会包含危险写法），命中少也不等于干净。它和你手上的凭据、文件、网络有什么关系，需要你自己看。

技能内容

Technical Documentation Creator

Create comprehensive HTML technical documentation with code examples and API workflows.

When to Use

"Create API documentation for [endpoints]"
"Generate technical docs for [system]"
"Document API reference"
"Create developer documentation"

Components

Overview: purpose, key features, tech stack
Getting Started: installation, setup, quick start
API Reference: endpoints with request/response examples
Code Examples: syntax-highlighted code blocks
Architecture: system diagram (SVG)
Workflows: step-by-step processes

HTML Structure

<!DOCTYPE html>
<html>
<head>
  <title>[API/System] Documentation</title>
  <style>
    body { font-family: system-ui; max-width: 1000px; margin: 0 auto; }
    pre { background: #1e1e1e; color: #d4d4d4; padding: 15px; border-radius: 4px; overflow-x: auto; }
    .endpoint { background: #f7fafc; padding: 15px; margin: 10px 0; border-left: 4px solid #4299e1; }
    code { background: #e2e8f0; padding: 2px 6px; border-radius: 3px; }
  </style>
</head>
<body>
  <h1>[System] Documentation</h1>
  <!-- Overview, Getting Started, API Reference, Examples -->
</body>
</html>

API Endpoint Pattern

<div class="endpoint">
  <h3><span style="color: #48bb78;">GET</span> /api/users/{id}</h3>
  <p>Retrieve user by ID</p>

  <h4>Request</h4>
  <pre><code>curl -X GET https://api.example.com/users/123</code></pre>

  <h4>Response</h4>
  <pre><code>{
  "id": 123,
  "name": "John Doe",
  "email": "john@example.com"
}</code></pre>
</div>

Code Block Pattern

<pre><code>// Installation
npm install package-name

// Usage
import { feature } from 'package-name';
const result = feature.doSomething();</code></pre>

Workflow

Extract API endpoints, methods, parameters
Create overview and getting started sections
Document each endpoint with examples
Add code snippets for common operations
Include architecture diagram if relevant
Write to [system]-docs.html

Use semantic colors for HTTP methods: GET (green), POST (blue), DELETE (red).

想直接用这个技能？

本站把开放许可（MIT / Apache 等）的技能按仓库打包整理到网盘，点一下转存到你自己的网盘，不用一个个从 GitHub 拉。许可未声明的技能只给原始仓库链接，不打包。

去原始仓库

它属于哪个仓库

仓库mhattingpete/claude-skills-marketplace

星标★ 671

本站分层T2

该仓技能数18

原文件路径visual-documentation-plugin/skills/technical-doc-creator/SKILL.md

同一个仓库里的其他技能

看这个仓库的全部 18 个技能