GitHub Pages is configured to serve from /docs in main branch. Moved documentation site from plugins/compounding-engineering/docs/ to repository root /docs folder. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
949 lines
45 KiB
HTML
949 lines
45 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="theme-dark">
|
|
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Compounding Engineering - AI-Powered Development Tools for Claude Code</title>
|
|
<meta content="AI-powered development tools that get smarter with every use. 23 agents, 16 commands, 11 skills, two MCP servers." name="description" />
|
|
<meta content="width=device-width, initial-scale=1" name="viewport" />
|
|
|
|
<!-- Open Graph -->
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:site_name" content="Compounding Engineering" />
|
|
<meta property="og:locale" content="en_US" />
|
|
<meta property="og:title" content="Compounding Engineering - AI Development Tools" />
|
|
<meta property="og:description" content="AI-powered development tools that get smarter with every use. Make each unit of engineering work easier than the last." />
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<meta name="twitter:title" content="Compounding Engineering" />
|
|
<meta name="twitter:description" content="AI-powered development tools for Claude Code" />
|
|
|
|
<!-- Styles -->
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" />
|
|
<link href="css/style.css" rel="stylesheet" type="text/css" />
|
|
<script src="js/main.js" type="text/javascript" defer></script>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="background-gradient"></div>
|
|
<div class="page-container">
|
|
<header class="nav-container">
|
|
<a href="index.html" class="nav-brand">
|
|
<span class="logo-icon"><i class="fa-solid fa-layer-group"></i></span>
|
|
<span class="logo-text">Compounding Engineering</span>
|
|
</a>
|
|
<nav role="navigation" class="nav-menu" data-navigation>
|
|
<a href="#agents" class="nav-link">Agents</a>
|
|
<a href="#commands" class="nav-link">Commands</a>
|
|
<a href="#skills" class="nav-link">Skills</a>
|
|
<a href="#mcp-servers" class="nav-link">MCP Servers</a>
|
|
<a href="pages/getting-started.html" class="nav-link">Docs</a>
|
|
<div class="button-group stacked margin-top-l mobile-only">
|
|
<a href="#install" class="button primary">Install Plugin</a>
|
|
</div>
|
|
</nav>
|
|
<div class="button-group">
|
|
<a href="https://github.com/EveryInc/every-marketplace" class="button ghost compact hide-on-mobile">
|
|
<div class="fa-brands fa-github icon l"></div>
|
|
</a>
|
|
<a href="#install" class="button primary compact">Install</a>
|
|
<button class="button ghost compact nav-hamburger" data-mobile-toggle aria-label="Show menu">
|
|
<span class="fa-solid fa-bars icon m"></span>
|
|
</button>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<!-- Hero Section -->
|
|
<section class="hero-section">
|
|
<div class="hero-decoration"></div>
|
|
<div class="heading hero centered">
|
|
<a href="https://github.com/EveryInc/every-marketplace/releases" class="eyebrow">
|
|
<i class="fa-solid fa-rocket"></i> Version 2.6.0 released!
|
|
</a>
|
|
<h1 class="balanced" style="margin-bottom: 32px;">
|
|
AI-Powered Development Tools That Get Smarter With Every Use
|
|
</h1>
|
|
<p class="paragraph m secondary balanced" style="margin-bottom: 32px;">
|
|
Make each unit of engineering work easier than the last. 23 specialized agents, 16 powerful commands,
|
|
11 intelligent skills, and two MCP servers for code review, research, design, and workflow automation.
|
|
</p>
|
|
<div class="button-group margin-paragraph centered">
|
|
<a href="#install" class="button primary">
|
|
<i class="fa-solid fa-download"></i> Install Plugin
|
|
</a>
|
|
<a href="pages/getting-started.html" class="button tertiary">
|
|
<i class="fa-solid fa-book"></i> Read the Docs
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Stats Section -->
|
|
<section class="stats-section">
|
|
<div class="stats-container">
|
|
<div class="stat-card">
|
|
<div class="stat-icon"><i class="fa-solid fa-users-gear"></i></div>
|
|
<div class="stat-number">23</div>
|
|
<div class="stat-label">Specialized Agents</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-icon"><i class="fa-solid fa-terminal"></i></div>
|
|
<div class="stat-number">16</div>
|
|
<div class="stat-label">Slash Commands</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-icon"><i class="fa-solid fa-wand-magic-sparkles"></i></div>
|
|
<div class="stat-number">11</div>
|
|
<div class="stat-label">Intelligent Skills</div>
|
|
</div>
|
|
<div class="stat-card">
|
|
<div class="stat-icon"><i class="fa-solid fa-server"></i></div>
|
|
<div class="stat-number">2</div>
|
|
<div class="stat-label">MCP Servers</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Philosophy Section -->
|
|
<section id="philosophy" class="philosophy-section">
|
|
<div class="heading centered">
|
|
<h2 class="no-top-margin" style="font-size: 42px; margin-bottom: 16px;">The Compounding Engineering Philosophy</h2>
|
|
<p class="paragraph l secondary balanced" style="font-size: 21px; line-height: 1.6; font-weight: 500;">
|
|
Every unit of engineering work should make subsequent units of work <em style="color: var(--color-accent); font-style: normal;">easier</em>—not harder.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Philosophy Quote -->
|
|
<div class="philosophy-quote">
|
|
<blockquote>
|
|
"Most engineering creates linear value: you build a feature, it works, done.
|
|
Compounding engineering creates exponential value: each solved problem teaches the system,
|
|
each pattern becomes reusable, each review strengthens future reviews."
|
|
</blockquote>
|
|
</div>
|
|
|
|
<!-- The Four Pillars -->
|
|
<div class="philosophy-pillars">
|
|
<div class="pillar">
|
|
<div class="pillar-icon"><i class="fa-solid fa-brain"></i></div>
|
|
<div class="pillar-content">
|
|
<h3>Plan</h3>
|
|
<p class="pillar-tagline">Understand before you build</p>
|
|
<p class="pillar-description">
|
|
Before writing a single line of code, gather context. Research agents explore
|
|
documentation, analyze git history, and find best practices. The <code>/workflows:plan</code>
|
|
command orchestrates three research agents in parallel to create comprehensive implementation plans.
|
|
</p>
|
|
<div class="pillar-tools">
|
|
<span class="tool-tag">framework-docs-researcher</span>
|
|
<span class="tool-tag">best-practices-researcher</span>
|
|
<span class="tool-tag">repo-research-analyst</span>
|
|
<span class="tool-tag">git-history-analyzer</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pillar">
|
|
<div class="pillar-icon"><i class="fa-solid fa-robot"></i></div>
|
|
<div class="pillar-content">
|
|
<h3>Delegate</h3>
|
|
<p class="pillar-tagline">Leverage specialized expertise</p>
|
|
<p class="pillar-description">
|
|
Each agent brings deep domain knowledge. The <code>kieran-rails-reviewer</code> knows Rails
|
|
conventions like an expert. The <code>security-sentinel</code> catches OWASP vulnerabilities.
|
|
The <code>/workflows:work</code> command executes plans while maintaining quality gates.
|
|
</p>
|
|
<div class="pillar-tools">
|
|
<span class="tool-tag">24 specialized agents</span>
|
|
<span class="tool-tag">/workflows:work</span>
|
|
<span class="tool-tag">dhh-ruby-style skill</span>
|
|
<span class="tool-tag">git-worktree skill</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pillar">
|
|
<div class="pillar-icon"><i class="fa-solid fa-magnifying-glass"></i></div>
|
|
<div class="pillar-content">
|
|
<h3>Assess</h3>
|
|
<p class="pillar-tagline">Multiple perspectives, comprehensive coverage</p>
|
|
<p class="pillar-description">
|
|
The <code>/workflows:review</code> command launches 12 or more review agents in parallel: security,
|
|
performance, architecture, data integrity, patterns, and more. Findings are categorized by
|
|
severity (P1/P2/P3) and stored as actionable todo files.
|
|
</p>
|
|
<div class="pillar-tools">
|
|
<span class="tool-tag">security-sentinel</span>
|
|
<span class="tool-tag">performance-oracle</span>
|
|
<span class="tool-tag">architecture-strategist</span>
|
|
<span class="tool-tag">data-integrity-guardian</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pillar">
|
|
<div class="pillar-icon"><i class="fa-solid fa-book"></i></div>
|
|
<div class="pillar-content">
|
|
<h3>Codify</h3>
|
|
<p class="pillar-tagline">Turn solutions into knowledge</p>
|
|
<p class="pillar-description">
|
|
Every solved problem should teach the system. The <code>/workflows:codify</code> command
|
|
captures solutions as searchable documentation with YAML frontmatter for fast lookup.
|
|
</p>
|
|
<div class="pillar-tools">
|
|
<span class="tool-tag">/workflows:codify</span>
|
|
<span class="tool-tag">codify-docs skill</span>
|
|
<span class="tool-tag">file-todos skill</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
<!-- Agents Section -->
|
|
<section id="agents">
|
|
<div class="heading">
|
|
<h2 class="no-top-margin">
|
|
<i class="fa-solid fa-users-gear color-accent"></i> 23 Specialized Agents
|
|
</h2>
|
|
<p class="paragraph m secondary">
|
|
Each agent brings deep expertise in a specific domain. Run them individually or orchestrate
|
|
multiple agents in parallel for comprehensive analysis.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Review Agents -->
|
|
<div class="agent-category">
|
|
<h3><i class="fa-solid fa-code-pull-request"></i> Review Agents (10)</h3>
|
|
<div class="grid columns-2">
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">kieran-rails-reviewer</span>
|
|
<span class="agent-badge">Rails</span>
|
|
</div>
|
|
<p class="agent-description">Super senior Rails developer with impeccable taste. Applies strict conventions for Turbo Streams, namespacing, and the "duplication over complexity" philosophy.</p>
|
|
<code class="agent-usage">claude agent kieran-rails-reviewer</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">dhh-rails-reviewer</span>
|
|
<span class="agent-badge">Rails</span>
|
|
</div>
|
|
<p class="agent-description">Reviews code from DHH's perspective. Focus on Rails conventions, simplicity, and avoiding over-engineering.</p>
|
|
<code class="agent-usage">claude agent dhh-rails-reviewer</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">kieran-python-reviewer</span>
|
|
<span class="agent-badge">Python</span>
|
|
</div>
|
|
<p class="agent-description">Python code review with strict conventions. PEP 8 compliance, type hints, and Pythonic patterns.</p>
|
|
<code class="agent-usage">claude agent kieran-python-reviewer</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">kieran-typescript-reviewer</span>
|
|
<span class="agent-badge">TypeScript</span>
|
|
</div>
|
|
<p class="agent-description">TypeScript review with focus on type safety, modern patterns, and clean architecture.</p>
|
|
<code class="agent-usage">claude agent kieran-typescript-reviewer</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">security-sentinel</span>
|
|
<span class="agent-badge critical">Security</span>
|
|
</div>
|
|
<p class="agent-description">Security audits and vulnerability assessments. OWASP top 10, injection attacks, authentication flaws.</p>
|
|
<code class="agent-usage">claude agent security-sentinel</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">performance-oracle</span>
|
|
<span class="agent-badge">Performance</span>
|
|
</div>
|
|
<p class="agent-description">Performance analysis and optimization recommendations. N+1 queries, caching strategies, bottleneck identification.</p>
|
|
<code class="agent-usage">claude agent performance-oracle</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">architecture-strategist</span>
|
|
<span class="agent-badge">Architecture</span>
|
|
</div>
|
|
<p class="agent-description">Analyze architectural decisions, compliance, and system design patterns.</p>
|
|
<code class="agent-usage">claude agent architecture-strategist</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">data-integrity-guardian</span>
|
|
<span class="agent-badge critical">Data</span>
|
|
</div>
|
|
<p class="agent-description">Database migrations and data integrity review. Schema changes, foreign keys, data consistency.</p>
|
|
<code class="agent-usage">claude agent data-integrity-guardian</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">pattern-recognition-specialist</span>
|
|
<span class="agent-badge">Patterns</span>
|
|
</div>
|
|
<p class="agent-description">Analyze code for patterns and anti-patterns. Design patterns, code smells, refactoring opportunities.</p>
|
|
<code class="agent-usage">claude agent pattern-recognition-specialist</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">code-simplicity-reviewer</span>
|
|
<span class="agent-badge">Quality</span>
|
|
</div>
|
|
<p class="agent-description">Final pass for simplicity and minimalism. Remove unnecessary complexity, improve readability.</p>
|
|
<code class="agent-usage">claude agent code-simplicity-reviewer</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Research Agents -->
|
|
<div class="agent-category">
|
|
<h3><i class="fa-solid fa-microscope"></i> Research Agents (four)</h3>
|
|
<div class="grid columns-2">
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">framework-docs-researcher</span>
|
|
<span class="agent-badge">Research</span>
|
|
</div>
|
|
<p class="agent-description">Research framework documentation and best practices. Find official guidance and community patterns.</p>
|
|
<code class="agent-usage">claude agent framework-docs-researcher</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">best-practices-researcher</span>
|
|
<span class="agent-badge">Research</span>
|
|
</div>
|
|
<p class="agent-description">Gather external best practices and examples from the community and industry standards.</p>
|
|
<code class="agent-usage">claude agent best-practices-researcher</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">git-history-analyzer</span>
|
|
<span class="agent-badge">Git</span>
|
|
</div>
|
|
<p class="agent-description">Analyze git history and code evolution. Understand how code has changed and why.</p>
|
|
<code class="agent-usage">claude agent git-history-analyzer</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">repo-research-analyst</span>
|
|
<span class="agent-badge">Research</span>
|
|
</div>
|
|
<p class="agent-description">Research repository structure and conventions. Understand project patterns and organization.</p>
|
|
<code class="agent-usage">claude agent repo-research-analyst</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Design Agents -->
|
|
<div class="agent-category">
|
|
<h3><i class="fa-solid fa-palette"></i> Design Agents (three)</h3>
|
|
<div class="grid columns-3">
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">design-iterator</span>
|
|
<span class="agent-badge">Design</span>
|
|
</div>
|
|
<p class="agent-description">Iteratively refine UI through systematic design iterations with screenshots and feedback loops.</p>
|
|
<code class="agent-usage">claude agent design-iterator</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">figma-design-sync</span>
|
|
<span class="agent-badge">Figma</span>
|
|
</div>
|
|
<p class="agent-description">Synchronize web implementations with Figma designs. Pixel-perfect matching.</p>
|
|
<code class="agent-usage">claude agent figma-design-sync</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">design-implementation-reviewer</span>
|
|
<span class="agent-badge">Review</span>
|
|
</div>
|
|
<p class="agent-description">Verify UI implementations match Figma designs. Catch visual regressions.</p>
|
|
<code class="agent-usage">claude agent design-implementation-reviewer</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Workflow Agents -->
|
|
<div class="agent-category">
|
|
<h3><i class="fa-solid fa-gears"></i> Workflow Agents (five)</h3>
|
|
<div class="grid columns-2">
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">bug-reproduction-validator</span>
|
|
<span class="agent-badge">Bugs</span>
|
|
</div>
|
|
<p class="agent-description">Systematically reproduce and validate bug reports. Create minimal reproduction cases.</p>
|
|
<code class="agent-usage">claude agent bug-reproduction-validator</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">pr-comment-resolver</span>
|
|
<span class="agent-badge">PR</span>
|
|
</div>
|
|
<p class="agent-description">Address PR comments and implement fixes. Batch process review feedback.</p>
|
|
<code class="agent-usage">claude agent pr-comment-resolver</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">lint</span>
|
|
<span class="agent-badge">Quality</span>
|
|
</div>
|
|
<p class="agent-description">Run linting and code quality checks on Ruby and ERB files.</p>
|
|
<code class="agent-usage">claude agent lint</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">spec-flow-analyzer</span>
|
|
<span class="agent-badge">Testing</span>
|
|
</div>
|
|
<p class="agent-description">Analyze user flows and identify gaps in specifications.</p>
|
|
<code class="agent-usage">claude agent spec-flow-analyzer</code>
|
|
</div>
|
|
<div class="agent-card">
|
|
<div class="agent-header">
|
|
<span class="agent-name">every-style-editor</span>
|
|
<span class="agent-badge">Content</span>
|
|
</div>
|
|
<p class="agent-description">Edit content to conform to Every's style guide.</p>
|
|
<code class="agent-usage">claude agent every-style-editor</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Docs Agent -->
|
|
<div class="agent-category">
|
|
<h3><i class="fa-solid fa-file-lines"></i> Documentation Agent (one)</h3>
|
|
<div class="grid">
|
|
<div class="agent-card full-width">
|
|
<div class="agent-header">
|
|
<span class="agent-name">ankane-readme-writer</span>
|
|
<span class="agent-badge">Docs</span>
|
|
</div>
|
|
<p class="agent-description">Create READMEs following Ankane-style template for Ruby gems. Clean, concise, comprehensive documentation that gets straight to the point.</p>
|
|
<code class="agent-usage">claude agent ankane-readme-writer</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Commands Section -->
|
|
<section id="commands">
|
|
<div class="heading">
|
|
<h2 class="no-top-margin">
|
|
<i class="fa-solid fa-terminal color-accent"></i> 16 Powerful Commands
|
|
</h2>
|
|
<p class="paragraph m secondary">
|
|
Slash commands for common workflows. From code review to bug triage,
|
|
these commands automate complex multi-step processes.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Workflow Commands -->
|
|
<div class="command-category">
|
|
<h3><i class="fa-solid fa-arrows-spin"></i> Workflow Commands</h3>
|
|
<div class="grid columns-2">
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/workflows:plan</code>
|
|
<span class="command-type-badge">core</span>
|
|
</div>
|
|
<p class="command-description">Create comprehensive implementation plans with research agents and stakeholder analysis.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/workflows:review</code>
|
|
<span class="command-type-badge">core</span>
|
|
</div>
|
|
<p class="command-description">Run exhaustive code reviews using 12 or more parallel agents, ultra-thinking, and worktrees.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/workflows:work</code>
|
|
<span class="command-type-badge">core</span>
|
|
</div>
|
|
<p class="command-description">Execute work items systematically with progress tracking and validation.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/workflows:codify</code>
|
|
<span class="command-type-badge">core</span>
|
|
</div>
|
|
<p class="command-description">Document solved problems for the knowledge base. Turn learnings into reusable patterns.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Utility Commands -->
|
|
<div class="command-category">
|
|
<h3><i class="fa-solid fa-wrench"></i> Utility Commands</h3>
|
|
<div class="grid columns-3">
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/changelog</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Create engaging changelogs for recent merges.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/create-agent-skill</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Create or edit Claude Code skills with expert guidance.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/generate_command</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Generate new slash commands from templates.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/heal-skill</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Fix skill documentation issues automatically.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/plan_review</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Multi-agent plan review in parallel.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/prime</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Prime/setup command for project initialization.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/report-bug</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Report bugs in the plugin with structured templates.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/reproduce-bug</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Reproduce bugs using logs and console output.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/triage</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Triage and prioritize issues interactively.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/resolve_parallel</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Resolve TODO comments in parallel.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/resolve_pr_parallel</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Resolve PR comments in parallel.</p>
|
|
</div>
|
|
<div class="command-card">
|
|
<div class="command-header">
|
|
<code class="command-name">/resolve_todo_parallel</code>
|
|
<span class="command-type-badge">util</span>
|
|
</div>
|
|
<p class="command-description">Resolve file-based todos in parallel.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Skills Section -->
|
|
<section id="skills">
|
|
<div class="heading">
|
|
<h2 class="no-top-margin">
|
|
<i class="fa-solid fa-wand-magic-sparkles color-accent"></i> 11 Intelligent Skills
|
|
</h2>
|
|
<p class="paragraph m secondary">
|
|
Skills provide deep domain expertise that Claude Code can invoke on-demand.
|
|
From Ruby gem patterns to image generation.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Development Tools -->
|
|
<div class="skill-category">
|
|
<h3><i class="fa-solid fa-code"></i> Development Tools</h3>
|
|
<div class="grid columns-2">
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">andrew-kane-gem-writer</span>
|
|
<span class="skill-badge">Ruby</span>
|
|
</div>
|
|
<p class="skill-description">Write Ruby gems following Andrew Kane's patterns. Clean APIs, smart defaults, comprehensive testing.</p>
|
|
<code class="skill-usage">skill: andrew-kane-gem-writer</code>
|
|
</div>
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">dhh-ruby-style</span>
|
|
<span class="skill-badge">Rails</span>
|
|
</div>
|
|
<p class="skill-description">Write Ruby/Rails code in DHH's 37signals style. Convention over configuration, beautiful code.</p>
|
|
<code class="skill-usage">skill: dhh-ruby-style</code>
|
|
</div>
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">dspy-ruby</span>
|
|
<span class="skill-badge">AI</span>
|
|
</div>
|
|
<p class="skill-description">Build type-safe LLM applications with DSPy.rb. Structured prompting, optimization, providers.</p>
|
|
<code class="skill-usage">skill: dspy-ruby</code>
|
|
</div>
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">frontend-design</span>
|
|
<span class="skill-badge">Design</span>
|
|
</div>
|
|
<p class="skill-description">Create production-grade frontend interfaces with modern CSS, responsive design, accessibility.</p>
|
|
<code class="skill-usage">skill: frontend-design</code>
|
|
</div>
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">create-agent-skills</span>
|
|
<span class="skill-badge">Meta</span>
|
|
</div>
|
|
<p class="skill-description">Expert guidance for creating Claude Code skills. Templates, best practices, validation.</p>
|
|
<code class="skill-usage">skill: create-agent-skills</code>
|
|
</div>
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">skill-creator</span>
|
|
<span class="skill-badge">Meta</span>
|
|
</div>
|
|
<p class="skill-description">Guide for creating effective Claude Code skills with structured workflows.</p>
|
|
<code class="skill-usage">skill: skill-creator</code>
|
|
</div>
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">codify-docs</span>
|
|
<span class="skill-badge">Docs</span>
|
|
</div>
|
|
<p class="skill-description">Capture solved problems as categorized documentation with YAML schema.</p>
|
|
<code class="skill-usage">skill: codify-docs</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Content & Workflow -->
|
|
<div class="skill-category">
|
|
<h3><i class="fa-solid fa-pen-fancy"></i> Content & Workflow</h3>
|
|
<div class="grid columns-3">
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">every-style-editor</span>
|
|
<span class="skill-badge">Content</span>
|
|
</div>
|
|
<p class="skill-description">Review copy for Every's style guide compliance.</p>
|
|
<code class="skill-usage">skill: every-style-editor</code>
|
|
</div>
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">file-todos</span>
|
|
<span class="skill-badge">Workflow</span>
|
|
</div>
|
|
<p class="skill-description">File-based todo tracking system with priorities and status.</p>
|
|
<code class="skill-usage">skill: file-todos</code>
|
|
</div>
|
|
<div class="skill-card">
|
|
<div class="skill-header">
|
|
<span class="skill-name">git-worktree</span>
|
|
<span class="skill-badge">Git</span>
|
|
</div>
|
|
<p class="skill-description">Manage Git worktrees for parallel development on multiple branches.</p>
|
|
<code class="skill-usage">skill: git-worktree</code>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Image Generation -->
|
|
<div class="skill-category">
|
|
<h3><i class="fa-solid fa-image"></i> Image Generation</h3>
|
|
<div class="grid">
|
|
<div class="skill-card featured full-width">
|
|
<div class="skill-header">
|
|
<span class="skill-name">gemini-imagegen</span>
|
|
<span class="skill-badge highlight">AI Images</span>
|
|
</div>
|
|
<p class="skill-description">
|
|
Generate and edit images using Google's Gemini API. Text-to-image, image editing,
|
|
multi-turn refinement, and composition from up to 14 reference images.
|
|
</p>
|
|
<div class="skill-features">
|
|
<div class="feature-item">
|
|
<i class="fa-solid fa-check"></i> Text-to-image generation
|
|
</div>
|
|
<div class="feature-item">
|
|
<i class="fa-solid fa-check"></i> Image editing & manipulation
|
|
</div>
|
|
<div class="feature-item">
|
|
<i class="fa-solid fa-check"></i> Multi-turn refinement
|
|
</div>
|
|
<div class="feature-item">
|
|
<i class="fa-solid fa-check"></i> Multiple reference images (up to 14)
|
|
</div>
|
|
<div class="feature-item">
|
|
<i class="fa-solid fa-check"></i> Google Search grounding (Pro)
|
|
</div>
|
|
</div>
|
|
<code class="skill-usage">skill: gemini-imagegen</code>
|
|
<p class="skill-note">Requires: GEMINI_API_KEY environment variable</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- MCP Servers Section -->
|
|
<section id="mcp-servers">
|
|
<div class="heading">
|
|
<h2 class="no-top-margin">
|
|
<i class="fa-solid fa-server color-accent"></i> Two MCP Servers
|
|
</h2>
|
|
<p class="paragraph m secondary">
|
|
Model Context Protocol servers extend Claude Code's capabilities with
|
|
browser automation and framework documentation lookup.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid columns-2">
|
|
<div class="mcp-card mcp-card-browser">
|
|
<div class="mcp-header">
|
|
<i class="fa-brands fa-chrome mcp-icon"></i>
|
|
<span class="mcp-name">Playwright</span>
|
|
</div>
|
|
<p class="mcp-description">Browser automation for testing, screenshots, and web interactions.</p>
|
|
<div class="mcp-tools">
|
|
<h4>Tools Provided: <span class="tools-count">6 tools</span></h4>
|
|
<ul>
|
|
<li><code>browser_navigate</code> - Navigate to URLs</li>
|
|
<li><code>browser_take_screenshot</code> - Take screenshots</li>
|
|
<li><code>browser_click</code> - Click elements</li>
|
|
<li><code>browser_fill_form</code> - Fill form fields</li>
|
|
<li><code>browser_snapshot</code> - Get accessibility snapshot</li>
|
|
<li><code>browser_evaluate</code> - Execute JavaScript</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="mcp-card mcp-card-docs">
|
|
<div class="mcp-header">
|
|
<i class="fa-solid fa-book-open mcp-icon"></i>
|
|
<span class="mcp-name">Context7</span>
|
|
</div>
|
|
<p class="mcp-description">Framework documentation lookup for more than 100 frameworks.</p>
|
|
<div class="mcp-tools">
|
|
<h4>Tools Provided: <span class="tools-count">2 tools</span></h4>
|
|
<ul>
|
|
<li><code>resolve-library-id</code> - Find library ID</li>
|
|
<li><code>get-library-docs</code> - Get documentation</li>
|
|
</ul>
|
|
<p class="mcp-note">Supports: Rails, React, Next.js, Vue, Django, Laravel, and more than 100 others</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Installation Section -->
|
|
<section id="install" class="install-section">
|
|
<div class="heading centered">
|
|
<h2 class="no-top-margin">Get Started in Seconds</h2>
|
|
<p class="paragraph m secondary">
|
|
Install the plugin and start using AI-powered development tools immediately.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="install-steps">
|
|
<div class="install-step">
|
|
<div class="step-number">1</div>
|
|
<div class="step-content">
|
|
<h3>Add the Marketplace</h3>
|
|
<div class="card-code-block">
|
|
<pre><code>claude /plugin marketplace add https://github.com/EveryInc/every-marketplace</code></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="install-step">
|
|
<div class="step-number">2</div>
|
|
<div class="step-content">
|
|
<h3>Install the Plugin</h3>
|
|
<div class="card-code-block">
|
|
<pre><code>claude /plugin install compounding-engineering</code></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="install-step">
|
|
<div class="step-number">3</div>
|
|
<div class="step-content">
|
|
<h3>Start Using</h3>
|
|
<div class="card-code-block">
|
|
<pre><code># Run a code review
|
|
/workflows:review PR#123
|
|
|
|
# Use an agent
|
|
claude agent kieran-rails-reviewer
|
|
|
|
# Invoke a skill
|
|
skill: gemini-imagegen</code></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- FAQ Section -->
|
|
<section id="faq">
|
|
<div class="heading centered">
|
|
<h2 class="no-top-margin">Frequently Asked Questions</h2>
|
|
</div>
|
|
<div class="accordion-container">
|
|
<details class="accordion-item" name="faq">
|
|
<summary class="accordion-toggle">
|
|
<p class="paragraph m bold">What is Compounding Engineering?</p>
|
|
<span class="accordion-chevron fa-solid fa-chevron-down"></span>
|
|
</summary>
|
|
<div class="accordion-content">
|
|
<p>
|
|
Compounding Engineering is a philosophy that every unit of engineering work should make subsequent
|
|
units easier—not harder. This plugin embodies that philosophy with tools that learn from patterns,
|
|
automate repetitive tasks, and build institutional knowledge.
|
|
</p>
|
|
</div>
|
|
</details>
|
|
<details class="accordion-item" name="faq">
|
|
<summary class="accordion-toggle">
|
|
<p class="paragraph m bold">How do agents differ from skills?</p>
|
|
<span class="accordion-chevron fa-solid fa-chevron-down"></span>
|
|
</summary>
|
|
<div class="accordion-content">
|
|
<p>
|
|
<strong>Agents</strong> are specialized personas that can be invoked to perform specific tasks
|
|
(e.g., code review, research). They're called with <code>claude agent [name]</code>.
|
|
</p>
|
|
<p>
|
|
<strong>Skills</strong> provide domain expertise that Claude Code can use on-demand. They include
|
|
reference materials, templates, and workflows. They're invoked with <code>skill: [name]</code>.
|
|
</p>
|
|
</div>
|
|
</details>
|
|
<details class="accordion-item" name="faq">
|
|
<summary class="accordion-toggle">
|
|
<p class="paragraph m bold">Why aren't MCP servers loading automatically?</p>
|
|
<span class="accordion-chevron fa-solid fa-chevron-down"></span>
|
|
</summary>
|
|
<div class="accordion-content">
|
|
<p>
|
|
This is a known issue. As a workaround, manually add the MCP servers to your
|
|
<code>.claude/settings.json</code> file. See the README for the exact configuration.
|
|
</p>
|
|
</div>
|
|
</details>
|
|
<details class="accordion-item" name="faq">
|
|
<summary class="accordion-toggle">
|
|
<p class="paragraph m bold">Can I use this with languages other than Ruby/Rails?</p>
|
|
<span class="accordion-chevron fa-solid fa-chevron-down"></span>
|
|
</summary>
|
|
<div class="accordion-content">
|
|
<p>
|
|
Yes! While many agents are specialized for Rails, we also have Python and TypeScript reviewers.
|
|
The workflow commands, research agents, and skills like gemini-imagegen work with any language.
|
|
</p>
|
|
</div>
|
|
</details>
|
|
<details class="accordion-item" name="faq">
|
|
<summary class="accordion-toggle">
|
|
<p class="paragraph m bold">How do I create my own agents or skills?</p>
|
|
<span class="accordion-chevron fa-solid fa-chevron-down"></span>
|
|
</summary>
|
|
<div class="accordion-content">
|
|
<p>
|
|
Use the <code>/create-agent-skill</code> command or the <code>create-agent-skills</code> skill
|
|
for expert guidance. The skill includes templates, best practices, and validation workflows.
|
|
</p>
|
|
</div>
|
|
</details>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA Section -->
|
|
<section class="promo-cta">
|
|
<div class="heading centered">
|
|
<span class="cta-badge"><i class="fa-solid fa-bolt"></i> Free & Open Source</span>
|
|
<h2>Transform Your Development Workflow in Minutes</h2>
|
|
<p class="paragraph m cta-subheading">
|
|
<strong>Install once. Compound forever.</strong> Get 23 expert agents, 16 workflow commands, and 11 specialized skills working for you—starting now.
|
|
</p>
|
|
<div class="button-group margin-paragraph centered">
|
|
<a href="#install" class="button primary cta-primary">
|
|
<i class="fa-solid fa-download"></i> Install Plugin Now
|
|
<span class="button-arrow">→</span>
|
|
</a>
|
|
<a href="https://github.com/EveryInc/every-marketplace" class="button tertiary cta-secondary">
|
|
<i class="fa-brands fa-github"></i> View on GitHub
|
|
</a>
|
|
</div>
|
|
<p class="cta-trust">Join 1,000+ developers building smarter with AI-powered workflows</p>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="footer">
|
|
<div class="footer-menu">
|
|
<div>
|
|
<p class="paragraph s">
|
|
© 2025 Every, Inc.<br />
|
|
Built with <a href="https://launchkit.evilmartians.io" target="_blank">LaunchKit</a> template by
|
|
<a href="https://evilmartians.com" target="_blank">Evil Martians</a>
|
|
</p>
|
|
</div>
|
|
<div>
|
|
<div class="link-list">
|
|
<a href="#agents" class="ui s">Agents</a>
|
|
<a href="#commands" class="ui s">Commands</a>
|
|
<a href="#skills" class="ui s">Skills</a>
|
|
<a href="pages/getting-started.html" class="ui s">Documentation</a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="link-list">
|
|
<a href="https://github.com/EveryInc/every-marketplace" class="icon-link ui s" target="_blank">
|
|
<div class="fa-brands fa-github icon m color-accent"></div>
|
|
<div class="pseudo-link">GitHub</div>
|
|
</a>
|
|
<a href="https://every.to" class="icon-link ui s" target="_blank">
|
|
<div class="fa-solid fa-globe icon m color-accent"></div>
|
|
<div class="pseudo-link">Every.to</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="link-list-horizontal">
|
|
<a href="https://every.to/legal/privacy" class="ui s tertiary">Privacy Policy</a>
|
|
<a href="https://every.to/legal/terms" class="ui s tertiary">Terms of Service</a>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
</body>
|
|
|
|
</html>
|