README

# Commands

현재 등록된 커스텀 커맨드 모음입니다.

## 📚 커맨드 목록

### 코드 정리

| 커맨드                                          | 설명                                          | 활성화 명령어         |
| ----------------------------------------------- | --------------------------------------------- | --------------------- |
| [cleanup-js](#cleanup-js)                       | 디버그 로그, 주석 코드, 미사용 import 제거     | `/cleanup-js`         |
| [cleanup-tw-cn](#cleanup-tw-cn)                 | Tailwind className 정리 (size-, mx-, my- 통일) | `/cleanup-tw-cn`      |
| [cleanup-css-global](#cleanup-css-global)       | globals.css 미사용 커스텀 클래스 정리          | `/cleanup-css-global` |
| [html-sturdy](#html-sturdy)                     | 비시맨틱 태그 → 시맨틱 HTML + aria-label 추가  | `/html-sturdy`        |
| [centralize-paths](#centralize-paths)           | API/이미지 경로를 중앙 상수로 관리             | `/centralize-paths`   |

### 코드 이해 & 리뷰

| 커맨드                            | 설명                                       | 활성화 명령어      |
| --------------------------------- | ------------------------------------------ | ------------------ |
| [explain](#explain)               | 코드 실행 흐름과 사용 예시 설명            | `/explain`         |
| [review](#review)                 | 잠재 버그/보안/성능 이슈 코드 리뷰         | `/review`          |
| [documentation](#documentation)   | TSDocs 형식의 포괄적 문서화 추가           | `/documentation`   |

### 기획 & 구현 워크플로우

| 커맨드                                      | 설명                                             | 활성화 명령어          |
| ------------------------------------------- | ------------------------------------------------ | ---------------------- |
| [call-brainstorming](#call-brainstorming)   | superpowers 브레인스토밍 → 계획서 작성 워크플로우  | `/call-brainstorming`  |
| [call-executing-plan](#call-executing-plan) | 계획서 기반 배치 단위 구현 실행                   | `/call-executing-plan` |
| [parellel-design](#parellel-design)         | 3개 병렬 에이전트로 UI 디자인 변형 생성           | `/parellel-design`     |

### Git & PR

| 커맨드                      | 설명                                                        | 활성화 명령어   |
| --------------------------- | ----------------------------------------------------------- | --------------- |
| [new-worktree](#new-worktree) | 새 git 워크트리 생성                                        | `/new-worktree`  |
| [pr](#pr)                   | PR 생성 (`[prefix] 커밋 메시지 \| base 브랜치`)              | `/pr`           |
| [prqa](#prqa)               | QA 이슈 수정 PR 생성 (`prefix \| 커밋 메시지 \| 티켓 번호`) | `/prqa`         |
| [sync-dev](#sync-dev)       | dev에서 pull, 충돌 블록 단위로 현재 변경사항 우선 적용       | `/sync-dev`     |

### 컨텍스트 & 자동화

| 커맨드                                              | 설명                                                          | 활성화 명령어              |
| --------------------------------------------------- | ------------------------------------------------------------- | -------------------------- |
| [absorb-previous-context](#absorb-previous-context) | Obsidian vault에서 이전 작업 맥락 흡수 및 재개                 | `/absorb-previous-context` |
| [call-agent-team](#call-agent-team)                 | 인터뷰 기반 에이전트 팀 구축                                  | `/call-agent-team`         |
| [call-ralph](#call-ralph)                           | ralph-loop 간편 실행 (`<프롬프트> m:<max> c:<완료조건>`)       | `/call-ralph`              |
| [call-verifiers](#call-verifiers)                   | plan/convention/security/a11y/performance verifier 병렬 실행   | `/call-verifiers`          |

---

## 🧹 cleanup-js

JS/TS 파일에서 불필요한 코드를 정리합니다.

### 정리 대상

- 디버그 로그 (`console.log` 등)
- 함수 내부 주석 (`//`)
- 주석 처리된 코드
- 사용하지 않는 import

### 사용 예시

/cleanup-js src/utils/*.ts

## 🧹 cleanup-tw-cn

Tailwind CSS className을 정리하고 최적화합니다.

### 정리 규칙

- `w-4 h-4` → `size-4`
- `ml-2 mr-2` → `mx-2`
- `mt-2 mb-2` → `my-2`
- 반복되는 스타일을 `@layer components`로 추출

### 사용 예시

/cleanup-tw-cn src/components/Card.tsx

## 🧹 cleanup-css-global

`globals.css`에서 사용하지 않는 커스텀 클래스를 정리합니다.

### 정리 대상

- `@theme {}` 내 미사용 변수
- `@layer {}` 내 미사용 클래스

### 사용 예시

/cleanup-css-global

## 🧹 html-sturdy

비시맨틱 태그를 시맨틱 HTML5 태그로 교체하고 aria 속성을 추가합니다.

### 작업 내용

- 시맨틱 태그 적용 (`<header>`, `<nav>`, `<main>`, `<section>` 등)
- aria 속성 추가 (`aria-label`, `role` 등)

### 사용 예시

/html-sturdy

## 🧹 centralize-paths

하드코딩된 API 경로와 이미지 경로를 중앙화된 상수로 관리합니다.

### 관리 파일

- `@lib/apiPaths.ts`: API 경로
  - `INTERNAL_PATHS`: 라우트 핸들러 경로
  - `EXTERNAL_PATHS`: 외부 API 엔드포인트
- `@lib/imagePaths.ts`: 이미지 경로
  - `IMAGE_PATHS`: 이미지 URL

### 사용 예시

/centralize-paths

---

## 🔍 explain

신규 개발자에게 설명하듯 코드의 실행 흐름과 사용 예시를 설명합니다.

### 사용 예시

/explain src/hooks/useAuth.ts

## 🔍 review

코드의 버그, 보안 문제, 성능 이슈를 리뷰합니다.

### 사용 예시

/review src/components/Button.tsx

## 🔍 documentation

코드에 TSDocs 형식의 문서화를 추가합니다.

### 문서화 항목

- `@description`: 인터페이스, 함수, 클래스에 대한 설명
- `@params`: 파라미터 설명
- `@types`: 타입 설명
- `@return`: 반환값 설명

### 사용 예시

/documentation src/utils/formatDate.ts

---

## 🚀 call-brainstorming

superpowers 브레인스토밍을 활용하여 새로운 도메인 모듈 확장/기능 구현의 계획서를 작성합니다.

### 사용 예시

/call-brainstorming

## 🚀 call-executing-plan

계획서를 기반으로 배치 단위 구현을 실행합니다.

### 사용 예시

/call-executing-plan

## 🚀 parellel-design

3개의 병렬 서브에이전트를 사용하여 하나의 UI를 다양한 변형으로 구현합니다. 사용자가 비교 후 선택할 수 있습니다.

### 주요 기능

- 레퍼런스 디자인 분석
- 3가지 UI 변형 동시 생성
- 사용자 피드백 기반 선택

### 사용 예시

/parellel-design "로그인 페이지 디자인"

---

## 🔀 new-worktree

새 git 워크트리를 생성합니다.

### 사용 예시

/new-worktree feature/login-page

## 🔀 pr

PR을 생성합니다.

### 입력 형식

`[prefix] 커밋 메시지 | base 브랜치 (기본값: dev)`

### 사용 예시

/pr [feat] 검색 필터 추가 /pr [fix] 버튼 스타일 수정 | main

## 🔀 prqa

QA 이슈 수정 PR을 생성합니다.

### 입력 형식

`prefix | 커밋 메시지 | 티켓 번호`

### 사용 예시

/prqa fix | 로그인 버튼 미작동 수정 | QADEV-123

## 🔀 sync-dev

dev 브랜치에서 pull 받되, 충돌 블록 단위로 현재 변경사항을 우선 적용합니다.

### 핵심 동작

- `git pull origin dev -X ours` 사용
- 충돌 없는 부분: dev 변경사항 정상 반영
- 충돌 블록: 현재 브랜치(ours) 우선 적용
- 파일 단위 덮어쓰기(`checkout --ours`)는 사용하지 않음

### 사용 예시

/sync-dev

---

## ⚙️ call-agent-team

인터뷰를 통해 작업 상황