@every-env/compound-plugin 0.9.0 → 0.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.claude-plugin/marketplace.json +3 -3
- package/AGENTS.md +5 -1
- package/CHANGELOG.md +42 -0
- package/CLAUDE.md +3 -3
- package/README.md +49 -15
- package/docs/plans/2026-02-14-feat-auto-detect-install-and-gemini-sync-plan.md +360 -0
- package/docs/plans/2026-02-25-feat-windsurf-global-scope-support-plan.md +627 -0
- package/docs/plans/2026-03-01-feat-ce-command-aliases-backwards-compatible-deprecation-plan.md +261 -0
- package/docs/plans/feature_opencode-commands-as-md-and-config-merge.md +574 -0
- package/docs/solutions/adding-converter-target-providers.md +692 -0
- package/docs/solutions/plugin-versioning-requirements.md +3 -3
- package/docs/specs/windsurf.md +477 -0
- package/package.json +1 -1
- package/plans/landing-page-launchkit-refresh.md +2 -2
- package/plugins/compound-engineering/.claude-plugin/plugin.json +2 -2
- package/plugins/compound-engineering/CHANGELOG.md +72 -1
- package/plugins/compound-engineering/CLAUDE.md +9 -7
- package/plugins/compound-engineering/README.md +10 -7
- package/plugins/compound-engineering/agents/research/git-history-analyzer.md +1 -1
- package/plugins/compound-engineering/agents/research/learnings-researcher.md +1 -1
- package/plugins/compound-engineering/agents/review/code-simplicity-reviewer.md +1 -1
- package/plugins/compound-engineering/commands/ce/brainstorm.md +145 -0
- package/plugins/compound-engineering/commands/ce/compound.md +240 -0
- package/plugins/compound-engineering/commands/ce/plan.md +636 -0
- package/plugins/compound-engineering/commands/ce/review.md +525 -0
- package/plugins/compound-engineering/commands/ce/work.md +470 -0
- package/plugins/compound-engineering/commands/create-agent-skill.md +1 -1
- package/plugins/compound-engineering/commands/deepen-plan.md +6 -6
- package/plugins/compound-engineering/commands/deploy-docs.md +1 -1
- package/plugins/compound-engineering/commands/feature-video.md +15 -6
- package/plugins/compound-engineering/commands/heal-skill.md +1 -1
- package/plugins/compound-engineering/commands/lfg.md +3 -3
- package/plugins/compound-engineering/commands/slfg.md +3 -3
- package/plugins/compound-engineering/commands/test-xcode.md +2 -2
- package/plugins/compound-engineering/commands/workflows/brainstorm.md +4 -123
- package/plugins/compound-engineering/commands/workflows/compound.md +4 -234
- package/plugins/compound-engineering/commands/workflows/plan.md +4 -562
- package/plugins/compound-engineering/commands/workflows/review.md +4 -522
- package/plugins/compound-engineering/commands/workflows/work.md +4 -448
- package/plugins/compound-engineering/skills/brainstorming/SKILL.md +3 -3
- package/plugins/compound-engineering/skills/document-review/SKILL.md +1 -1
- package/plugins/compound-engineering/skills/file-todos/SKILL.md +1 -1
- package/plugins/compound-engineering/skills/git-worktree/SKILL.md +5 -5
- package/plugins/compound-engineering/skills/proof/SKILL.md +185 -0
- package/plugins/compound-engineering/skills/resolve-pr-parallel/SKILL.md +1 -1
- package/plugins/compound-engineering/skills/setup/SKILL.md +2 -2
- package/src/commands/convert.ts +101 -24
- package/src/commands/install.ts +102 -45
- package/src/commands/sync.ts +58 -38
- package/src/converters/claude-to-openclaw.ts +240 -0
- package/src/converters/claude-to-opencode.ts +12 -10
- package/src/converters/claude-to-qwen.ts +238 -0
- package/src/converters/claude-to-windsurf.ts +205 -0
- package/src/sync/gemini.ts +76 -0
- package/src/targets/index.ts +60 -1
- package/src/targets/openclaw.ts +96 -0
- package/src/targets/opencode.ts +76 -10
- package/src/targets/qwen.ts +64 -0
- package/src/targets/windsurf.ts +104 -0
- package/src/types/openclaw.ts +52 -0
- package/src/types/opencode.ts +7 -8
- package/src/types/qwen.ts +48 -0
- package/src/types/windsurf.ts +34 -0
- package/src/utils/detect-tools.ts +46 -0
- package/src/utils/files.ts +7 -0
- package/src/utils/resolve-output.ts +50 -0
- package/src/utils/secrets.ts +24 -0
- package/tests/cli.test.ts +78 -0
- package/tests/converter.test.ts +43 -10
- package/tests/detect-tools.test.ts +96 -0
- package/tests/openclaw-converter.test.ts +200 -0
- package/tests/opencode-writer.test.ts +142 -5
- package/tests/qwen-converter.test.ts +238 -0
- package/tests/resolve-output.test.ts +131 -0
- package/tests/sync-gemini.test.ts +106 -0
- package/tests/windsurf-converter.test.ts +573 -0
- package/tests/windsurf-writer.test.ts +359 -0
- package/docs/css/docs.css +0 -675
- package/docs/css/style.css +0 -2886
- package/docs/index.html +0 -1046
- package/docs/js/main.js +0 -225
- package/docs/pages/agents.html +0 -649
- package/docs/pages/changelog.html +0 -534
- package/docs/pages/commands.html +0 -523
- package/docs/pages/getting-started.html +0 -582
- package/docs/pages/mcp-servers.html +0 -409
- package/docs/pages/skills.html +0 -611
|
@@ -1,582 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en" class="theme-dark">
|
|
3
|
-
|
|
4
|
-
<head>
|
|
5
|
-
<meta charset="utf-8" />
|
|
6
|
-
<title>Getting Started - Compounding Engineering</title>
|
|
7
|
-
<meta content="Complete guide to installing and using the Compounding Engineering plugin for Claude Code." name="description" />
|
|
8
|
-
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
|
9
|
-
|
|
10
|
-
<!-- Styles -->
|
|
11
|
-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" />
|
|
12
|
-
<link href="../css/style.css" rel="stylesheet" type="text/css" />
|
|
13
|
-
<link href="../css/docs.css" rel="stylesheet" type="text/css" />
|
|
14
|
-
<script src="../js/main.js" type="text/javascript" defer></script>
|
|
15
|
-
</head>
|
|
16
|
-
|
|
17
|
-
<body>
|
|
18
|
-
<div class="background-gradient"></div>
|
|
19
|
-
<div class="docs-layout">
|
|
20
|
-
<!-- Sidebar -->
|
|
21
|
-
<aside class="docs-sidebar">
|
|
22
|
-
<div class="sidebar-header">
|
|
23
|
-
<a href="../index.html" class="nav-brand">
|
|
24
|
-
<span class="logo-icon"><i class="fa-solid fa-layer-group"></i></span>
|
|
25
|
-
<span class="logo-text">CE Docs</span>
|
|
26
|
-
</a>
|
|
27
|
-
</div>
|
|
28
|
-
<nav class="sidebar-nav">
|
|
29
|
-
<div class="nav-section">
|
|
30
|
-
<h3>Getting Started</h3>
|
|
31
|
-
<ul>
|
|
32
|
-
<li><a href="#installation" class="active">Installation</a></li>
|
|
33
|
-
<li><a href="#quick-start">Quick Start</a></li>
|
|
34
|
-
<li><a href="#configuration">Configuration</a></li>
|
|
35
|
-
</ul>
|
|
36
|
-
</div>
|
|
37
|
-
<div class="nav-section">
|
|
38
|
-
<h3>Core Concepts</h3>
|
|
39
|
-
<ul>
|
|
40
|
-
<li><a href="#philosophy">Philosophy</a></li>
|
|
41
|
-
<li><a href="#agents">Using Agents</a></li>
|
|
42
|
-
<li><a href="#commands">Using Commands</a></li>
|
|
43
|
-
<li><a href="#skills">Using Skills</a></li>
|
|
44
|
-
</ul>
|
|
45
|
-
</div>
|
|
46
|
-
<div class="nav-section">
|
|
47
|
-
<h3>Guides</h3>
|
|
48
|
-
<ul>
|
|
49
|
-
<li><a href="#code-review">Code Review Workflow</a></li>
|
|
50
|
-
<li><a href="#creating-agents">Creating Custom Agents</a></li>
|
|
51
|
-
<li><a href="#creating-skills">Creating Custom Skills</a></li>
|
|
52
|
-
</ul>
|
|
53
|
-
</div>
|
|
54
|
-
<div class="nav-section">
|
|
55
|
-
<h3>Reference</h3>
|
|
56
|
-
<ul>
|
|
57
|
-
<li><a href="agents.html">Agent Reference</a></li>
|
|
58
|
-
<li><a href="commands.html">Command Reference</a></li>
|
|
59
|
-
<li><a href="skills.html">Skill Reference</a></li>
|
|
60
|
-
<li><a href="mcp-servers.html">MCP Servers</a></li>
|
|
61
|
-
<li><a href="changelog.html">Changelog</a></li>
|
|
62
|
-
</ul>
|
|
63
|
-
</div>
|
|
64
|
-
</nav>
|
|
65
|
-
</aside>
|
|
66
|
-
|
|
67
|
-
<!-- Main Content -->
|
|
68
|
-
<main class="docs-content">
|
|
69
|
-
<div class="docs-header">
|
|
70
|
-
<nav class="breadcrumb">
|
|
71
|
-
<a href="../index.html">Home</a>
|
|
72
|
-
<span>/</span>
|
|
73
|
-
<span>Getting Started</span>
|
|
74
|
-
</nav>
|
|
75
|
-
<button class="mobile-menu-toggle" data-sidebar-toggle>
|
|
76
|
-
<i class="fa-solid fa-bars"></i>
|
|
77
|
-
</button>
|
|
78
|
-
</div>
|
|
79
|
-
|
|
80
|
-
<article class="docs-article">
|
|
81
|
-
<h1>Getting Started with Compounding Engineering</h1>
|
|
82
|
-
<p class="lead">
|
|
83
|
-
Five minutes from now, you'll run a single command that spins up 10 AI agents—each with a different specialty—to review your pull request in parallel. Security, performance, architecture, accessibility, all happening at once. That's the plugin. Let's get you set up.
|
|
84
|
-
</p>
|
|
85
|
-
|
|
86
|
-
<!-- Installation Section -->
|
|
87
|
-
<section id="installation">
|
|
88
|
-
<h2><i class="fa-solid fa-download"></i> Installation</h2>
|
|
89
|
-
|
|
90
|
-
<h3>Prerequisites</h3>
|
|
91
|
-
<ul>
|
|
92
|
-
<li><a href="https://claude.ai/claude-code" target="_blank">Claude Code</a> installed and configured</li>
|
|
93
|
-
<li>A GitHub account (for marketplace access)</li>
|
|
94
|
-
<li>Node.js 18+ (for MCP servers)</li>
|
|
95
|
-
</ul>
|
|
96
|
-
|
|
97
|
-
<h3>Step 1: Add the Marketplace</h3>
|
|
98
|
-
<p>Think of the marketplace as an app store. You're adding it to Claude Code's list of places to look for plugins:</p>
|
|
99
|
-
<div class="card-code-block">
|
|
100
|
-
<pre><code>claude /plugin marketplace add https://github.com/EveryInc/compound-engineering-plugin</code></pre>
|
|
101
|
-
</div>
|
|
102
|
-
|
|
103
|
-
<h3>Step 2: Install the Plugin</h3>
|
|
104
|
-
<p>Now grab the plugin itself:</p>
|
|
105
|
-
<div class="card-code-block">
|
|
106
|
-
<pre><code>claude /plugin install compound-engineering</code></pre>
|
|
107
|
-
</div>
|
|
108
|
-
|
|
109
|
-
<h3>Step 3: Verify Installation</h3>
|
|
110
|
-
<p>Check that it worked:</p>
|
|
111
|
-
<div class="card-code-block">
|
|
112
|
-
<pre><code>claude /plugin list</code></pre>
|
|
113
|
-
</div>
|
|
114
|
-
<p>You'll see <code>compound-engineering</code> in the list. If you do, you're ready.</p>
|
|
115
|
-
|
|
116
|
-
<div class="callout callout-info">
|
|
117
|
-
<div class="callout-icon"><i class="fa-solid fa-circle-info"></i></div>
|
|
118
|
-
<div class="callout-content">
|
|
119
|
-
<h4>Known Issue: MCP Servers</h4>
|
|
120
|
-
<p>
|
|
121
|
-
The bundled MCP servers (Playwright for browser automation, Context7 for docs) don't always auto-load. If you need them, there's a manual config step below. Otherwise, ignore this—everything else works fine.
|
|
122
|
-
</p>
|
|
123
|
-
</div>
|
|
124
|
-
</div>
|
|
125
|
-
</section>
|
|
126
|
-
|
|
127
|
-
<!-- Quick Start Section -->
|
|
128
|
-
<section id="quick-start">
|
|
129
|
-
<h2><i class="fa-solid fa-rocket"></i> Quick Start</h2>
|
|
130
|
-
|
|
131
|
-
<p>Let's see what this thing can actually do. I'll show you three workflows you'll use constantly:</p>
|
|
132
|
-
|
|
133
|
-
<h3>Run a Code Review</h3>
|
|
134
|
-
<p>This is the big one. Type <code>/review</code> and watch it spawn 10+ specialized reviewers:</p>
|
|
135
|
-
<div class="card-code-block">
|
|
136
|
-
<pre><code># Review a PR by number
|
|
137
|
-
/review 123
|
|
138
|
-
|
|
139
|
-
# Review the current branch
|
|
140
|
-
/review
|
|
141
|
-
|
|
142
|
-
# Review a specific branch
|
|
143
|
-
/review feature/my-feature</code></pre>
|
|
144
|
-
</div>
|
|
145
|
-
|
|
146
|
-
<h3>Use a Specialized Agent</h3>
|
|
147
|
-
<p>Sometimes you just need one expert. Call them directly:</p>
|
|
148
|
-
<div class="card-code-block">
|
|
149
|
-
<pre><code># Rails code review with Kieran's conventions
|
|
150
|
-
claude agent kieran-rails-reviewer "Review the UserController"
|
|
151
|
-
|
|
152
|
-
# Security audit
|
|
153
|
-
claude agent security-sentinel "Audit authentication flow"
|
|
154
|
-
|
|
155
|
-
# Research best practices
|
|
156
|
-
claude agent best-practices-researcher "Find pagination patterns for Rails"</code></pre>
|
|
157
|
-
</div>
|
|
158
|
-
|
|
159
|
-
<h3>Invoke a Skill</h3>
|
|
160
|
-
<p>Skills are like loading a reference book into Claude's brain. When you need deep knowledge in a specific domain:</p>
|
|
161
|
-
<div class="card-code-block">
|
|
162
|
-
<pre><code># Generate images with Gemini
|
|
163
|
-
skill: gemini-imagegen
|
|
164
|
-
|
|
165
|
-
# Write Ruby in DHH's style
|
|
166
|
-
skill: dhh-ruby-style
|
|
167
|
-
|
|
168
|
-
# Create a new Claude Code skill
|
|
169
|
-
skill: create-agent-skills</code></pre>
|
|
170
|
-
</div>
|
|
171
|
-
</section>
|
|
172
|
-
|
|
173
|
-
<!-- Configuration Section -->
|
|
174
|
-
<section id="configuration">
|
|
175
|
-
<h2><i class="fa-solid fa-gear"></i> Configuration</h2>
|
|
176
|
-
|
|
177
|
-
<h3 id="mcp-configuration">MCP Server Configuration</h3>
|
|
178
|
-
<p>
|
|
179
|
-
If the MCP servers didn't load automatically, paste this into <code>.claude/settings.json</code>:
|
|
180
|
-
</p>
|
|
181
|
-
<div class="card-code-block">
|
|
182
|
-
<pre><code>{
|
|
183
|
-
"mcpServers": {
|
|
184
|
-
"playwright": {
|
|
185
|
-
"type": "stdio",
|
|
186
|
-
"command": "npx",
|
|
187
|
-
"args": ["-y", "@playwright/mcp@latest"],
|
|
188
|
-
"env": {}
|
|
189
|
-
},
|
|
190
|
-
"context7": {
|
|
191
|
-
"type": "http",
|
|
192
|
-
"url": "https://mcp.context7.com/mcp"
|
|
193
|
-
}
|
|
194
|
-
}
|
|
195
|
-
}</code></pre>
|
|
196
|
-
</div>
|
|
197
|
-
|
|
198
|
-
<h3>Environment Variables</h3>
|
|
199
|
-
<p>Right now, only one skill needs an API key. If you use Gemini's image generation:</p>
|
|
200
|
-
<table class="docs-table">
|
|
201
|
-
<thead>
|
|
202
|
-
<tr>
|
|
203
|
-
<th>Variable</th>
|
|
204
|
-
<th>Required For</th>
|
|
205
|
-
<th>Description</th>
|
|
206
|
-
</tr>
|
|
207
|
-
</thead>
|
|
208
|
-
<tbody>
|
|
209
|
-
<tr>
|
|
210
|
-
<td><code>GEMINI_API_KEY</code></td>
|
|
211
|
-
<td>gemini-imagegen</td>
|
|
212
|
-
<td>Google Gemini API key for image generation</td>
|
|
213
|
-
</tr>
|
|
214
|
-
</tbody>
|
|
215
|
-
</table>
|
|
216
|
-
</section>
|
|
217
|
-
|
|
218
|
-
<!-- Philosophy Section -->
|
|
219
|
-
<section id="philosophy">
|
|
220
|
-
<h2><i class="fa-solid fa-lightbulb"></i> The Compounding Engineering Philosophy</h2>
|
|
221
|
-
|
|
222
|
-
<blockquote class="highlight-quote">
|
|
223
|
-
Every unit of engineering work should make subsequent units of work easier—not harder.
|
|
224
|
-
</blockquote>
|
|
225
|
-
|
|
226
|
-
<p>Here's how it works in practice—the four-step loop you'll run over and over:</p>
|
|
227
|
-
|
|
228
|
-
<div class="philosophy-grid">
|
|
229
|
-
<div class="philosophy-card">
|
|
230
|
-
<div class="philosophy-icon"><i class="fa-solid fa-brain"></i></div>
|
|
231
|
-
<h4>1. Plan</h4>
|
|
232
|
-
<p>
|
|
233
|
-
Before you write a single line, figure out what you're building and why. Use research agents to gather examples, patterns, and context. Think of it as Google Search meets expert consultation.
|
|
234
|
-
</p>
|
|
235
|
-
</div>
|
|
236
|
-
<div class="philosophy-card">
|
|
237
|
-
<div class="philosophy-icon"><i class="fa-solid fa-robot"></i></div>
|
|
238
|
-
<h4>2. Delegate</h4>
|
|
239
|
-
<p>
|
|
240
|
-
Now build it—with help. Each agent specializes in something (Rails, security, design). You stay in the driver's seat, but you've got a team of specialists riding shotgun.
|
|
241
|
-
</p>
|
|
242
|
-
</div>
|
|
243
|
-
<div class="philosophy-card">
|
|
244
|
-
<div class="philosophy-icon"><i class="fa-solid fa-magnifying-glass"></i></div>
|
|
245
|
-
<h4>3. Assess</h4>
|
|
246
|
-
<p>
|
|
247
|
-
Before you ship, run the gauntlet. Security agent checks for vulnerabilities. Performance agent flags N+1 queries. Architecture agent questions your design choices. All at once, all in parallel.
|
|
248
|
-
</p>
|
|
249
|
-
</div>
|
|
250
|
-
<div class="philosophy-card">
|
|
251
|
-
<div class="philosophy-icon"><i class="fa-solid fa-book"></i></div>
|
|
252
|
-
<h4>4. Codify</h4>
|
|
253
|
-
<p>
|
|
254
|
-
You just solved a problem. Write it down. Next time you (or your teammate) face this, you'll have a runbook. That's the "compounding" part—each solution makes the next one faster.
|
|
255
|
-
</p>
|
|
256
|
-
</div>
|
|
257
|
-
</div>
|
|
258
|
-
</section>
|
|
259
|
-
|
|
260
|
-
<!-- Using Agents Section -->
|
|
261
|
-
<section id="agents">
|
|
262
|
-
<h2><i class="fa-solid fa-users-gear"></i> Using Agents</h2>
|
|
263
|
-
|
|
264
|
-
<p>
|
|
265
|
-
Think of agents as coworkers with different job titles. You wouldn't ask your security engineer to design your UI, right? Same concept here—each agent has a specialty, and you call the one you need.
|
|
266
|
-
</p>
|
|
267
|
-
|
|
268
|
-
<h3>Invoking Agents</h3>
|
|
269
|
-
<div class="card-code-block">
|
|
270
|
-
<pre><code># Basic syntax
|
|
271
|
-
claude agent [agent-name] "[optional message]"
|
|
272
|
-
|
|
273
|
-
# Examples
|
|
274
|
-
claude agent kieran-rails-reviewer
|
|
275
|
-
claude agent security-sentinel "Audit the payment flow"
|
|
276
|
-
claude agent git-history-analyzer "Show changes to user model"</code></pre>
|
|
277
|
-
</div>
|
|
278
|
-
|
|
279
|
-
<h3>Agent Categories</h3>
|
|
280
|
-
<table class="docs-table">
|
|
281
|
-
<thead>
|
|
282
|
-
<tr>
|
|
283
|
-
<th>Category</th>
|
|
284
|
-
<th>Count</th>
|
|
285
|
-
<th>Purpose</th>
|
|
286
|
-
</tr>
|
|
287
|
-
</thead>
|
|
288
|
-
<tbody>
|
|
289
|
-
<tr>
|
|
290
|
-
<td>Review</td>
|
|
291
|
-
<td>10</td>
|
|
292
|
-
<td>Code review, security audits, performance analysis</td>
|
|
293
|
-
</tr>
|
|
294
|
-
<tr>
|
|
295
|
-
<td>Research</td>
|
|
296
|
-
<td>four</td>
|
|
297
|
-
<td>Best practices, documentation, git history</td>
|
|
298
|
-
</tr>
|
|
299
|
-
<tr>
|
|
300
|
-
<td>Design</td>
|
|
301
|
-
<td>three</td>
|
|
302
|
-
<td>UI iteration, Figma sync, design review</td>
|
|
303
|
-
</tr>
|
|
304
|
-
<tr>
|
|
305
|
-
<td>Workflow</td>
|
|
306
|
-
<td>five</td>
|
|
307
|
-
<td>Bug reproduction, PR resolution, linting</td>
|
|
308
|
-
</tr>
|
|
309
|
-
<tr>
|
|
310
|
-
<td>Docs</td>
|
|
311
|
-
<td>one</td>
|
|
312
|
-
<td>README generation</td>
|
|
313
|
-
</tr>
|
|
314
|
-
</tbody>
|
|
315
|
-
</table>
|
|
316
|
-
|
|
317
|
-
<p>
|
|
318
|
-
<a href="agents.html" class="button secondary">
|
|
319
|
-
<i class="fa-solid fa-arrow-right"></i> View All Agents
|
|
320
|
-
</a>
|
|
321
|
-
</p>
|
|
322
|
-
</section>
|
|
323
|
-
|
|
324
|
-
<!-- Using Commands Section -->
|
|
325
|
-
<section id="commands">
|
|
326
|
-
<h2><i class="fa-solid fa-terminal"></i> Using Commands</h2>
|
|
327
|
-
|
|
328
|
-
<p>
|
|
329
|
-
Commands are macros that run entire workflows for you. One command can spin up a dozen agents, coordinate their work, collect results, and hand you a summary. It's automation all the way down.
|
|
330
|
-
</p>
|
|
331
|
-
|
|
332
|
-
<h3>Running Commands</h3>
|
|
333
|
-
<div class="card-code-block">
|
|
334
|
-
<pre><code># Workflow commands
|
|
335
|
-
/plan
|
|
336
|
-
/review 123
|
|
337
|
-
/work
|
|
338
|
-
/compound
|
|
339
|
-
|
|
340
|
-
# Utility commands
|
|
341
|
-
/changelog
|
|
342
|
-
/triage
|
|
343
|
-
/reproduce-bug</code></pre>
|
|
344
|
-
</div>
|
|
345
|
-
|
|
346
|
-
<h3>The Review Workflow</h3>
|
|
347
|
-
<p>Let me show you what happens when you run <code>/review</code>. Here's the sequence:</p>
|
|
348
|
-
<ol>
|
|
349
|
-
<li><strong>Detection</strong> - Figures out what you want reviewed (PR number, branch name, or current changes)</li>
|
|
350
|
-
<li><strong>Isolation</strong> - Spins up a git worktree so the review doesn't mess with your working directory</li>
|
|
351
|
-
<li><strong>Parallel execution</strong> - Launches 10+ agents simultaneously (security, performance, architecture, accessibility...)</li>
|
|
352
|
-
<li><strong>Synthesis</strong> - Sorts findings by severity (P1 = blocks merge, P2 = should fix, P3 = nice-to-have)</li>
|
|
353
|
-
<li><strong>Persistence</strong> - Creates todo files so you don't lose track of issues</li>
|
|
354
|
-
<li><strong>Summary</strong> - Hands you a readable report with action items</li>
|
|
355
|
-
</ol>
|
|
356
|
-
|
|
357
|
-
<p>
|
|
358
|
-
<a href="commands.html" class="button secondary">
|
|
359
|
-
<i class="fa-solid fa-arrow-right"></i> View All Commands
|
|
360
|
-
</a>
|
|
361
|
-
</p>
|
|
362
|
-
</section>
|
|
363
|
-
|
|
364
|
-
<!-- Using Skills Section -->
|
|
365
|
-
<section id="skills">
|
|
366
|
-
<h2><i class="fa-solid fa-wand-magic-sparkles"></i> Using Skills</h2>
|
|
367
|
-
|
|
368
|
-
<p>
|
|
369
|
-
Here's the difference: agents are <em>who</em> does the work, skills are <em>what they know</em>. When you invoke a skill, you're loading a reference library into Claude's context—patterns, templates, examples, workflows. It's like handing Claude a technical manual.
|
|
370
|
-
</p>
|
|
371
|
-
|
|
372
|
-
<h3>Invoking Skills</h3>
|
|
373
|
-
<div class="card-code-block">
|
|
374
|
-
<pre><code># In your prompt, reference the skill
|
|
375
|
-
skill: gemini-imagegen
|
|
376
|
-
|
|
377
|
-
# Or ask Claude to use it
|
|
378
|
-
"Use the dhh-ruby-style skill to refactor this code"</code></pre>
|
|
379
|
-
</div>
|
|
380
|
-
|
|
381
|
-
<h3>Skill Structure</h3>
|
|
382
|
-
<p>Peek inside a skill directory and you'll usually find:</p>
|
|
383
|
-
<ul>
|
|
384
|
-
<li><strong>SKILL.md</strong> - The main instructions (what Claude reads first)</li>
|
|
385
|
-
<li><strong>references/</strong> - Deep dives on concepts and patterns</li>
|
|
386
|
-
<li><strong>templates/</strong> - Copy-paste code snippets</li>
|
|
387
|
-
<li><strong>workflows/</strong> - Step-by-step "how to" guides</li>
|
|
388
|
-
<li><strong>scripts/</strong> - Actual executable code (when words aren't enough)</li>
|
|
389
|
-
</ul>
|
|
390
|
-
|
|
391
|
-
<p>
|
|
392
|
-
<a href="skills.html" class="button secondary">
|
|
393
|
-
<i class="fa-solid fa-arrow-right"></i> View All Skills
|
|
394
|
-
</a>
|
|
395
|
-
</p>
|
|
396
|
-
</section>
|
|
397
|
-
|
|
398
|
-
<!-- Code Review Workflow Guide -->
|
|
399
|
-
<section id="code-review">
|
|
400
|
-
<h2><i class="fa-solid fa-code-pull-request"></i> Code Review Workflow Guide</h2>
|
|
401
|
-
|
|
402
|
-
<p>
|
|
403
|
-
You'll spend most of your time here. This workflow is why the plugin exists—to turn code review from a bottleneck into a superpower.
|
|
404
|
-
</p>
|
|
405
|
-
|
|
406
|
-
<h3>Basic Review</h3>
|
|
407
|
-
<div class="card-code-block">
|
|
408
|
-
<pre><code># Review a PR
|
|
409
|
-
/review 123
|
|
410
|
-
|
|
411
|
-
# Review current branch
|
|
412
|
-
/review</code></pre>
|
|
413
|
-
</div>
|
|
414
|
-
|
|
415
|
-
<h3>Understanding Findings</h3>
|
|
416
|
-
<p>Every finding gets a priority label. Here's what they mean:</p>
|
|
417
|
-
<ul>
|
|
418
|
-
<li><span class="badge badge-critical">P1 Critical</span> - Don't merge until this is fixed. Think: SQL injection, data loss, crashes in production.</li>
|
|
419
|
-
<li><span class="badge badge-important">P2 Important</span> - Fix before shipping. Performance regressions, N+1 queries, shaky architecture.</li>
|
|
420
|
-
<li><span class="badge badge-nice">P3 Nice-to-Have</span> - Would be better, but ship without it if you need to. Documentation, minor cleanup, style issues.</li>
|
|
421
|
-
</ul>
|
|
422
|
-
|
|
423
|
-
<h3>Working with Todo Files</h3>
|
|
424
|
-
<p>After a review, you'll have a <code>todos/</code> directory full of markdown files. Each one is a single issue to fix:</p>
|
|
425
|
-
<div class="card-code-block">
|
|
426
|
-
<pre><code># List all pending todos
|
|
427
|
-
ls todos/*-pending-*.md
|
|
428
|
-
|
|
429
|
-
# Triage findings
|
|
430
|
-
/triage
|
|
431
|
-
|
|
432
|
-
# Resolve todos in parallel
|
|
433
|
-
/resolve_todo_parallel</code></pre>
|
|
434
|
-
</div>
|
|
435
|
-
</section>
|
|
436
|
-
|
|
437
|
-
<!-- Creating Custom Agents -->
|
|
438
|
-
<section id="creating-agents">
|
|
439
|
-
<h2><i class="fa-solid fa-plus"></i> Creating Custom Agents</h2>
|
|
440
|
-
|
|
441
|
-
<p>
|
|
442
|
-
The built-in agents cover a lot of ground, but every team has unique needs. Maybe you want a "rails-api-reviewer" that enforces your company's API standards. That's 10 minutes of work.
|
|
443
|
-
</p>
|
|
444
|
-
|
|
445
|
-
<h3>Agent File Structure</h3>
|
|
446
|
-
<div class="card-code-block">
|
|
447
|
-
<pre><code>---
|
|
448
|
-
name: my-custom-agent
|
|
449
|
-
description: Brief description of what this agent does
|
|
450
|
-
---
|
|
451
|
-
|
|
452
|
-
# Agent Instructions
|
|
453
|
-
|
|
454
|
-
You are [role description].
|
|
455
|
-
|
|
456
|
-
## Your Responsibilities
|
|
457
|
-
1. First responsibility
|
|
458
|
-
2. Second responsibility
|
|
459
|
-
|
|
460
|
-
## Guidelines
|
|
461
|
-
- Guideline one
|
|
462
|
-
- Guideline two</code></pre>
|
|
463
|
-
</div>
|
|
464
|
-
|
|
465
|
-
<h3>Agent Location</h3>
|
|
466
|
-
<p>Drop your agent file in one of these directories:</p>
|
|
467
|
-
<ul>
|
|
468
|
-
<li><code>.claude/agents/</code> - Just for this project (committed to git)</li>
|
|
469
|
-
<li><code>~/.claude/agents/</code> - Available in all your projects (stays on your machine)</li>
|
|
470
|
-
</ul>
|
|
471
|
-
|
|
472
|
-
<div class="callout callout-tip">
|
|
473
|
-
<div class="callout-icon"><i class="fa-solid fa-lightbulb"></i></div>
|
|
474
|
-
<div class="callout-content">
|
|
475
|
-
<h4>The Easy Way</h4>
|
|
476
|
-
<p>
|
|
477
|
-
Don't write the YAML by hand. Just run <code>/create-agent-skill</code> and answer a few questions. The command generates the file, validates the format, and puts it in the right place.
|
|
478
|
-
</p>
|
|
479
|
-
</div>
|
|
480
|
-
</div>
|
|
481
|
-
</section>
|
|
482
|
-
|
|
483
|
-
<!-- Creating Custom Skills -->
|
|
484
|
-
<section id="creating-skills">
|
|
485
|
-
<h2><i class="fa-solid fa-plus"></i> Creating Custom Skills</h2>
|
|
486
|
-
|
|
487
|
-
<p>
|
|
488
|
-
Skills are heavier than agents—they're knowledge bases, not just prompts. You're building a mini library that Claude can reference. Worth the effort for things you do repeatedly.
|
|
489
|
-
</p>
|
|
490
|
-
|
|
491
|
-
<h3>Skill Directory Structure</h3>
|
|
492
|
-
<div class="card-code-block">
|
|
493
|
-
<pre><code>my-skill/
|
|
494
|
-
SKILL.md # Main skill file (required)
|
|
495
|
-
references/ # Supporting documentation
|
|
496
|
-
concept-one.md
|
|
497
|
-
concept-two.md
|
|
498
|
-
templates/ # Code templates
|
|
499
|
-
basic-template.md
|
|
500
|
-
workflows/ # Step-by-step procedures
|
|
501
|
-
workflow-one.md
|
|
502
|
-
scripts/ # Executable scripts
|
|
503
|
-
helper.py</code></pre>
|
|
504
|
-
</div>
|
|
505
|
-
|
|
506
|
-
<h3>SKILL.md Format</h3>
|
|
507
|
-
<div class="card-code-block">
|
|
508
|
-
<pre><code>---
|
|
509
|
-
name: my-skill
|
|
510
|
-
description: Brief description shown when skill is invoked
|
|
511
|
-
---
|
|
512
|
-
|
|
513
|
-
# Skill Title
|
|
514
|
-
|
|
515
|
-
Detailed instructions for using this skill.
|
|
516
|
-
|
|
517
|
-
## Quick Start
|
|
518
|
-
...
|
|
519
|
-
|
|
520
|
-
## Reference Materials
|
|
521
|
-
The skill includes references in the `references/` directory.
|
|
522
|
-
|
|
523
|
-
## Templates
|
|
524
|
-
Use templates from the `templates/` directory.</code></pre>
|
|
525
|
-
</div>
|
|
526
|
-
|
|
527
|
-
<div class="callout callout-tip">
|
|
528
|
-
<div class="callout-icon"><i class="fa-solid fa-lightbulb"></i></div>
|
|
529
|
-
<div class="callout-content">
|
|
530
|
-
<h4>Get Help Building Skills</h4>
|
|
531
|
-
<p>
|
|
532
|
-
Type <code>skill: create-agent-skills</code> and Claude loads expert guidance on skill architecture, best practices, file organization, and validation. It's like having a senior engineer walk you through it.
|
|
533
|
-
</p>
|
|
534
|
-
</div>
|
|
535
|
-
</div>
|
|
536
|
-
</section>
|
|
537
|
-
|
|
538
|
-
<!-- Navigation -->
|
|
539
|
-
<nav class="docs-nav-footer">
|
|
540
|
-
<a href="../index.html" class="nav-prev">
|
|
541
|
-
<span class="nav-label">Previous</span>
|
|
542
|
-
<span class="nav-title"><i class="fa-solid fa-arrow-left"></i> Home</span>
|
|
543
|
-
</a>
|
|
544
|
-
<a href="agents.html" class="nav-next">
|
|
545
|
-
<span class="nav-label">Next</span>
|
|
546
|
-
<span class="nav-title">Agent Reference <i class="fa-solid fa-arrow-right"></i></span>
|
|
547
|
-
</a>
|
|
548
|
-
</nav>
|
|
549
|
-
</article>
|
|
550
|
-
</main>
|
|
551
|
-
</div>
|
|
552
|
-
|
|
553
|
-
<script>
|
|
554
|
-
// Sidebar toggle for mobile
|
|
555
|
-
document.querySelector('[data-sidebar-toggle]')?.addEventListener('click', () => {
|
|
556
|
-
document.querySelector('.docs-sidebar').classList.toggle('open');
|
|
557
|
-
});
|
|
558
|
-
|
|
559
|
-
// Active link highlighting
|
|
560
|
-
const sections = document.querySelectorAll('section[id]');
|
|
561
|
-
const navLinks = document.querySelectorAll('.sidebar-nav a');
|
|
562
|
-
|
|
563
|
-
window.addEventListener('scroll', () => {
|
|
564
|
-
let current = '';
|
|
565
|
-
sections.forEach(section => {
|
|
566
|
-
const sectionTop = section.offsetTop;
|
|
567
|
-
if (pageYOffset >= sectionTop - 100) {
|
|
568
|
-
current = section.getAttribute('id');
|
|
569
|
-
}
|
|
570
|
-
});
|
|
571
|
-
|
|
572
|
-
navLinks.forEach(link => {
|
|
573
|
-
link.classList.remove('active');
|
|
574
|
-
if (link.getAttribute('href') === `#${current}`) {
|
|
575
|
-
link.classList.add('active');
|
|
576
|
-
}
|
|
577
|
-
});
|
|
578
|
-
});
|
|
579
|
-
</script>
|
|
580
|
-
</body>
|
|
581
|
-
|
|
582
|
-
</html>
|