스킬

스킬이란

supastack에는 Agent Skills가 포함되어 있습니다. 작업이 일치할 때 코딩 에이전트가 불러오는 짧고 작업 중심의 지침입니다. 프롬프트마다 킷의 규칙을 추측하게 하는 대신, 에이전트는 기능, 결제, 데이터베이스 변경, 테스트에 대해 같은 단계를 따릅니다. 스킬은 개방형 Agent Skills 형식을 따르므로 Claude Code, Cursor, Codex, GitHub Copilot, Gemini CLI 등 호환되는 에이전트에서 작동합니다.

스킬의 위치

스킬은 .agents/skills/에 있으며, 스킬마다 SKILL.md가 들어 있는 폴더가 하나씩 있습니다. Claude Code용으로 .claude/skills/에 동일한 복사본이 있습니다.

읽는 에이전트

Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode는 .agents/skills/를 읽고, Claude Code는 .claude/skills/를 읽습니다. 요청이 description과 일치하면 에이전트가 자동으로 스킬을 고르고, “use the database-schema-change skill”처럼 이름을 지정할 수도 있습니다.

포함되는 리포지토리

all-platforms 리포지토리에는 모든 스킬이 포함됩니다. web, mobile, desktop 리포지토리에는 각각에 적용되는 스킬이 포함되며, 엔드투엔드 테스트와 CI 스킬은 all-platforms 리포지토리에만 제공됩니다.

설정 및 환경

킷을 실행하고 배포하고 구성하는 스킬.

• 로컬 환경 설정 (local-environment-setup) — 로컬 환경을 처음 구성하거나 복구할 때: 첫 클론, 누락되거나 깨진 .env, Postgres, 마이그레이션, 포트.
• 배포와 환경 변수 (deploy-and-env-vars) — 배포하거나 호스팅 대상을 고르거나 환경 변수를 추가·변경할 때.
• 의존성 추가 (adding-a-dependency) — npm 의존성을 추가·업그레이드·이동·제거하거나 CI의 라이선스/감사 검사가 실패할 때.
• 업스트림에서 업그레이드 (upgrading-from-upstream) — supastack의 최신 릴리스를 그 위에 만든 제품에 가져올 때.

기능 만들기

각 플랫폼에 제품 화면을 추가하는 스킬.

• 웹 기능 추가 (add-a-web-feature) — 자체 데이터, 서버 액션, 내비게이션, 테스트가 있는 제품 페이지나 섹션에.
• API 엔드포인트 추가 (add-an-api-endpoint) — 공개 /api/v1 엔드포인트, OpenAPI 문서, API 키 스코프를 추가·변경할 때.
• UI 컴포넌트 추가 (add-a-ui-component) — 섹션, 블록, 폼 컨트롤, 재사용 컴포넌트를 킷의 스타일 규칙에 맞게 만들 때.
• 테마나 스타일 변경 (change-the-theme-or-style) — 제품의 모습을 바꿀 때: 디자인 스타일, 컬러 팩, 밀도, radius, 폰트, 레이아웃.
• 마케팅 페이지나 블로그 글 추가 (add-a-marketing-page-or-blog-post) — 공개 페이지, 가격 페이지, 법적 페이지, 블로그 글, 문서 가이드를 추가·수정할 때.
• 모바일 화면 추가 (add-a-mobile-screen) — Expo 모바일 앱의 화면을 추가·변경할 때.
• 데스크톱 기능 추가 (add-a-desktop-capability) — Tauri 데스크톱 앱을 변경할 때: 창, 트레이, 전역 단축키, 자동 업데이트.
• 알림 추가 (add-a-notification) — 인앱 알림, 푸시 알림, 다이제스트 항목을 추가할 때.

인증과 결제

로그인, 결제, 요금제 스킬.

• 인증 방법 추가 (add-an-auth-method) — 로그인을 바꿀 때: 소셜 프로바이더, 매직 링크, 이메일 코드, 패스키, 2단계 인증.
• 결제 프로바이더 추가 (add-a-payment-provider) — 결제 프로바이더를 활성화하거나 체크아웃, 고객 포털, 웹훅을 갖춘 새 결제 어댑터를 작성할 때.
• 요금제와 가격 변경 (change-plans-and-pricing) — 요금제를 추가·이름 변경·가격 조정할 때: 가격, 체험판, 좌석, 권한, 사용량 한도, 크레딧.

데이터와 연동

스키마, AI, 작업, 이메일, 스토리지, 번역 스킬.

• 데이터베이스 스키마 변경 (database-schema-change) — 테이블, 컬럼, 인덱스, 관계를 추가·변경하고 마이그레이션을 생성할 때.
• AI 기능 추가 (add-an-ai-feature) — 모델 호출, 채팅·에이전트 도구, 지속형 AI 태스크, 예산, BYOK에.
• 백그라운드 작업 추가 (add-a-background-job) — 요청 후, 타이머, 워크스페이스 단위로 실행되는 작업에.
• 이메일 추가·수정 (add-or-edit-an-email) — 트랜잭션 이메일을 추가·변경하거나 발송 프로바이더를 바꿀 때.
• 파일 스토리지 사용 (use-file-storage) — 아바타, 로고, 첨부파일 같은 업로드나 저장 파일에.
• 번역 추가 (add-translations) — 사용자에게 보이는 텍스트를 추가·변경·번역하거나 로케일을 추가할 때.

품질과 출시

테스트, 검증, 리뷰, CI 스킬.

• 유닛 테스트 작성 (writing-unit-tests) — Vitest 유닛·통합 테스트를 작성하거나 고칠 때.
• E2E 테스트 작성 (writing-e2e-tests) — Playwright E2E 테스트를 로컬이나 CI에서 추가·수정할 때.
• 변경 사항 검증 (verify-changes) — 인계, 커밋, PR 전에 올바른 검사를 골라 실행할 때.
• 실패한 CI 실행 디버깅 (debugging-a-failing-ci-run) — GitHub Actions 실행이 실패해 원인을 찾아 고쳐야 할 때.
• PR 리뷰 (reviewing-a-pr) — PR이나 diff를 정확성, 워크스페이스 격리, 규칙 관점에서 리뷰할 때.

직접 추가하기

frontmatter의 name과 일치하는 이름의 폴더를 만들고, 언제 쓰는지를 설명하는 name과 description을 작성합니다. .claude/skills/에도 복사해 모든 에이전트가 찾을 수 있게 합니다.