purplemux: Skill for Claude Code

.claude/skills/4-build/SKILL.md

4-build is a skill for Claude Code from subicura/purplemux. It costs 0 tokens per session (887 once invoked), scanned A, original, MIT.

A page-code generation command that builds one application feature from its product specification and detailed UI, flow, and API documents. It follows the project's existing technology choices and coding conventions.

In plain words
What is it for?
Use it to implement a named feature, such as visit planning, from the matching versioned specification files and project guidelines.
Why use it?
It turns agreed design and behavior documents into implementation while keeping the coding context focused on one feature at a time.

Skill for Claude Code

Written for Claude Code: installed under .claude/. Also seen: mentions CLAUDE.md.

This is subicura/purplemux's own configuration. It tells Claude Code how to work on purplemux itself, so it is not a mod to install elsewhere. Copy it as a starting point and replace the rules that are about this project. Everything purplemux configures →

Reuse

Borrowing it

Nothing to install: this file belongs to subicura/purplemux. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.

Copy the file
curl -O https://raw.githubusercontent.com/subicura/purplemux/main/.claude/skills/4-build/SKILL.md
Clone the repo
git clone --depth 1 https://github.com/subicura/purplemux

Made for: Claude Code.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for 4-build

README.md
[![agentmods](https://agentmods.dev/badge/skills/subicura/purplemux/4-build/github.svg)](https://agentmods.dev/skills/subicura/purplemux/4-build)
Your own site
<a href="https://agentmods.dev/skills/subicura/purplemux/4-build"><img src="https://agentmods.dev/badge/skills/subicura/purplemux/4-build/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for 4-build

Your own site · 80×15
<a href="https://agentmods.dev/skills/subicura/purplemux/4-build"><img src="https://agentmods.dev/badge/skills/subicura/purplemux/4-build.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 0 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 887 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe. Third-party audits
  • NVIDIA SkillSpector pass 7 Sept 2026
How audits are shown
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00000 $0.00887
Opus 5 $0.00000 $0.00443
Sonnet 5 $0.00000 $0.00177
Haiku 4.5 $0.00000 $0.00089

Measured 12d ago against content hash 209db23881b9, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-12, from the pricing page.

Security

Grade A, and why

4-build scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 12d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

.claude/skills/4-build/SKILL.md · 82 lines

What it actually says

page-generator — 페이지 코드 생성

스펙 문서 기반으로 코드를 생성합니다. 컨텍스트를 깔끔하게 유지하고 정확한 코드를 생성하기 위해 한 번에 하나의 feature만 처리합니다. "v1 visit-planning 구현해줘" 요청 시 사용합니다.

Instructions

다음 단계를 순서대로 수행하세요.

1. 인자 확인

  • 첫 번째 인자: 버전 (예: v1, v2)
  • 두 번째 인자: feature명 (예: visit-planning)
  • feature명이 없으면 "feature명을 지정해주세요. 예: /4-build v1 visit-planning" 안내 후 종료

2. CLAUDE.md 로드

  • CLAUDE.md를 읽어 기술 스택, 코드 규칙, 참고 문서 링크 파악

3. 프로젝트 가이드 로드

  • spec.mddepends_on에 명시된 docs/ 가이드를 로드하여 참조

4. 스펙 참조 및 코드 생성

다음 4개 스펙 문서를 모두 참조하여 코드를 생성합니다:

  • .specs/v{N}/features/{feature-name}/spec.md — 페이지 개요, 주요 기능
  • .specs/v{N}/features/{feature-name}/detail/ui.md — 화면 구성, 컴포넌트 매핑
  • .specs/v{N}/features/{feature-name}/detail/flow.md — 사용자 흐름, 상태 전이
  • .specs/v{N}/features/{feature-name}/detail/api.md — API 연동, 쿼리/뮤테이션

AI가 읽는 전체 컨텍스트:

CLAUDE.md (기술 스택 + 규칙 + 참고 문서 링크)
  + docs/{관련 가이드}.md
  + .specs/v{N}/features/{feature-name}/spec.md
  + .specs/v{N}/features/{feature-name}/detail/ui.md
  + .specs/v{N}/features/{feature-name}/detail/flow.md
  + .specs/v{N}/features/{feature-name}/detail/api.md

5. 기술 스택 준수

  • CLAUDE.md의 기술 스택에 맞는 구조로 코드 생성
  • 프로젝트의 기존 코드 패턴과 컨벤션 준수

6. 완료 안내

  • 코드 생성 완료 후 다음 안내 메시지를 반드시 출력:
다음 feature를 빌드하려면 `/new` 후 `/4-build`를 실행하세요.
(컨텍스트를 정리하고 새로운 세션에서 더 정확한 코드를 생성합니다)

7. 품질 기준 필수 적용

생성하는 모든 코드는 아래 세 가지 기준을 충족해야 합니다. 미달 시 코드를 생성하지 않습니다.

빠르다
  • Optimistic UI 패턴 적용 (mutation 후 UI 즉시 반영, 실패 시 롤백)
  • 스켈레톤 로딩 / 스피너를 모든 비동기 구간에 적용
  • SWR/캐시 전략, prefetch, 지연 로딩(dynamic import) 활용
  • 대량 목록은 가상 스크롤 또는 무한 스크롤 적용
토스급 완성도
  • 모든 비동기 UI에 로딩·빈·에러·성공 4가지 상태 구현
  • 폼 유효성 실시간 검증, 토스트/알림 피드백
  • 접근성: 키보드 내비게이션, 포커스 관리, 적절한 ARIA 속성
  • "일단 동작하는" 수준의 코드는 절대 커밋하지 않는다
포브스 TOP 10 기업 수준
  • 스펙에 명시된 기능은 빠짐없이, 실무에서 바로 쓸 수 있는 깊이로 구현
  • "되긴 되는" 수준이 아닌 "이 기능 하나로 충분하다"는 완결성을 목표
  • 기능과 관련된 맥락 정보를 화면에 함께 제공하여 사용자가 추가 조작 없이 업무를 완료할 수 있게 한다
Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 12d ago First seen · 82 lines · 0 tokens per session scan A 209db23881b9

Subscribe to this mod's changes

4-build is a skill published in the GitHub repository subicura/purplemux (59 stars, last pushed 1mo ago), licensed MIT. It costs nothing until one of its globs matches a file; then it loads 887 tokens. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other skills, from other repositories

figma

Complete guide for the Figma plugin — REST API access, real-time selection monitoring via CDP, and the figma-app interactive UI. Read this IMMEDIATELY when the user asks to work with Figma.

mereyabdenbekuly-ctrl/clodex-ide · 48 tokens

shipjaw-build

Scaffolds a brand-new TypeScript/Next.js application (NestJS API only when the product truly needs one) from a build-ready product prompt — writes committed documentation/, enforces strict TypeScript, Vitest, Playwright, security headers, clean architecture, then ships v1 behind a verification gate. Use when…

XyDisorder/shipjaw · 173 tokens

Cursor rules for Next

Cursor rules for Next.js development with Vercel and Supabase integration.

AmariahAK/atlarix-skills · 4 tokens

Cursor rules for Nextjs Supabase Shadcn Pwa

Skill "Cursor rules for Nextjs Supabase Shadcn Pwa" from AmariahAK/atlarix-skills, covering cursor rules for nextjs supabase shadcn pwa, when to use this skill, source, key principles and rules for build notes files.

AmariahAK/atlarix-skills · 12 tokens

Cursor rules for Next

Cursor rules for Next.js development with TypeScript integration.

AmariahAK/atlarix-skills · 4 tokens

nextjs-app-router

Full end-to-end tRPC setup for Next.js App Router. Covers route handler with fetchRequestHandler (GET + POST exports), TRPCProvider with QueryClientProvider, createTRPCOptionsProxy for RSC prefetching, HydrateClient/HydrationBoundary for hydration, useSuspenseQuery for Suspense, and server-side callers.

trpc/trpc · 74 tokens