React 컴포넌트 개발시 Pascal Case에 따라 파일명을 짓습니다. 그런데 머리글자(acronym)으로 이루어진 단어 같은 경우 약간 고민이됩니다.

예를 들어 ATM 이라는 컴포넌트를 만든다고 해봅시다. Pascal Case를 무조건 따른다면 Atm.tsx가 됩니다. 그런데 뭔가 느낌이 안납니다. ATM.tsx라고 하자니 Pascal Case라는 규칙이 마음 한 구석을 찌릅니다.

Atm.tsx vs. ATM.tsx

사실 정답은 없습니다. 그냥 파일 이름 하나일 뿐입니다. 이런거 고민할 시간에 코드 짜는게 더 이득입니다.

그래도 다른 개발자들도 이런 고민을 했던 것 같습니다. Microsoft Naming Guildelines에 Abbreviations에 대한 내용이 있습니다.

여기서 acronym에 해당하는 내용을 가져오면 다음과 같습니다.

1. 잘 알려진 단어라면 그냥 써라

Where appropriate, use well-known acronyms to replace lengthy phrase names. For example, use UI for User Interface and OLAP for On-line Analytical Processing.

2. 두 글자까지는 대문자로 쓰고 세 글자부터는 Pascal case나 Camel case를 사용해라

When using acronyms, use Pascal case or camel case for acronyms more than two characters long. For example, use HtmlButton or htmlButton. However, you should capitalize acronyms that consist of only two characters, such as System.IO instead of System.Io.

stackoverflow에도 관련 질문이 있습니다.

뭐가 좋을까요?

저는 acronym은 다 대문자로 적어라라는 생각이었습니다. 그런데, HTMLButton이라는 예시를 보니 또 아닌거 같습니다. HtmlButton이 더 자연스러워 보입니다. 저는 microsoft 규칙에서 세 글자까지 대문자로 적는 것이 마음에 듭니다.

현업에서는 여유가 있다면 의논하여 정하는 것이 좋아보입니다.