Skip to content

feat: add codegen-react and codegen-html embedded skills#19

Merged
initializ-mk merged 2 commits intomainfrom
skills/codegen-ui
Mar 4, 2026
Merged

feat: add codegen-react and codegen-html embedded skills#19
initializ-mk merged 2 commits intomainfrom
skills/codegen-ui

Conversation

@initializ-mk
Copy link
Contributor

Summary

  • Add codegen-react embedded skill: Vite + React 19 with Tailwind CSS CDN, 4 tools (scaffold, run, read, write). The codegen_react_run tool handles npm install and starts the dev server with browser auto-open and actual port detection.
  • Add codegen-html embedded skill: Preact + HTM via CDN with Tailwind CSS, 3 tools (scaffold, read, write). Zero local dependencies — just open index.html in a browser. Supports single-file and multi-file modes.
  • Both skills include Forge dark theme defaults (zinc/indigo Tailwind palette), path traversal prevention, and strong LLM guardrails in SKILL.md (never rewrite main.jsx, always use named exports, never invent index.css, use Tailwind classes).
  • Unify skill category from dev to developer across code-review and codegen skills for consistent filtering.
  • Update docs/skills.md with complete built-in skills table (10 skills) and detailed sections for both new skills.

Test plan

  • go test ./forge-skills/... — all pass (10 skills discovered, display names, bins/env/egress validated)
  • gofmt and golangci-lint — 0 issues
  • Manual: scaffold → run → read → write cycle verified for codegen-react
  • Manual: scaffold (single-file and multi-file) verified for codegen-html
  • Manual: path traversal (../etc/passwd) correctly rejected
  • Manual: Vite auto-detects available port and script returns actual URL
  • All 5 developer-category skills use consistent category: developer

Add two new code generation skills for frontend UI scaffolding:

- codegen-react: Vite + React 19 with Tailwind CSS, 4 tools
  (scaffold, run, read, write). The run tool handles npm install
  and starts the dev server with browser auto-open.
- codegen-html: Preact + HTM via CDN with Tailwind CSS, 3 tools
  (scaffold, read, write). Zero dependencies — just open index.html.

Both skills include Forge dark theme defaults, path traversal
prevention, and strong LLM guardrails to prevent common errors
(rewriting main.jsx, using default exports, inventing index.css).

Updates docs/skills.md with complete skill table and detailed
sections for both new skills.
Code-review skills used 'dev' while codegen skills used 'developer'.
Standardize all to 'developer' for consistent filtering.
@initializ-mk initializ-mk merged commit 1df1f42 into main Mar 4, 2026
9 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant