자바스크립트의 Intl API로 국제화하기

여러 가지 언어로 서비스를 할 수 있도록 웹 애플리케이션을 설계하고 구현하는 과정을 흔히 국제화(internalization, i18n)라고 합니다. 이를 위해서는 웹페이지 상에 사용된 문구들을 단순히 번역하여 표시해주는 것만 뿐만 아니라 동일한 데이터를 언어나 지역별로 다른 형식으로 보여줘야 하는데요.


예를 들어, 12/11/21로 표시된 날짜 데이터를 한국 사용자들은 2012년 11월 21일로 생각하지만, 미국 사용자들에게는 12월 11일 2021년으로 받아들여질 것이며, 어떤 다른 나라에서는 2021년 11월 12일로 읽힐 수도 있을 것입니다. 이렇게 언어나 지역별로 다른 형식으로 표시되야 하는 데이터를 일일이 다르게 처리하려면 상당한 노력이 필요할 텐데요. 이러한 처리를 대신해주는 외부 라이브러리를 사용할 수 있지만, 사용자가 브라우저를 통해 해당 자바스크립트 코드를 다운로드 받아야 한다는 부작용이 있죠.


다행히도 자바스크립트에는 이러한 데이터 포맷팅 문제를 해결해주기 위해서 Intl API라는 웹 표준 API가 있습니다. Intl API는 대부분의 모던 브라우저에서 지원되며 Node.js나 Bun과 같은 서버 런타임(runtime)에서도 사용이 가능하기 때문에 다국어 지원을 하는 서비스에서 백엔드나 프론트엔드 가리지 않고 유용하게 사용할 수 있습니다.


📺 동영상: https://youtu.be/wG1ih-IYXlc

📝 게시물: https://careerly.co.kr/comments/91498


  • Intl API 소개

  • Intl API 공통 사용법

  • Intl.DateTimeFormat

  • Intl.ListFormat

  • Intl.NumberFormat

  • Intl.RelativeTimeFormat

  • Intl.PluralRules


React로 국제화하는 방법에 대해서는 다음 게시물을 참고 바랍니다.

📕 https://careerly.co.kr/comments/92583

자바스크립트의 Intl API로 국제화하기

www.youtube.com

자바스크립트의 Intl API로 국제화하기

다음 내용이 궁금하다면?

또는

이미 회원이신가요?

2024년 4월 9일 오후 8:09

댓글 0