# Project Setup

## ⚠️ REMINDER: 한국어로 응답하세요!

All responses must be in Korean. Check `critical.md` for details.

## Project Overview

**@wishket/eslint-config-wishket** - Wishket의 공유 가능한 ESLint 설정 패키지

이 패키지는 Wishket의 JavaScript/TypeScript 코드 스타일을 강제하는 ESLint 설정을 제공합니다. npm에 퍼블리시되어 여러 Wishket 프로젝트에서 사용됩니다.

## Tech Stack

### Core

- **Package Manager**: Yarn 4.0.2 (Yarn Berry with PnP)
- **ESLint**: >=8.0.0 (peer dependency)
- **TypeScript**: >=5.0.0 (peer dependency)
- **Prettier**: 3.6.2

### Key Dependencies

- **@typescript-eslint**: TypeScript ESLint 규칙
- **eslint-plugin-react**: React 관련 린팅
- **eslint-plugin-jest**: Jest 테스트 린팅
- **eslint-plugin-testing-library**: React Testing Library 린팅
- **eslint-plugin-unused-imports**: 미사용 import 감지
- **eslint-plugin-naming-convention**: 네이밍 컨벤션 강제
- **eslint-plugin-file-export-name**: 파일명-export 일치 검증

### Version Management

- **Changesets**: 버전 관리 및 변경 로그 자동화
  - `@changesets/cli`: 2.29.7
  - `@changesets/changelog-github`: 0.5.1

## Project Structure

```
eslint-config-wishket/
├── index.js              # 메인 ESLint 설정 (단일 파일)
├── package.json          # 패키지 정보 및 의존성
├── .changeset/          # Changesets 버전 관리
├── CLAUDE.md            # Claude Code 가이드
├── README.md            # 사용법 문서
├── CHANGELOG.md         # 변경 로그
└── .claude/             # Claude Code 규칙
    └── rules/
        ├── critical.md          # 필수 규칙
        ├── core.md              # 핵심 개발 원칙
        ├── project.md           # 이 파일
        └── augmented-coding.md  # TDD 및 코딩 원칙
```

## Development Rules

### 1. Code Writing Rules

#### ESLint 설정 수정 시 핵심 원칙

- **주석은 한국어로**: 규칙 설명은 모두 한국어로 작성
- **참조 번호 유지**: 각 규칙의 `#숫자` 참조 번호 유지 (예: `#2`, `#3`)
- **중복 방지**: 같은 규칙이 여러 번 정의되지 않도록 주의
  - 현재 `sort-keys`, `no-mixed-operators`, `lines-between-class-members` 등이 중복 정의됨
- **호환성 검증**: React 19/Next.js 15 환경과 호환되는지 확인

#### File Structure

**단일 파일 구조**: 모든 ESLint 설정이 `index.js` 하나에 집중
- plugins 섹션
- extends 섹션
- rules 섹션 (카테고리별 정리)
  - 기본 코드 스타일
  - 공백 및 포맷팅
  - 네이밍 컨벤션
  - import 규칙
  - React 관련
  - 제한된 구문

### 2. Wishket JavaScript Code Style 핵심 규칙

이 설정이 강제하는 주요 코드 스타일:

#### 함수 정의
- **화살표 함수만 사용**: function 선언문/표현식 금지
- **함수 표현식 스타일**: `const foo = () => {}`

#### 반복문
- **전통적인 반복문 금지**: for, for-of, for-in 사용 불가
- **배열 메서드 사용**: `.map()`, `.filter()`, `.reduce()`, `.forEach()`

#### 코드 스타일
- **세미콜론 필수**: 모든 문장 끝에 세미콜론
- **80자 라인 제한**: 주석/문자열/URL 등은 예외
- **2칸 들여쓰기**: Prettier 설정
- **var 금지**: const/let만 사용
- **const 우선**: const 선언이 let 선언보다 먼저

#### 네이밍 컨벤션
- **변수/함수**: camelCase
- **타입/클래스/인터페이스**: PascalCase
- **private 멤버**: `_` prefix 필수
- **상수**: UPPER_CASE 또는 camelCase
- **미사용 파라미터**: leading underscore 허용

#### 파일명 규칙
- **React 컴포넌트**: PascalCase (.jsx/.tsx)
- **파일명 = default export**: 컴포넌트 파일명과 export가 일치해야 함
- **Next.js 예외**: page.tsx, layout.tsx, route.tsx 등은 예외

### 3. Script Commands

```bash
# 패키지 관리
yarn install        # 의존성 설치 (PnP 모드)

# 버전 관리
yarn changeset      # 변경사항 기록 (버전 bump 전)
yarn changeset version  # package.json 버전 업데이트
```

### 4. Publishing Workflow

#### 변경사항 퍼블리시 절차

1. **변경사항 구현**: index.js 수정
2. **Changeset 생성**: `yarn changeset`
   - 변경 타입 선택 (major/minor/patch)
   - 변경사항 설명 입력
3. **버전 업데이트**: Changesets CLI가 자동으로 처리
4. **npm 퍼블리시**: `@wishket` scope로 퍼블리시
   - `"access": "public"` 설정 필수

#### Changeset 예제

```bash
$ yarn changeset
? What kind of change is this for @wishket/eslint-config-wishket?
  ○ patch   # 버그 수정
  ○ minor   # 새 규칙 추가
  ● major   # Breaking change

? Please enter a summary for this change:
  "arrow 함수만 사용하도록 강제하는 규칙 추가"
```

### 5. Package Compatibility

#### Peer Dependencies

이 패키지를 사용하는 프로젝트는 다음을 설치해야 함:
- `eslint` >= 8.0.0
- `typescript` >= 5.0.0

#### React 19 / Next.js 15 호환성

최신 버전은 Next.js 15 / React 19 환경에서 테스트됨:
- `eslint-plugin-react`: 7.37.5+
- `@typescript-eslint/*`: 8.46.2+

새 플러그인 추가 시 호환성 확인 필수

## Important Guidelines

### 1. Never Do ❌

- **규칙 참조 번호 제거**: `#2`, `#3` 같은 주석 번호 유지 필수
- **중복 규칙 추가**: 이미 정의된 규칙 재정의 금지
- **호환성 무시**: React 19/Next.js 15와 호환되지 않는 플러그인 사용 금지
- **한글 주석 제거**: 규칙 설명은 한국어로 유지
- **breaking change 무단 배포**: major 버전 변경 필요한 수정 시 논의 필요

### 2. Must Do ✅

- **규칙 변경 시 주석 업데이트**: 규칙 의도를 명확히 설명
- **중복 규칙 제거**: 현재 존재하는 중복 정의 정리
- **일관성 유지**: 기존 코드 스타일 및 주석 스타일 준수
- **Changeset 작성**: 모든 변경사항은 changeset으로 기록
- **호환성 테스트**: 실제 프로젝트에서 테스트 후 배포

### 3. Code Quality Checklist

ESLint 설정 수정 시:

- [ ] **주석 업데이트**: 변경한 규칙의 한국어 주석 수정
- [ ] **참조 번호 유지**: `#숫자` 형식 유지
- [ ] **중복 검사**: 같은 규칙이 여러 곳에 정의되지 않았는지 확인
- [ ] **호환성 검증**: React 19/Next.js 15 프로젝트에서 테스트
- [ ] **Changeset 생성**: 변경사항 기록
- [ ] **예제 코드 테스트**: 규칙이 의도한 대로 작동하는지 검증

### 4. Common Tasks

#### 새 ESLint 규칙 추가

```javascript
// 1. 적절한 섹션에 추가 (카테고리별 정리)
// 2. 한국어 주석으로 설명 추가
// 3. 참조 번호가 있다면 유지

// #42: 새로운 규칙 설명
'new-rule-name': ['error', { option: 'value' }],
```

#### 플러그인 추가

```javascript
// 1. package.json에 의존성 추가
// 2. plugins 배열에 추가
// 3. extends에 권장 설정 추가 (있다면)
// 4. 개별 규칙 설정 추가

plugins: [
  // ... 기존 플러그인
  'new-plugin',
],

extends: [
  // ... 기존 설정
  'plugin:new-plugin/recommended',
],

rules: {
  'new-plugin/rule-name': 'error',
}
```

## Development Workflow

이 프로젝트의 개발 워크플로우는 **augmented-coding.md**를 참고하세요:

- TDD 원칙 적용 (규칙 검증)
- Tidy First 접근법 (구조적 vs 동작적 변경 분리)
- 커밋 규율 준수

## Project Context

### 패키지 목적

- **일관성**: 모든 Wishket 프로젝트에서 동일한 코드 스타일 강제
- **자동화**: 수동 코드 리뷰 부담 감소
- **품질**: 검증된 베스트 프랙티스 강제

### 주요 사용처

- Wishket 내부 프로젝트
- Next.js/React 기반 웹 애플리케이션
- TypeScript 프로젝트

### Technical Features

- **Yarn PnP**: node_modules 없는 의존성 관리
- **단일 파일 구조**: 간단한 유지보수
- **확장 가능**: 프로젝트별 추가 규칙 설정 가능
- **호환성**: 최신 React/Next.js 버전 지원

---

이 가이드는 Claude Code가 프로젝트를 효과적으로 이해하고 일관된 코드를 생성하도록 돕습니다.