fe-agent-new/rules/coding-conventions.md

코딩 컨벤션

기본 원칙

• 가독성 우선: 영리한 코드보다 읽기 쉬운 코드를 선호합니다.
• 일관성 유지: 기존 코드의 스타일을 먼저 관찰하고 그에 맞춥니다.
• 작은 단위: 함수와 파일은 한 가지 책임만 지도록 작게 유지합니다.

포맷팅

• 들여쓰기: 스페이스 2칸 (탭 사용 금지)
• 문자열: 싱글 쿼터(') 사용, JSX/템플릿 속성값은 더블 쿼터(")
• 세미콜론: 생략하지 않고 항상 작성
• 줄 끝 공백 제거, 파일 끝 개행 1줄 유지
• 한 줄 최대 100자 (초과 시 줄바꿈)
• Prettier 설정 파일(.prettierrc)이 있는 경우 해당 설정을 우선합니다.

네이밍

• 변수/함수: camelCase (예: userProfile, fetchUserData)
• 상수: UPPER_SNAKE_CASE (예: MAX_RETRY_COUNT)
• 컴포넌트/클래스/타입: PascalCase (예: UserCard, OrderStatus)
• 파일명
  • Vue 컴포넌트: PascalCase.vue (예: UserCard.vue)
  • Composable: use 접두사 + camelCase (예: useAuth.ts)
  • 일반 TS 모듈: kebab-case.ts (예: format-date.ts)
• 이벤트 핸들러: handle 또는 on 접두사 (예: handleClick, onSubmit)
• 불리언: is, has, can, should 접두사 (예: isLoading, hasError)

타입

• any 사용 금지. 불가피할 경우 주석으로 이유를 남기고 unknown을 먼저 고려합니다.
• 함수 시그니처에는 매개변수와 반환 타입을 명시합니다.
• 공개 API(타 모듈에서 import 되는 것)는 반드시 타입을 export 합니다.
• 유니온 타입은 as const 또는 별도 타입 alias로 관리합니다.

주석

• "무엇을" 보다 "왜"를 설명합니다.
• TODO/FIXME 주석에는 작성자와 날짜 또는 이슈 번호를 포함합니다.
• 공개 함수/컴포넌트에는 JSDoc 한 줄 설명을 권장합니다.

import 순서

1. 외부 라이브러리 (예: vue, nuxt)
2. 내부 절대 경로 (예: ~/components/...)
3. 상대 경로 (예: ./utils)
4. 타입 only import는 각 그룹 내에서 별도 블록으로 분리

그룹 사이에는 빈 줄을 한 줄 둡니다.