s3pages-website-builder

A Claude Code skill that takes a user from zero to a live website on S3Pages via a five-step pipeline: analyse reference sites → interview the user → generate HTML/CSS → convert to S3Pages JSON → submit via MCP.

See SKILL.md for the full pipeline spec, references/s3pages-schema.md for the JSON schema, and references/sample-conversion.md for a worked HTML→JSON example.

How to test this skill

1. Install the skill locally

Symlink (or copy) the repo into your Claude Code skills directory so it gets discovered:

mkdir -p ~/.claude/skills
ln -s /absolute/path/to/s3pages-website-builder ~/.claude/skills/s3pages-website-builder

Restart your Claude Code session (or start a new one) so it rescans the skills directory.

2. Verify discovery

In a new session, run /skills (or check the system reminder listing available skills). You should see s3pages-website-builder with the description from the SKILL.md frontmatter.

3. Trigger it

Two ways:

• Explicit — invoke the Skill tool by name. Quickest for iteration.
• Natural language — say one of the trigger phrases from the frontmatter description, e.g. "build me a website for my bakery", "create a landing page on S3Pages". If Claude doesn't auto-invoke, your description wording isn't triggering — tighten the trigger phrases.

4. Exercise each pipeline step

Walk the skill through the full five-step flow with a realistic business, watching for:

| Step | Check | |------|-------| | 1. ANALYSE | Does it actually web_fetch 2–3 reference sites, or skip ahead? | | 2. INTERVIEW | Does it ask all 7 required questions and confirm before generating? | | 3. GENERATE | Does the HTML include all 8 required sections in order, with Google Fonts + CSS variables? | | 4. CONVERT | Does the JSON validate against references/s3pages-schema.md? Unique ids, hero + footer present, all required fields? | | 5. SUBMIT | With the S3Pages MCP disconnected, does it fall back to showing the JSON + a connection prompt? |

5. Test the failure modes

From the Error Handling table in SKILL.md:

• Block web_fetch (airplane mode / bad URL) → should continue with fewer samples.
• Refuse optional fields during the interview → should generate placeholders.
• No S3Pages MCP connected → should still output the JSON for manual use.

Iteration loop

Edit SKILL.md or the reference files → start a fresh Claude Code session (skills are loaded at session start, so in-session edits don't take effect) → retrigger. Keep a scratch prompt like "build a site for Acme Plumbing, a family-owned plumber in Brooklyn" to replay consistently across iterations.

Runtime dependencies

This skill relies on capabilities that live outside this repo:

• web_fetch (Step 1 reference-site scraping)
• The frontend-design skill's principles (referenced by name in Step 3)
• An S3Pages MCP server exposing createPage and publishPage tools (Step 5). The skill degrades gracefully if the MCP is not connected.