입력 텍스트

camelCase

PascalCase

snake_case

kebab-case

UPPER

lower

텍스트 케이스 변환 작업

API 필드명, 환경 변수, 파일명, 문서 제목을 camelCase, snake_case, kebab-case, PascalCase 등으로 빠르게 맞춥니다.

코드 스타일 맞추기

프론트엔드와 백엔드가 서로 다른 네이밍 규칙을 쓸 때 필드명을 빠르게 변환해 매핑 실수를 줄입니다.

URL과 파일명 정리

문장형 제목을 slug나 kebab-case로 바꿔 문서 경로, 이미지 파일명, 앵커 링크에 활용합니다.

일괄 변환 전 점검

변환 결과를 바로 확인해 약어, 숫자, 공백이 의도한 방식으로 나뉘었는지 확인합니다.

자주 만나는 오류

약어가 이상하게 쪼개질 때

HTTP, ID, URL 같은 연속 대문자는 경계를 판단하기 어렵습니다. getHTTPResponse가 get_h_t_t_p_response로 갈라지는 도구도 있습니다. 변환 후 약어 부분은 눈으로 확인하세요.

숫자 경계 처리

user2Name 같은 입력에서 숫자 앞뒤를 단어 경계로 볼지가 도구마다 다릅니다. DB 컬럼명처럼 되돌릴 수 없는 곳에 쓰기 전에 결과를 확인하세요.

확인할 점

약어 처리

URL, ID, API 같은 약어는 팀 규칙에 따라 url, Url, URL로 다르게 표기될 수 있습니다. 자동 변환 후 컨벤션을 맞추세요.

의미 있는 공백

여러 단어를 합치는 과정에서 원래 의미가 달라질 수 있으므로 공개 URL이나 API 필드명은 최종 확인이 필요합니다.

약어에서 규칙이 갈립니다

HTTPServer를 camelCase로 바꿀 때 httpServer와 hTTPServer 중 무엇이 맞는지 언어와 린터마다 다릅니다. API, ID, URL 같은 약어가 든 이름은 자동 변환 결과를 그대로 쓰지 말고 한 번 확인하세요.

숫자 경계 처리가 다릅니다

user2FA를 snake_case로 바꾸면 user_2_fa, user2_fa, user_2fa가 모두 나올 수 있습니다. 데이터베이스 컬럼명처럼 한 번 정하면 바꾸기 어려운 곳에는 숫자가 든 이름을 피하는 편이 안전합니다.

kebab-case는 코드에서 못 쓰는 곳이 많습니다

하이픈은 대부분의 언어에서 뺄셈 연산자라 변수명에 쓸 수 없습니다. kebab-case는 CSS 클래스, URL 경로, 파일명처럼 식별자가 아닌 자리에서만 씁니다. 자바스크립트 객체 키로 쓰려면 따옴표와 대괄호 접근이 필요합니다.

사용 순서

변환할 텍스트나 식별자 목록을 입력합니다.

원하는 출력 케이스를 선택하고 변환 결과를 확인합니다.

API 약어, 숫자, 하이픈, 밑줄이 포함된 값은 결과를 수동으로 한 번 더 검토합니다.

코드에 붙여 넣기 전 기존 네이밍 규칙과 충돌하지 않는지 확인합니다.

실제 입력과 결과

한 입력에서 모든 표기로

입력

user profile image

결과

camelCase   userProfileImage
PascalCase  UserProfileImage
snake_case  user_profile_image
kebab-case  user-profile-image
CONSTANT    USER_PROFILE_IMAGE

기존 코드 식별자 변환

입력

getHTTPResponseCode

결과

snake_case  get_http_response_code
kebab-case  get-http-response-code

연속된 대문자 약어는 구현마다 끊는 위치가 달라 결과가 갈리는 대표적인 입력입니다.

함께 쓰면 좋은 도구