이름 붙이기: camelCase vs snake_case vs kebab-case vs PascalCase

필 칼튼의 유명한 농담에 따르면 컴퓨터 과학에는 두 가지 어려운 일이 있습니다. 캐시 무효화와 사물 이름을 지정하는 것입니다. 좋은 단어를 선택하는 것은 충분히 어렵고, 그 다음에는 어떻게 함께 할 것인지 결정해야 합니다. userId, user_id, UserId, user-id 그리고 USER_ID 모두 같은 개념을 설명합니다. 그리고 각각은 어딘가에서 옳습니다. 이 가이드는 주요 협약, 각각의 기대되는 곳, 그리고 어색한 경우를 처리하는 방법을 설명합니다.

주요 협약

이름	예제	전형적인 사용
카멜 케이스	getUserById	자바스크립트/타이프스크립트 변수와 함수, 자바 메소드, JSON 필드
파스칼 케이스	UserProfile	클래스, 타입, 리액트 컴포넌트, C# 메소드
snake_case	get_user_by_id	파이썬, 루비, 러스트 함수, SQL 열
SCREAMING_SNAKE_CASE	MAX_RETRIES	변수, 환경 변수
케밥 케이스	user-profile	URL, CSS 클래스, HTML 속성, 파일 이름, CLI 플래그
열차 케이스	Content-Type	HTTP 헤더
dot.case	app.server.port	구성 키, 자바 패키지

[case converter] ((/tools/case-converter) 는 이 모든 계층 사이의 모든 이름을 한 번에 번역할 수 있습니다. 이는 계층 간 데이터를 이동할 때 유용합니다.

언어 및 맥락에 따른 협약

자바스크립트 및 타입스크립트

• 변수, 함수 및 객체 속성: camelCase.
• 클래스, 인터페이스, 타입 별명, 명함 및 React 컴포넌트: PascalCase. React에서는 구성 요소가 대문자로 시작되므로 JSX가 HTML 요소와 구별할 수 있습니다.
• 진정한 상수 (변화되지 않는 구성): SCREAMING_SNAKE_CASE, 많은 코드베이스가 const 변수에 camelCase를 사용합니다.
• 파일 이름: 구성 파일의 경우 종종 kebab-case (user-profile.tsx) 또는 PascalCase입니다. 하나를 선택하세요. 파일 이름에서 혼합된 대문자는 대문자 민감하지 않은 파일 시스템에서 문제를 일으킵니다.

파이썬

PEP 8은 명시적입니다: 함수, 변수 및 모듈에 대한 snake_case, 클래스에 대한 PascalCase (PEP 8가 CapWords라고 부르는) 및 모듈 수준의 상수에 대한 SCREAMING_SNAKE_CASE. 앞부분의 밑줄은 "내부"를 나타냅니다. _cache입니다.

가자

Go는 camelCase과 PascalCase를 사용하며, case는 의미가 있습니다. 대문자로 시작하는 식별자는 패키지에서 수출되며, 소문자는 개인입니다. GO 스타일은 약자 userID, HTTPServer, parseURL를 대문자로 사용합니다.

자바와 C#

둘 다 PascalCase을 클래스, camelCase를 로컬 변수로 사용합니다. 자바는 메소드용으로 camelCase를 사용하며 C#는 메소드 및 퍼블릭 프로퍼티용으로 PascalCase를 사용한다.

함수, 변수 및 모듈에 대한 snake_case; 유형 및 특성에 대한 PascalCase; 상수 및 정적에 대한 SCREAMING_SNAKE_CASE 컴파일러가 오차를 경고합니다.

SQL 데이터베이스

snake_case은 테이블과 열에 대한 안전한 선택입니다. PostgreSQL에서, 인용되지 않은 식별자는 소문자로 접어집니다. 그래서 "userId"로 생성된 열은 영원히 인용되어야하지만, user_id는 모든 곳에서 작동합니다. 테이블 이름이 단수 (user) 또는 복수 (users) 인지는 팀 선호에 달려 있습니다. 선택보다 일관성이 중요합니다.

CSS 및 HTML

CSS 속성은 kebab-case (background-color) 이다. 그래서 클래스 이름은 보통 .card-header이다. BEM 같은 방법론은 구조를 추가합니다: .card__title--active. data-* 속성을 포함한 HTML 속성은 대소문자에 민감하지 않으며 일반적으로 케밥 대소문자로 나타납니다. 자바스크립트는 data-user-id를 element.dataset.userId로 노출합니다.

URL

경로에 소문자 kebab-case를 사용하세요: /blog/compress-image-to-100kb. 구글은 하이핀을 단어 분리자로 취급하지만 하이라인을 조너로 취급합니다. 그래서 하이핀은 SEO에 더 좋습니다. URL에서 대문자를 피하십시오. 많은 서버는 경로를 대문자 민감한 것으로 취급하여 중복된 콘텐츠 문제를 만듭니다.

환경 변수

SCREAMING_SNAKE_CASE: DATABASE_URL, STRIPE_SECRET_KEY. 셸과 컨테이너 플랫폼은 이것을 기대하고 있으며, 일부는 변수 이름에서 하이프인을 전혀 허용하지 않습니다.

약자 및 초기자

팀들이 가장 많은 논쟁을 하는 곳이죠. parseHTTPResponse 또는 parseHttpResponse가 되어야 할까요? userID 또는 userId?

• ** 단호를 단어로 취급하십시오** (parseHttpResponse, userId, XmlParser): 마이크로소프트의 .NET 가이드라인에서 두 글자 이상의 단호, 구글의 자바와 자바스크립트 스타일 가이드 및 많은 타입스크립트 코드베이스에 의해 권장됩니다. HTTPSURLConnection와 같은 읽히지 않는 실행을 피하고 케이스 사이를 깔끔하게 변환합니다. parseHttpResponse는 자동으로 parse_http_response가 됩니다.
• 어큐멘터리를 대문자로 유지하십시오 (parseHTTPResponse, userID): Go에서 표준이며 오래된 Java 및 Objective-C 코드에서 일반적입니다.

자동 변환기는 parseHTTPResponse를 분석 / HTTP / 응답으로 나누고 작동하지만 HTTPSURLConnection는 모호합니다. 만약 당신이 그 스타일을 통제한다면, 약칭을 단어로 취급하는 것이 더 견고합니다.

이름의 숫자

숫자를 붙여서 붙여두세요: version2, utf8Decoder, base64_encode, h1-title 숫자로 시작하는 식별자를 피하십시오. 대부분의 언어는 그것을 금지하고, 숫자로 시작하는 CSS 클래스는 탈출을 요구합니다.

국경을 넘어서기: API와 데이터베이스

실제 시스템에서는 컨벤션이 섞여 있습니다. snake_case을 가진 파이썬 백엔드는 camelCase를 기대하는 자바스크립트 프론트엔드에 snake_case 열을 가진 SQL 데이터베이스에 의해 지원됩니다. 옵션:

1. ** 와이어에서 하나의 컨벤션을 사용하십시오.** JSON이 camelCase (공개 API의 가장 일반적인 선택, 자바스크립트와 일치) 또는 snake_case (파이썬과 루비 생태계에서 일반적이며 스트라이프 및 GitHub과 같은 API에서 사용됩니다) 를 사용하는지 결정하십시오. 그것을 문서화하고 모든 곳에 적용하십시오.
2. 변경에서 변환합니다. 시리즈화 라이브러리는 자동으로 변환할 수 있습니다: Pydantic의 위명 생성기, 잭슨의 PropertyNamingStrategies, 또는 ORM 열 매핑. 각 계층 안에, 코드는 어휘적으로 남아 있습니다.
3. ** 한 용량 안에 섞지 마세요. ** { "userId": 1, "created_at": "..." }은 두 세계 중 최악의 것입니다.

JSON에서 TypeScript 타입을 생성할 때 [우리 JSON에서 TypeScript 가이드] ((/blog/json-to-typescript-interfaces) 에 포함된 속성 이름을 와이어에 표시된 그대로 유지하고 필요한 경우 매핑 레이어로 변환합니다.

좋은 말 을 선택하는 것

케이스 스타일은 쉬운 부분입니다. 단어 자체에 대한 몇 가지 규칙:

• *특정하게 말해주세요. * data, info 그리고 item는 아무 것도 말하지 않습니다. invoiceLines는 많은 것을 말해줍니다.
• ** 함수와 값에 대 한 동사를 사용 합니다.** calculateTotal() total를 반환 합니다.
• ** boolean을 질문으로 지정하세요.** isActive, hasAccess, shouldRetry.
• ** 유닛을 포함합니다.** timeoutMs, maxSizeBytes, durationSeconds는 모든 종류의 버그를 방지합니다.
• **약칭은 보편적 (id, url, html) 이 아니라면 피하십시오. usrCnt는 네 개의 캐릭터를 절약하고 모든 독자에게 한 순간을 낭비합니다.
• ** 도메인 언어와 일치합니다. * * 만약 회사가 "구독"이라고 한다면, 코드를 plan로 부르지 마세요.

협약의 집행

컨벤션들을 적어 놓고 도구를 사용하도록 하십시오. ESLint의 @typescript-eslint/naming-convention 규칙, Python의 Pylint와 Ruff, golint와 go vet, Rust의 내장 린트, CSS 클래스 패턴의 스타일 린트. 자동 검사는 코드 검토에서 논쟁을 끝내고 큰 코드베이스의 일관성을 유지합니다.

요약

자바스크립트 값에 camelCase, 타입과 컴포넌트에 PascalCase, 파이썬, 러스트 및 SQL에 snake_case, URL, CSS 및 파일 이름에 kebab-case, 그리고 상수 및 환경 변수에 SCREAMING_SNAKE_CASE를 사용합니다. 가능한 경우 약자를 단어로 취급하고, 단위를 이름에 넣고, 각 API에 대한 하나의 컨벤션을 선택하고, 린터들이 규칙을 적용하도록 하여, 인간이 좋은 단어를 선택하는 데 집중할 수 있도록 합니다.