# 04. Coding Rules

## 공통 코딩 규칙

- TypeScript 타입을 명시하고 `any`를 피한다.
- 명확한 이름 사용:
  - 핸들러: `handle*`
  - 훅: `use*`
  - UI 컴포넌트: 역할이 드러나는 `*Widget`, `*Panel`, `*Card`
- 중복 스타일 문자열은 공용 컴포넌트/유틸로 흡수한다.

## React/Next 규칙

- 클라이언트 컴포넌트는 필요한 곳에만 `'use client'` 선언
- page는 조합 전용, 세부 구현은 widgets/features로 이동
- URL 파라미터/검색 파라미터 파싱은 widget/model 레이어에서 처리

## Tailwind 규칙

- 하드코딩 hex 남발 금지
- 클래스 길이가 길어지는 경우 의미 단위로 줄바꿈
- hover/focus 상태는 기본 접근성 스타일과 함께 제공

## 더미 기능 정책

- 미구현 기능 트리거는 토스트로 피드백한다.
- 토스트 제목에 `(더미)` 또는 설명으로 mock 상태를 명확히 전달한다.
- 실데이터처럼 오해될 수 있는 숫자/실시간 문구 사용을 지양한다.

## 검증 절차

- 타입체크: `npx tsc --noEmit`
- 빌드: `npm run build`
- lint는 플러그인 누락 이슈가 있을 수 있으니 환경 상태를 먼저 확인한다.