Claude Code 스킬

Claude Code 스킬 설치

한 번만 설치하면 Claude Code가 화면·컴포넌트를 만들거나 토큰을 쓸 때 이 사이트의 토큰·컴포넌트 가이드를 자동으로 컨텍스트에 넣습니다. 세 앱(정비소 웹·정비사 앱·라이더 앱) 어디서든 같은 이름을 쓰게 됩니다.

한 줄 설치

터미널에서 아래 명령을 한 번만 실행하면 됩니다. SKILL.md를 사용자 글로벌 스킬 디렉터리(~/.claude/skills/buwang-design/)에 내려받습니다.

macOS · Linux · Git Bash

mkdir -p ~/.claude/skills/buwang-design && curl -fsSL https://design.buwang.co.kr/skill/SKILL.md -o ~/.claude/skills/buwang-design/SKILL.md

Windows PowerShell

New-Item -ItemType Directory -Force "$HOME\.claude\skills\buwang-design" | Out-Null; Invoke-WebRequest https://design.buwang.co.kr/skill/SKILL.md -OutFile "$HOME\.claude\skills\buwang-design\SKILL.md"

업데이트가 있을 때 같은 명령을 다시 실행하면 최신 SKILL.md로 덮어씁니다. 단, 스킬은 매 호출마다 사이트의 /llms.txt를 fetch하기 때문에 토큰·컴포넌트 데이터는 사이트만 업데이트하면 즉시 반영됩니다.

사용 방법

위 명령을 복사해 터미널에서 실행합니다. Claude Code 데스크톱 앱을 쓴다면 코드 탭에서 바로 실행해도 됩니다.
Claude Code를 열고 평소처럼 요청합니다. 예: 정비소 웹 예약 목록에 상태 배지 붙여 줘, 라이더 앱 V2 스타일로 정비 이력 카드 만들어 줘.
스킬이 자동으로 llms.txt와 components.json·tokens.json을 읽어 기존 컴포넌트와 토큰 이름을 우선 사용합니다. 직접 부르려면 /buwang-design.
특정 컴포넌트만 쓰고 싶으면 컴포넌트에서 카드를 열고 AI용 스펙 복사를 눌러 프롬프트에 붙여 넣습니다.

무엇이 주입되나

스킬은 사이트의 기계용 데이터만 참고하고, 값은 항상 각 앱 코드에서 추출한 현재 상태입니다.

/llms.txt — 플랫폼별 컴포넌트 색인과 사용 규칙(토큰 이름 우선, 플랫폼 먼저 확정)
/data/components.json — 컴포넌트별 변형·파라미터·토큰·규격·파일 경로·사용처 수
/data/tokens.json — 웹 / 정비사 / 라이더 V1·V2 색·타이포·간격·라운딩
/llms-full.txt — 위 전체를 마크다운 한 장으로

SKILL.md 원문: /skill/SKILL.md