jun-claude-code 0.0.1

package/.claude/skills/Git/git.md

@@ -0,0 +1,323 @@
+---
+name: git
+description: Git 작업 가이드. Commit 메시지 작성법, PR 작성법, 브랜치 전략, 안전 규칙.
+keywords: [커밋, PR, 브랜치, push, merge, FEAT, FIX, REFACTOR, CHORE, DOCS, GitHub, 풀리퀘스트]
+estimated_tokens: ~600
+---
+
+# Git 작업 가이드
+
+## Commit 메시지
+
+### 형식
+
+```
+<PREFIX>: <간결한 요약 (한글)>
+
+<본문 (선택)>
+
+Co-Authored-By: Claude <noreply@anthropic.com>
+```
+
+### PREFIX
+
+| PREFIX | 용도 | 예시 |
+|--------|------|------|
+| FEAT | 새로운 기능 | `FEAT: 결제 완료 후 주문 저장 구현` |
+| FIX | 버그 수정 | `FIX: 로그인 세션 만료 오류 수정` |
+| REFACTOR | 리팩토링 | `REFACTOR: Order Entity 패턴 적용` |
+| CHORE | 빌드/설정 | `CHORE: ESLint 설정 업데이트` |
+| DOCS | 문서 | `DOCS: README 설치 가이드 추가` |
+| STYLE | 포맷팅 | `STYLE: ESLint 경고 수정` |
+| TEST | 테스트 | `TEST: 주문 생성 단위 테스트 추가` |
+
+### 작성 원칙
+
+- **한글 사용**, 50자 이내
+- **현재형**: "추가함" → "추가"
+- **Why 중심**: 무엇보다 왜 변경했는지
+
+### Commit 단위
+
+- 한 커밋 = 한 가지 목적
+- 각 커밋 후 빌드 에러 없음
+- 되돌리기 용이한 단위
+
+---
+
+## 브랜치 전략
+
+```
+feature/{기능명}     # 새 기능
+fix/{버그명}         # 버그 수정
+refactor/{대상}      # 리팩토링
+chore/{작업명}       # 설정/빌드
+```
+
+---
+
+## PR (Pull Request) 생성
+
+### Step 1: 변경사항 분석
+
+```bash
+git status                    # 변경된 파일
+git diff main...HEAD          # main 대비 전체 변경
+git log main..HEAD --oneline  # 커밋 히스토리
+```
+
+### Step 2: 영향 범위 분석
+
+**필수: PR 작성 전 다른 코드에 미치는 영향 분석**
+
+| 변경 유형 | 확인 사항 |
+|----------|----------|
+| API Output 변경 | 프론트엔드 호출 코드 |
+| API Input 변경 | mutation/query 사용처 |
+| 공유 타입 변경 | 타입 패키지 사용처 |
+| Entity 컬럼 변경 | Repository, Service, Migration |
+| 컴포넌트 Props 변경 | import하는 모든 파일 |
+| 유틸 함수 시그니처 변경 | 함수 호출처 |
+| 환경 변수 추가 | `.env.example`, 배포 설정 |
+
+```bash
+# 변경된 export 사용처 검색
+grep -r "import.*변경된함수명" --include="*.ts" --include="*.tsx"
+```
+
+### Step 3: 영향 판단
+
+**필수: 변경사항이 시스템에 미치는 영향 분석**
+
+#### Code Flow 분석
+
+```
+변경된 함수/컴포넌트 → 호출하는 곳 → 그 호출자의 호출자 → ...
+```
+
+- 변경된 코드를 호출하는 모든 경로 추적
+- 데이터 흐름 변경 시 downstream 영향 확인
+- 에러 전파 경로 확인
+
+#### User Flow 분석
+
+| 질문 | 확인 |
+|------|------|
+| 어떤 페이지/기능에 영향? | 영향받는 화면 목록 |
+| 사용자 동선 변경? | 기존 UX 유지 여부 |
+| 에러 시 사용자 경험? | 에러 메시지, 폴백 처리 |
+
+#### Breaking Change 판단
+
+```markdown
+## Breaking Change 여부: 없음 / 있음
+
+### 있다면:
+- **무엇이**: 변경된 인터페이스/동작
+- **어디에 영향**: 영향받는 코드 목록
+- **마이그레이션**: 필요한 수정 작업
+```
+
+### Step 4: PR 본문 작성
+
+```markdown
+## Summary
+
+- **핵심 변경 1**: 설명
+- **핵심 변경 2**: 설명
+
+## 주요 변경사항
+
+### Backend API (해당시)
+**엔드포인트명:**
+```typescript
+// Input
+{ field: type }
+// Output
+{ field: type }
+```
+
+### Frontend (해당시)
+**컴포넌트/페이지:**
+- 주요 기능 1
+- 주요 기능 2
+
+## 변경된 파일
+- `path/to/file1.ts` - 변경 내용
+- `path/to/file2.tsx` - 변경 내용
+
+## 영향 범위
+
+### Breaking Changes (해당시)
+- 변경된 API/타입과 영향받는 코드
+
+### 사이드이펙트 검토
+- 영향받는 기능 없음 / 또는 영향 목록
+
+## 테스트 (해당시)
+- [ ] 단위 테스트
+- [ ] 통합 테스트
+- [ ] 수동 테스트
+
+Generated with [Claude Code](https://claude.com/claude-code)
+```
+
+### Step 5: PR 생성
+
+```bash
+git push -u origin feature/branch-name
+
+gh pr create --base main --title "TYPE: 제목" --body "$(cat <<'EOF'
+## Summary
+...
+EOF
+)"
+```
+
+---
+
+## Git 명령어 주의사항
+
+### 금지
+
+| 명령어 | 이유 |
+|--------|------|
+| `git add -A`, `git add .` | 민감 파일 포함 위험 |
+| `git push --force` | 히스토리 손상 |
+| `git reset --hard` | 작업 손실 위험 |
+| `--no-verify` | hook 우회 금지 |
+
+### 권장
+
+```bash
+# 파일 지정하여 add
+git add path/to/file1.ts path/to/file2.ts
+
+# HEREDOC으로 커밋
+git commit -m "$(cat <<'EOF'
+FEAT: 기능 설명
+
+상세 내용
+
+Co-Authored-By: Claude <noreply@anthropic.com>
+EOF
+)"
+```
+
+---
+
+## PR 생성 전 체크리스트
+
+- [ ] `lint` 통과
+- [ ] `build` 성공
+- [ ] 커밋 메시지 규칙 준수
+- [ ] Summary가 변경 내용을 명확히 설명
+- [ ] 영향 범위 분석 완료
+- [ ] Breaking change 명시 (해당시)
+
+---
+
+## PR 생성 후 워크플로우
+
+### Step 6: Self PR Review
+
+PR 생성 직후 본인이 먼저 리뷰합니다.
+
+```bash
+# PR diff 확인
+gh pr diff <PR번호>
+
+# PR 상세 확인
+gh pr view <PR번호>
+```
+
+**Self Review 체크리스트:**
+
+| 항목 | 확인 |
+|------|------|
+| 불필요한 코드/주석 제거 | ☐ |
+| 디버그 코드 제거 (console.log 등) | ☐ |
+| 하드코딩된 값 없음 | ☐ |
+| 타입 안전성 확인 | ☐ |
+| 에러 핸들링 적절함 | ☐ |
+| 네이밍 컨벤션 준수 | ☐ |
+
+> 상세 체크리스트: `.claude/skills/Git/pr-review.md`
+
+**Self Review 이슈 발견 시:**
+
+```bash
+# 수정 후 추가 커밋
+git add <수정파일>
+git commit -m "$(cat <<'EOF'
+FIX: Self review 피드백 반영
+
+- 수정 내용 1
+- 수정 내용 2
+
+Co-Authored-By: Claude <noreply@anthropic.com>
+EOF
+)"
+git push
+```
+
+### Step 7: PR Apply Mode (리뷰 피드백 적용)
+
+팀원 리뷰 후 피드백이 있으면 pr-apply 모드로 진입합니다.
+
+```bash
+# 리뷰 코멘트 확인
+gh pr view <PR번호> --comments
+
+# 피드백 분류
+# Critical - 반드시 수정
+# Suggestion - 검토 후 결정
+# Question - 답변 필요
+```
+
+**피드백 반영:**
+
+```bash
+# 코드 수정 후 커밋
+git add <수정파일>
+git commit -m "$(cat <<'EOF'
+FIX: PR 리뷰 피드백 반영
+
+- [Critical] 피드백1 반영
+- [Suggestion] 피드백2 반영
+
+Co-Authored-By: Claude <noreply@anthropic.com>
+EOF
+)"
+git push
+
+# 리뷰어에게 알림
+gh pr comment <PR번호> --body "리뷰 피드백 반영 완료. 재확인 부탁드립니다."
+```
+
+> 상세 가이드: `.claude/skills/Git/pr-apply.md`
+
+---
+
+## 전체 PR 워크플로우 요약
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│  1. 변경사항 분석 → 2. 영향 범위 분석 → 3. 영향 판단       │
+│                          ↓                                   │
+│  4. PR 본문 작성 → 5. PR 생성 (gh pr create)                │
+│                          ↓                                   │
+│  6. Self PR Review → 이슈 발견 시 수정 → push               │
+│                          ↓                                   │
+│  7. 팀원 리뷰 대기 → 피드백 있으면 PR Apply Mode            │
+│                          ↓                                   │
+│  8. Approve → Merge                                          │
+└─────────────────────────────────────────────────────────────┘
+```
+
+### 관련 Skill 참조
+
+| 단계 | Skill |
+|------|-------|
+| PR Review | `.claude/skills/Git/pr-review.md` |
+| PR Apply | `.claude/skills/Git/pr-apply.md` |

package/.claude/skills/Git/pr-apply.md

@@ -0,0 +1,87 @@
+---
+name: pr-apply
+description: PR 리뷰 피드백 적용 스킬. 리뷰 코멘트 확인, 코드 수정, 커밋 생성.
+keywords: [PR피드백, 리뷰적용, 코드수정, 코멘트, 변경요청, 재커밋]
+estimated_tokens: ~250
+user-invocable: true
+---
+
+# PR Apply Skill
+
+PR 리뷰 피드백을 코드에 반영하는 가이드.
+
+## Apply Workflow
+
+### Step 1: 리뷰 피드백 확인
+
+```bash
+# PR 코멘트 조회
+gh pr view <PR번호> --comments
+
+# PR diff 확인
+gh pr diff <PR번호>
+```
+
+### Step 2: 피드백 분류
+
+| 분류 | 대응 |
+|------|------|
+| Critical | 반드시 수정 |
+| Suggestion | 검토 후 적용 여부 결정 |
+| Question | 답변 코멘트 작성 |
+
+### Step 3: 코드 수정
+
+```bash
+# 현재 브랜치에서 수정
+git checkout feature/branch-name
+
+# 수정 후 커밋 (리뷰 반영임을 명시)
+git commit -m "$(cat <<'EOF'
+FIX: PR 리뷰 피드백 반영
+
+- 피드백 1 반영 내용
+- 피드백 2 반영 내용
+
+Co-Authored-By: Claude <noreply@anthropic.com>
+EOF
+)"
+```
+
+### Step 4: PR 업데이트
+
+```bash
+# 변경사항 push
+git push origin feature/branch-name
+
+# 리뷰어에게 수정 완료 알림 (선택)
+gh pr comment <PR번호> --body "리뷰 피드백 반영 완료했습니다. 재확인 부탁드립니다."
+```
+
+## 피드백 대응 원칙
+
+### 수용할 때
+
+- 코드 수정 후 커밋
+- 복잡한 변경은 별도 커밋으로 분리
+- 수정 완료 후 리뷰어에게 알림
+
+### 반대 의견이 있을 때
+
+- PR 코멘트로 이유 설명
+- 대안 제시
+- 합의 후 진행
+
+### 질문에 답변할 때
+
+- 해당 코멘트에 직접 답변
+- 필요시 코드에 주석 추가
+
+## 체크리스트
+
+- [ ] 모든 Critical 피드백 반영
+- [ ] Suggestion 검토 및 결정
+- [ ] Question 답변 완료
+- [ ] `lint` 통과
+- [ ] `build` 성공
+- [ ] 리뷰어에게 재확인 요청

package/.claude/skills/Git/pr-review.md

@@ -0,0 +1,69 @@
+---
+name: pr-review
+description: PR 코드 리뷰 스킬. 체크리스트 기반 구조적 리뷰 수행.
+keywords: [PR리뷰, 코드리뷰, MR, 머지리퀘스트, 체크리스트, Critical, Warning, Approved]
+estimated_tokens: ~300
+user-invocable: true
+---
+
+# PR Review Skill
+
+체크리스트 기반 Pull Request 리뷰.
+
+## Review Workflow
+
+### Step 1: Review Plan 작성
+
+```markdown
+## PR Review Plan
+
+- [ ] **PR 범위 파악**
+  - 목적:
+  - 예상 동작 변경:
+
+- [ ] **파일별 리뷰**
+  - [ ] `file1.ts` - 설명
+  - [ ] `file2.tsx` - 설명
+
+- [ ] **구현 품질**
+  - [ ] 로직 정확성
+  - [ ] 에러 처리
+  - [ ] 엣지 케이스
+  - [ ] 타입 안전성
+
+- [ ] **Best Practices**
+  - [ ] 유지보수성
+  - [ ] 성능
+  - [ ] 보안
+
+- [ ] **통합**
+  - [ ] Breaking changes
+  - [ ] API 계약
+```
+
+### Step 2: 리뷰 실행
+
+- 완료 항목 `[x]` 체크
+- 이슈에 인라인 코멘트
+- 심각도별 분류
+
+### Step 3: 결과 요약
+
+```markdown
+## Summary: Approved / Changes Requested / Blocked
+
+### Critical (필수 수정)
+### Suggestions (권장)
+### Questions (질문)
+### Highlights (좋은 점)
+```
+
+## PR 타입별 Focus
+
+| Type | Focus Areas |
+|------|-------------|
+| Feature | 로직, 테스트, 문서 |
+| Bugfix | 근본 원인, 회귀 방지 |
+| Refactor | 동작 보존, 성능 |
+| Config | 보안, 환경 호환성 |
+| Dependency | Breaking changes, 보안 취약점 |

package/.claude/skills/React/SKILL.md

@@ -0,0 +1,159 @@
+---
+name: React
+description: React 컴포넌트 작성 시 사용. 파일/폴더 구조, useState/useEffect 규칙, props 설계, 렌더링 최적화 기법 제공.
+keywords: [React, 컴포넌트, useState, useEffect, 훅, props, 상태관리, 렌더링, 최적화]
+estimated_tokens: ~600
+---
+
+# React 개발 스킬
+
+## 핵심 역할
+
+- React 컴포넌트 설계 및 구현 가이드
+- 상태 관리 패턴 적용
+- 성능 최적화 기법 적용
+
+## 컴포넌트 설계 원칙
+
+### 파일/폴더 구조
+
+```
+src/
+├── components/          # 재사용 가능한 공통 컴포넌트
+│   └── Button/
+│       ├── Button.tsx
+│       ├── Button.styles.ts
+│       └── index.ts
+├── features/            # 기능별 모듈
+│   └── auth/
+│       ├── components/
+│       ├── hooks/
+│       └── utils/
+├── hooks/               # 공통 커스텀 훅
+├── utils/               # 유틸리티 함수
+└── types/               # 공통 타입 정의
+```
+
+### 컴포넌트 분류
+
+| 유형 | 설명 | 예시 |
+|------|------|------|
+| Presentational | UI만 담당, props로 데이터 수신 | Button, Card, Input |
+| Container | 로직/상태 관리, 데이터 fetch | UserListContainer |
+| Layout | 페이지 레이아웃 구조 | Header, Sidebar, Footer |
+| Page | 라우트에 매핑되는 페이지 | HomePage, LoginPage |
+
+## 필수 준수 사항
+
+### 컴포넌트 작성
+
+| 규칙 | 올바른 예 | 잘못된 예 |
+|------|----------|----------|
+| 함수형 컴포넌트 사용 | `function Button() {}` | `class Button extends React.Component` |
+| Props 타입 명시 | `interface ButtonProps { ... }` | `props: any` |
+| 단일 책임 원칙 | 하나의 역할만 담당 | 여러 기능 혼합 |
+| 적절한 컴포넌트 분리 | 100줄 이하 권장 | 500줄 이상의 거대 컴포넌트 |
+
+### 상태 관리
+
+| 규칙 | 설명 |
+|------|------|
+| 상태 최소화 | 파생 가능한 값은 상태로 두지 않음 |
+| 상태 위치 | 필요한 가장 가까운 공통 조상에 배치 |
+| 불변성 유지 | 상태 직접 수정 금지, 새 객체/배열 생성 |
+| 복잡한 상태 | useReducer 또는 상태 관리 라이브러리 사용 |
+
+### Hooks 규칙
+
+| 규칙 | 설명 |
+|------|------|
+| 최상위에서만 호출 | 조건문, 반복문 내부에서 호출 금지 |
+| 의존성 배열 정확히 | useEffect, useMemo, useCallback의 deps 누락 금지 |
+| 커스텀 훅 추출 | 재사용 가능한 로직은 커스텀 훅으로 분리 |
+| 훅 네이밍 | `use` 접두사 필수 (예: `useAuth`, `useFetch`) |
+
+## 성능 최적화
+
+### 메모이제이션
+
+```typescript
+// 컴포넌트 메모이제이션
+const MemoizedComponent = React.memo(Component);
+
+// 값 메모이제이션
+const expensiveValue = useMemo(() => computeExpensive(a, b), [a, b]);
+
+// 함수 메모이제이션
+const handleClick = useCallback(() => doSomething(id), [id]);
+```
+
+### 최적화 적용 기준
+
+| 상황 | 적용 |
+|------|------|
+| 리스트 렌더링 | `key` prop 필수, 안정적인 ID 사용 |
+| 자주 리렌더링되는 컴포넌트 | `React.memo` 적용 검토 |
+| 비용이 큰 계산 | `useMemo` 사용 |
+| 자식에게 전달하는 콜백 | `useCallback` 사용 |
+
+### 불필요한 최적화 금지
+
+- 모든 컴포넌트에 무조건 memo 적용 금지
+- 측정 없이 최적화하지 않음 (React DevTools Profiler 사용)
+
+## useEffect 패턴
+
+### 올바른 사용
+
+```typescript
+// 데이터 fetch
+useEffect(() => {
+  const controller = new AbortController();
+  fetchData(controller.signal);
+  return () => controller.abort();
+}, [dependency]);
+
+// 이벤트 구독
+useEffect(() => {
+  window.addEventListener('resize', handleResize);
+  return () => window.removeEventListener('resize', handleResize);
+}, []);
+```
+
+### 피해야 할 패턴
+
+| 안티패턴 | 대안 |
+|----------|------|
+| props를 state로 복사 | props 직접 사용 |
+| 렌더링 중 상태 업데이트 | 조건부 렌더링 또는 useMemo |
+| 불필요한 Effect | 이벤트 핸들러로 처리 |
+
+## 체크리스트
+
+### 컴포넌트 작성 시
+- [ ] Props 타입이 명시되어 있는가?
+- [ ] 컴포넌트가 단일 책임을 가지는가?
+- [ ] 적절한 크기로 분리되어 있는가?
+
+### 상태 관리
+- [ ] 상태가 최소화되어 있는가?
+- [ ] 상태 위치가 적절한가?
+- [ ] 불변성이 유지되는가?
+
+### Hooks
+- [ ] 의존성 배열이 정확한가?
+- [ ] cleanup 함수가 필요한 경우 작성되었는가?
+- [ ] 커스텀 훅으로 분리할 로직이 있는가?
+
+### 성능
+- [ ] 리스트에 적절한 key가 사용되었는가?
+- [ ] 불필요한 리렌더링이 없는가?
+- [ ] 메모이제이션이 적절히 사용되었는가?
+
+## 관련 문서
+
+| 문서 | 설명 |
+|------|------|
+| `tanstack-router.md` | TanStack Router 파일 기반 라우팅 패턴 |
+| `react-hook-form.md` | React Hook Form + Zod 폼 검증 패턴 |
+| `tailwind-styled.md` | tailwind-styled-components DOM depth 최소화 |