一键导入
web-frontend
Use when building an elaborate multi-component claude.ai HTML artifact needing state, routing, or shadcn/ui — not for simple single-file artifacts.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
菜单
Use when building an elaborate multi-component claude.ai HTML artifact needing state, routing, or shadcn/ui — not for simple single-file artifacts.
用 Codex 或 Claude 帮你安装 复制这段 Prompt,粘贴到 Codex、Claude 或其他助手里,让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
| name | web-frontend |
| description | Use when building an elaborate multi-component claude.ai HTML artifact needing state, routing, or shadcn/ui — not for simple single-file artifacts. |
| license | Complete terms in LICENSE.txt |
Tooling for React 18 + TypeScript + Vite + Tailwind + shadcn/ui artifacts, bundled to a single self-contained HTML file via Parcel. Use it for complex artifacts (state management, routing, shadcn/ui components); for a simple single-file HTML/JSX artifact, skip this and just write the file.
VERY IMPORTANT: avoid excessive centered layouts, purple gradients, uniform rounded corners, and the Inter font.
bash scripts/init-artifact.sh <project-name> then cd <project-name>. Creates a fully configured project: React + TypeScript via Vite, Tailwind CSS 3.4.1 with the shadcn/ui theming system, 40+ shadcn/ui components pre-installed, all Radix UI deps, @/ path aliases, and Parcel bundling via .parcelrc. Auto-detects Node 18+ and pins a compatible Vite version.bash scripts/bundle-artifact.sh — requires an index.html in the project root. Builds with Parcel (no source maps) and inlines all JS/CSS/assets into a single bundle.html.bundle.html as the artifact.Anthropic API rate limit handling - retry logic, backoff, throttling for batch workloads against Claude models
Use when building an automated test → issue → fix loop with Claude Code and GitHub issues — overnight auto-fixing, regression loops, self-healing CI.
Use when creating, editing, publishing, or deleting posts on Cyril's Workshop blog or the steponnopets.net devblog.
Use when writing or contributing a boofuzz network-protocol fuzzer in this repo — layout, formatting rules, and reading results.
Use when a task needs real-time control of a connected browser via the Browser Bridge Broker — submit JS jobs over HTTP that browsers eval and return.
Use when training a character LoRA (Chroma/Flux or Pony/SDXL) on a RunPod GPU and wiring it into the ComfyUI + pony_web render stack.