Skip to content
Merged
Show file tree
Hide file tree
Changes from 8 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 50 additions & 0 deletions .claude/commands/code-review.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
Review the current branch changes against develop: $ARGUMENTS

## Rules

- **All review output must be written in Korean**

## Instructions

1. Run `git diff develop...HEAD` to get the full diff
2. Read the changed files directly to understand context
3. Review against the criteria below
4. Output findings organized by category

## Review Criteria

### 필수 확인
- **버그 가능성**: null/undefined 처리, 비동기 에러 처리, 엣지 케이스
- **보안**: XSS, 오픈 리다이렉트, 민감 정보 노출, 인증/인가 누락
- **타입 안전성**: `any` 사용, 잘못된 타입 단언

### 코드 품질
- **FSD 규칙 준수**: 레이어 의존성 방향 `app` → `views` → `widgets` → `entities` → `shared`, 역방향 참조 금지
- **불필요한 복잡도**: 과도한 추상화, 사용되지 않는 코드
- **중복**: 반복되는 로직

### 테스트
- 새 로직에 테스트가 있는지
- 테스트가 구현 세부사항이 아닌 동작을 검증하는지

## Output Format

```
## 코드 리뷰

### 🚨 필수 수정
- [파일명:라인] 문제점 및 제안

### 💡 권장 개선
- [파일명:라인] 문제점 및 제안

### 🔍 확인 사항 (선택)
- [파일명:라인] 의견

### ✅ 잘된 점
- ...
```

- 이슈가 없으면 해당 섹션 생략
- 문제가 전혀 없으면 "이슈 없음" 명시
- 각 항목에 파일 경로와 라인 번호 포함
54 changes: 54 additions & 0 deletions .claude/commands/commit.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
Analyze staged changes and create a commit: $ARGUMENTS

## Commit Convention

```
<type>: <subject>
```

| Type | Usage |
|------|-------|
| `feat` | Add new feature |
| `fix` | Bug fix |
| `test` | Add or modify tests |
| `chore` | Build config, dependencies |
| `refactor` | Code improvement without behavior change |
| `style` | Formatting, whitespace — no logic change |
| `docs` | Documentation |
| `design` | UI design change |
| `comment` | Update comments |
| `init` | Project initialization |
| `rename` | Rename or move files / folders |
| `remove` | Delete files or folders |
| `perf` | Performance improvement |

- Subject must be written in Korean
- No period at end of subject line

## Commit Granularity Rules

- Keep commits as small as possible — one commit = one unit of change
- Always split into separate commits when change areas differ:
- Feature code / test code / config files → separate commits
- Different domains (e.g. `user` + `team` files) → separate commits
- If grouping is unavoidable, only bundle files of the same nature

## Instructions

0. **Run `git rev-parse --abbrev-ref HEAD` first. If the current branch is `main` or `develop`, STOP immediately and tell the user to switch to a feature branch. Never commit or push on these branches.**

1. Run `git diff --staged` and `git status` to understand what changed
2. Determine the appropriate type based on the nature of the change
3. Write a concise subject focused on "what and why"
4. If files span different areas, propose splitting into multiple commits
5. Confirm with the user before executing the commit

## Examples

```
feat: 로그인 폼 유효성 검사 추가
fix: 토큰 만료 시 무한 리다이렉트 수정
test: handleSigninFormSubmit 단위 테스트 추가
chore: vitest coverage 설정 변경
refactor: setLocationSearch 헬퍼 함수로 추출
```
48 changes: 48 additions & 0 deletions .claude/commands/create-branch.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
Create a new branch from develop and switch to it: $ARGUMENTS

## Branch Naming Convention

```
<type>/<name>
```

| Type | Usage |
|------|-------|
| `feat/<name>` | New feature |
| `fix/<name>` | Bug fix |
| `test/<name>` | Test code |
| `chore/<name>` | Config, dependencies |
| `refactor/<name>` | Code improvement |
| `design/<name>` | UI design change |
| `docs/<name>` | Documentation |

- `<name>`: lowercase + kebab-case (e.g. `feat/signin-validation`)
- Keep it short and descriptive

## Instructions

1. Check the current branch:
```bash
git rev-parse --abbrev-ref HEAD
```

2. Fetch the latest `develop`:
```bash
git fetch origin develop
```

3. Create and switch to the new branch from `develop`:
```bash
git checkout -b <type>/<name> origin/develop
```

4. Confirm the branch was created and is now active.

## Examples

```
/create-branch feat/signup-form
/create-branch fix/token-refresh
/create-branch test/auth-unit-tests
/create-branch chore/vitest-config
```
62 changes: 62 additions & 0 deletions .claude/commands/create-component.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
Create a component based on the given name and options: $ARGUMENTS

## Rules

- Determine the correct FSD layer based on usage scope:
- Used across multiple features → `src/shared/ui/`
- Used within a single feature → `src/widgets/<feature>/` or `src/entities/<domain>/ui/`
- Use `interface` for Props definition
- Default export only
- Use Tailwind CSS for styling — no inline styles
- Use `cn()` from `@/shared/utils/cn` for conditional className merging
- Always accept `className?: string` prop for external style overrides
- Server Component by default — add `"use client"` only when needed (event handlers, hooks, browser APIs)

## Component Template

```tsx
// src/shared/ui/ComponentName.tsx
interface ComponentNameProps {
// required props first
// optional props last with ?
className?: string
}

export default function ComponentName({ className }: ComponentNameProps) {
return (
<div className={cn("", className)}>
Comment thread
g-hyxn marked this conversation as resolved.
Outdated
{/* content */}
</div>
)
}
```

## Client Component Template (when needed)

```tsx
"use client"

import { useState } from "react"
import { cn } from "@/shared/utils/cn"

interface ComponentNameProps {
className?: string
}

export default function ComponentName({ className }: ComponentNameProps) {
const [state, setState] = useState(...)

return (
<div className={cn("", className)}>
{/* content */}
</div>
)
}
```

## Steps

1. Identify the correct layer and folder for this component
2. Create the component file with the template above
3. If placed in `shared/ui/`, export it from `src/shared/ui/index.ts`
4. Confirm file path and export with the user
119 changes: 119 additions & 0 deletions .claude/commands/create-page.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,119 @@
Create an App Router page for the given route: $ARGUMENTS

## Rules

- Pages are Server Components by default — do not add `"use client"` unless necessary
- Always include `generateMetadata` for SEO
- Always create `loading.tsx` and `error.tsx` alongside `page.tsx`
- If the page fetches data, use TanStack Query with server-side prefetch + hydration pattern
- API functions go in `src/views/<page>/api/`
- Query hooks go in `src/views/<page>/model/`
- Page UI composition goes in `src/views/<page>/ui/` or directly in the view

## File Structure to Create

```
src/
├── app/<route>/
│ ├── page.tsx # Server Component entry
│ ├── loading.tsx # Suspense fallback
│ └── error.tsx # Error boundary
└── views/<route>/
├── api/
│ └── get<Page>.ts
└── model/
└── useGet<Page>.ts
```

## page.tsx Template

```tsx
// src/app/<route>/page.tsx
import { Metadata } from "next"

export const metadata: Metadata = {
title: "페이지 제목 | 光탈페",
description: "페이지 설명",
}

export default async function <Page>Page() {
return (
<main>
{/* view component */}
</main>
)
}
```

## page.tsx Template (with data fetching)

```tsx
// src/app/<route>/page.tsx
import { Metadata } from "next"
import { dehydrate, HydrationBoundary, QueryClient } from "@tanstack/react-query"
import { get<Page> } from "@/views/<route>/api/get<Page>"

export const metadata: Metadata = {
title: "페이지 제목 | 光탈페",
description: "페이지 설명",
}

export default async function <Page>Page() {
const queryClient = new QueryClient()
Comment thread
g-hyxn marked this conversation as resolved.
Outdated

await queryClient.prefetchQuery({
queryKey: ["<page>"],
queryFn: get<Page>,
})

return (
<HydrationBoundary state={dehydrate(queryClient)}>
<main>
{/* view component */}
</main>
</HydrationBoundary>
)
}
```

## loading.tsx Template

```tsx
export default function Loading() {
return (
<div className="flex min-h-screen items-center justify-center">
<span className="text-gray-400">로딩 중...</span>
</div>
)
}
```

## error.tsx Template

```tsx
"use client"

export default function Error({
error,
reset,
}: {
error: Error & { digest?: string }
reset: () => void
}) {
return (
<div className="flex min-h-screen flex-col items-center justify-center gap-4">
<p className="text-gray-600">{error.message || "오류가 발생했습니다."}</p>
<button onClick={reset} className="text-blue-500 underline">
다시 시도
</button>
</div>
)
}
```

## Steps

1. Confirm the route path and whether data fetching is needed
2. Create `app/<route>/page.tsx`, `loading.tsx`, `error.tsx`
3. If data fetching needed, also create `views/<route>/api/` and `views/<route>/model/`
4. List all created files with their paths
54 changes: 54 additions & 0 deletions .claude/commands/pr.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
Draft and create a pull request based on the current branch: $ARGUMENTS

## Rules

- **All PR content must be written in Korean** (title, summary, work details, review notes)
- **Base branch**: always `develop` (direct PR to `main` is forbidden)
- **Must follow the project PR template** defined in `.github/PULL_REQUEST_TEMPLATE.md`
- Merge only after CI passes

## Instructions

0. **Run `git rev-parse --abbrev-ref HEAD` first. If the current branch is `main` or `develop`, STOP and tell the user to switch to a feature branch before creating a PR.**

1. Run `git log develop..HEAD` to get the commit list
2. Run `git diff develop...HEAD` to understand all changes
3. Draft the PR title and body following the template below
4. Confirm with the user, then run `gh pr create`
Comment thread
g-hyxn marked this conversation as resolved.
Outdated

## PR Title Format

```
type: 한국어로 간결하게 (70자 이내)
```

## PR Body Template (must follow exactly)

```markdown
## 💡 PR 요약

> 해당 PR의 변경사항, 해당 이슈 등에 대한 간략한 설명을 작성해주세요.

- {변경사항을 bullet point로 작성}

## 📋 작업 내용

> 해당 PR에서 작업한 내용을 자세히 설명해주세요.

{구체적인 작업 내용 작성}

## 🤝 리뷰 시 참고사항

> 리뷰어분들이 리뷰를 할 때 참고하면 좋을 사항이나 질문사항을 작성해주세요.

{참고사항이 없으면 이 섹션 삭제}
```

## Title Examples

```
feat: 로그인 폼 유효성 검사 추가
fix: 토큰 만료 시 무한 리다이렉트 수정
test: auth 관련 단위 테스트 추가
chore: GitHub Actions CI 설정 추가
```
Loading
Loading