diff --git a/web/index.html b/web/index.html index ba73c63..93d1158 100644 --- a/web/index.html +++ b/web/index.html @@ -80,11 +80,11 @@

CI/CD Ready

- 🧠 -

Claude Code Skills

+ 🤖 +

Agent-Friendly

- Built-in skills teach Claude Code your project conventions. - Autonomous /dev pipeline from design to shipping. + JSON stdout, actionable errors, example-driven help — + designed for AI agents to operate reliably.

@@ -99,6 +99,67 @@

Release Automation

+ +
+
+

Built for AI Agents

+

+ AI agents operate your CLI programmatically. This template bakes in the + rararulab agent-friendly CLI standards + so every generated project is agent-ready from day one. +

+
+
+ 01 +

JSON stdout, logs stderr

+

Structured output on stdout for machine parsing. Human-readable logs on stderr. Never mix formats.

+
+
+ 02 +

Fail fast with suggestions

+

Every error includes a suggestion field so agents can self-correct without human intervention.

+
+
+ 03 +

Non-interactive first

+

Every parameter passable via flags. No stdin prompts without a flag equivalent. Agents cannot handle dynamic prompts.

+
+
+ 04 +

Example-driven help

+

Every subcommand's --help includes runnable examples. Agents pattern-match better than they parse prose.

+
+
+ 05 +

Idempotent operations

+

Agents retry frequently. Create operations return success if the resource already exists — no duplicate side effects.

+
+
+ 06 +

Dry-run & force bypass

+

Destructive commands support --dry-run. Interactive confirmations have --yes to bypass. Safe automation by default.

+
+
+ +
+
+
+ + + +
+
# Success: structured JSON on stdout
+$ my-cli deploy --env staging
+{"ok": true, "action": "deploy", "deploy_id": "d-123"}
+
+# Error: actionable suggestion included
+$ my-cli deploy
+{"ok": false, "error": "missing --env", "suggestion": "add --env staging or --env prod"}
+
+
+
+
+
@@ -127,9 +188,9 @@

Create Your Own

    -
  1. Install instantly via npx — no Rust required
  2. -
  3. Or generate your own project from the template
  4. -
  5. Claude Code skills guide your development workflow
  6. +
  7. Install instantly via npx — no Rust required
  8. +
  9. Or generate your own project with cargo generate
  10. +
  11. Agent-friendly by default — JSON output, actionable errors
diff --git a/web/src/style.css b/web/src/style.css index 4f7ba9e..c185509 100644 --- a/web/src/style.css +++ b/web/src/style.css @@ -229,6 +229,93 @@ html.js .features__grid .reveal:nth-child(6) { transition-delay: 400ms; } line-height: 1.7; } +/* ===== Agent-Friendly Design ===== */ +.agent-design { + padding: var(--sp-20) 0; + background: var(--color-surface); +} + +.agent-design__intro { + max-width: 640px; + margin: 0 auto var(--sp-12); + text-align: center; + font-size: var(--text-lg); + color: var(--color-muted); + line-height: 1.7; +} + +.agent-design__link { + color: var(--color-pop); + text-decoration: underline; + text-underline-offset: 2px; + transition: color var(--motion-fast); +} + +.agent-design__link:hover { + color: var(--color-pop-hover); +} + +.principles { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: var(--sp-6); + margin-bottom: var(--sp-12); +} + +.principle { + padding: var(--sp-6); + border-left: 3px solid var(--color-pop); + background: var(--color-bg); + border-radius: 0 var(--radius-sm) var(--radius-sm) 0; +} + +.principle__number { + display: inline-block; + font-family: var(--font-mono); + font-size: var(--text-sm); + font-weight: 500; + color: var(--color-pop); + margin-bottom: var(--sp-2); +} + +.principle__title { + font-size: var(--text-base); + font-weight: 700; + margin-bottom: var(--sp-2); +} + +.principle__desc { + color: var(--color-muted); + font-size: var(--text-sm); + line-height: 1.7; +} + +.agent-design__terminal { + max-width: 640px; + margin: 0 auto; +} + +.terminal__comment { + color: var(--color-muted); + font-style: italic; +} + +.terminal__json { + color: var(--color-ok); +} + +.terminal__json-err { + color: var(--color-pop); +} + +/* Stagger for principles */ +html.js .principles .reveal:nth-child(1) { transition-delay: 0ms; } +html.js .principles .reveal:nth-child(2) { transition-delay: 80ms; } +html.js .principles .reveal:nth-child(3) { transition-delay: 160ms; } +html.js .principles .reveal:nth-child(4) { transition-delay: 240ms; } +html.js .principles .reveal:nth-child(5) { transition-delay: 320ms; } +html.js .principles .reveal:nth-child(6) { transition-delay: 400ms; } + /* ===== Install / Quickstart ===== */ .install { padding: var(--sp-20) 0;