## πŸ“Œ Brief Summary Naming Conventions(λͺ…λͺ… κ·œμΉ™)은 μ½”λ“œμ˜ 가독성, μœ μ§€λ³΄μˆ˜μ„±, 그리고 ν˜‘μ—… νš¨μœ¨μ„±μ„ 높이기 μœ„ν•΄ 파일, μ»΄ν¬λ„ŒνŠΈ, λ³€μˆ˜ λ“±μ˜ 이름을 μ§“λŠ” ν•©μ˜λœ ν‘œμ€€μ΄λ‹€. λͺ…ν™•ν•œ κ·œμΉ™μ„ 톡해 μ½”λ“œμ˜ 역할을 μ§κ΄€μ μœΌλ‘œ νŒŒμ•…ν•˜κ²Œ ν•˜λ©°, 특히 운영체제 κ°„μ˜ λŒ€μ†Œλ¬Έμž ꡬ뢄 차이둜 μΈν•œ λΉŒλ“œ 였λ₯˜λ₯Ό λ°©μ§€ν•˜λŠ” μ‹€μ§ˆμ μΈ μ—”μ§€λ‹ˆμ–΄λ§ λͺ©μ μ„ κ°–λŠ”λ‹€. ## πŸ“– Core Content 1. **파일 및 폴더 (kebab-case)** - λŒ€μ†Œλ¬Έμž ꡬ뢄이 μ—†λŠ” OS(Windows, macOS)와 μ—„κ²©ν•œ OS(Linux) κ°„μ˜ CI/CD λΉŒλ“œ μΆ©λŒμ„ 막기 μœ„ν•΄ μ†Œλ¬Έμžμ™€ ν•˜μ΄ν”ˆμ„ μ‚¬μš©ν•˜λŠ” `kebab-case`λ₯Ό ꢌμž₯ν•œλ‹€. - Next.js의 μ˜ˆμ•½μ–΄(`page.js`, `layout.js`)λ‚˜ 라우트 κ·Έλ£Ή(`(folder)`) λ“±μ˜ κ·œμΉ™μ„ μ€€μˆ˜ν•œλ‹€. 2. **React μ»΄ν¬λ„ŒνŠΈ 및 νƒ€μž… (PascalCase)** - μ»΄ν¬λ„ŒνŠΈλͺ…κ³Ό TypeScript의 Type/Interface, Enum 등은 첫 κΈ€μžλ₯Ό λŒ€λ¬Έμžλ‘œ ν•˜λŠ” `PascalCase`λ₯Ό μ‚¬μš©ν•˜μ—¬ 일반 λ³€μˆ˜μ™€ κ΅¬λ³„ν•œλ‹€. 3. **λ³€μˆ˜, ν•¨μˆ˜, ν”„λ‘œνΌν‹° (camelCase)** - JavaScript ν‘œμ€€μ— 따라 첫 λ‹¨μ–΄λŠ” μ†Œλ¬Έμžλ‘œ μ‹œμž‘ν•˜λŠ” `camelCase`λ₯Ό μ‚¬μš©ν•œλ‹€. - Boolean 값은 `is`, `has`, `should` 접두사λ₯Ό, 이벀트 ν•Έλ“€λŸ¬λŠ” `handle`, `on` 접두사λ₯Ό λΆ™μ—¬ 의미λ₯Ό λͺ…ν™•νžˆ ν•œλ‹€. 4. **μ»€μŠ€ν…€ ν›… (use 접두사)** - React의 Rules of Hooksλ₯Ό μ€€μˆ˜ν•˜κΈ° μœ„ν•΄ λ°˜λ“œμ‹œ `use` μ ‘λ‘μ‚¬λ‘œ μ‹œμž‘ν•˜λŠ” `camelCase`λ₯Ό μ‚¬μš©ν•œλ‹€. 5. **μƒμˆ˜ (UPPER_SNAKE_CASE)** - λ³€κ²½λ˜μ§€ μ•ŠλŠ” κ³ μ • 값은 λŒ€λ¬Έμžμ™€ 밑쀄을 μ‚¬μš©ν•˜λŠ” `UPPER_SNAKE_CASE`둜 μž‘μ„±ν•˜μ—¬ 식별λ ₯을 높인닀. 6. **Git 및 μ›Œν¬ν”Œλ‘œμš°** - 브랜치λͺ…: `{type}/{ticket-id}-{description}` ν˜•μ‹μ˜ μ†Œλ¬Έμž kebab-case μ‚¬μš©. - 컀밋 λ©”μ‹œμ§€: Conventional Commits(`feat:`, `fix:` λ“±) ν˜•μ‹μ„ μ€€μˆ˜ν•˜μ—¬ 좔적성을 ν™•λ³΄ν•œλ‹€. ## βš–οΈ Trade-offs & Caveats - **엄격함 vs μœ μ—°μ„±**: λ„ˆλ¬΄ λ³΅μž‘ν•œ 넀이밍 κ·œμΉ™μ€ 개발자의 인지 λΆ€ν•˜λ₯Ό 늘리고 생산성을 μ €ν•˜μ‹œν‚¬ 수 μžˆμœΌλ―€λ‘œ, νŒ€ 규λͺ¨μ— λ§žλŠ” μ μ ˆν•œ μˆ˜μ€€μ˜ ν•©μ˜κ°€ ν•„μš”ν•˜λ‹€. - **μžλ™ν™” λ„κ΅¬μ˜ ν•œκ³„**: ESLint λ“±μœΌλ‘œ λ§Žμ€ 넀이밍 κ·œμΉ™μ„ κ°•μ œν•  수 μžˆμœΌλ‚˜, '의미둠적(Semantic) μ μ ˆμ„±'κΉŒμ§€λŠ” 도ꡬ가 νŒλ‹¨ν•  수 μ—†μœΌλ―€λ‘œ μ—¬μ „νžˆ μ½”λ“œ 리뷰가 μ€‘μš”ν•˜λ‹€. - **ν”„λ ˆμž„μ›Œν¬ μ œμ•½**: μ‚¬μš© 쀑인 ν”„λ ˆμž„μ›Œν¬(예: Next.js)의 μ˜ˆμ•½μ–΄ κ·œμΉ™μ΄ νŒ€μ˜ μ»¨λ²€μ…˜κ³Ό μΆ©λŒν•  경우, ν”„λ ˆμž„μ›Œν¬μ˜ κ·œμΉ™μ„ μš°μ„ μ‹œν•΄μ•Ό μ‹œμŠ€ν…œ 였λ₯˜λ₯Ό λ°©μ§€ν•  수 μžˆλ‹€. ## πŸ”— Knowledge Connections ### Related Concepts (Auto-Linked) * [[Abstract_Syntax_Tree]] * [[Branching Strategies]] * [[ESLint]] * [[Feature-Sliced_Design]] * [[JavaScript]] * [[Next.js]] * [[Prettier]] * [[React]] * [[Research]] ### Related Concepts - **kebab-case**: 파일 μ‹œμŠ€ν…œ ν˜Έν™˜μ„±μ„ μœ„ν•œ μ†Œλ¬Έμž-ν•˜μ΄ν”ˆ μ‘°ν•© (관계: 물리적 μ €μž₯ ν‘œμ€€) - **Conventional Commits**: λ³€κ²½ 이λ ₯ 가독성을 μœ„ν•œ ν‘œμ€€ (관계: ν˜‘μ—… μ›Œν¬ν”Œλ‘œμš° κ·œμΉ™) - **PascalCase**: μ»΄ν¬λ„ŒνŠΈ 및 νƒ€μž… 식별을 μœ„ν•œ λŒ€λ¬Έμž μ‹œμž‘ μ‘°ν•© (관계: 논리적 식별 ν‘œμ€€) ### Deeper Research Questions 1. OS별 λŒ€μ†Œλ¬Έμž 인식 차이가 μ‹€μ œ ν”„λ‘œλ•μ…˜ λΉŒλ“œ ν™˜κ²½μ—μ„œ μœ λ°œν•˜λŠ” 'Silent failure' 사둀와 κ·Έ 디버깅 방법은? 2. 넀이밍 κ·œμΉ™ μ€€μˆ˜κ°€ TypeScript의 νƒ€μž… μΆ”λ‘  μ„±λŠ₯μ΄λ‚˜ 트리 쉐이킹(Tree Shaking) νš¨μœ¨μ— 간접적인 영ν–₯을 λ―ΈμΉ˜λŠ”κ°€? 3. λŒ€κ·œλͺ¨ λ¦¬νŒ©ν† λ§ μ‹œ, 기쑴의 넀이밍 μ»¨λ²€μ…˜μ„ 일괄 λ³€κ²½ν•˜κΈ° μœ„ν•œ AST(Abstract Syntax Tree) 기반 μžλ™ν™” 도ꡬ ν™œμš© λ°©μ•ˆμ€? 4. `isVisible` vs `showComponent`와 같이 μƒνƒœ 쀑심 넀이밍과 λͺ…λ Ή 쀑심 넀이밍 쀑 μ–΄λ–€ 것이 μœ μ§€λ³΄μˆ˜μ— 더 μœ λ¦¬ν•œκ°€? 5. λ‹€κ΅­μ–΄ 지원(i18n) ν”„λ‘œμ νŠΈμ—μ„œ ν‚€κ°’(Key) 넀이밍을 도메인 μ€‘μ‹¬μœΌλ‘œ μ§“λŠ” 것과 νŽ˜μ΄μ§€ μ€‘μ‹¬μœΌλ‘œ μ§“λŠ” κ²ƒμ˜ νŠΈλ ˆμ΄λ“œμ˜€ν”„λŠ”? ### Practical Application Contexts - **ν˜‘μ—… ν™˜κ²½ ꡬ좕**: ESLint 및 Prettier 섀정을 톡해 νŒ€μ› 전체가 λ™μΌν•œ 넀이밍 μΌ€μ΄μŠ€λ₯Ό μ‚¬μš©ν•˜λ„λ‘ μžλ™ κ°•μ œ. - **이슈 좔적**: 브랜치λͺ…에 ν‹°μΌ“ IDλ₯Ό ν¬ν•¨ν•˜μ—¬ Jira/GitHub Issues와 μ½”λ“œλ₯Ό 유기적으둜 μ—°κ²°. ### Adjacent Topics - **Clean Code & Meaningful Names** - **Feature-Sliced Design (FSD)** - **Git Branching Strategies**