007Vstro2023.09 – 2023.10보관

k2gbs 다국어 홈페이지

처음 해 본 국제화, 그리고 끝내지 못한 프로젝트

기간: 2023.09 – 2023.10
분류: 웹사이트
역할: 기획·디자인·개발 단독
구성: 단독 진행

01개요

워드프레스로 만들어진 기업 사이트를 Next.js로 리뉴얼하면서 다국어를 지원해야 했습니다. 국제화 작업은 처음이었고, 참고할 사내 선례도 없었습니다.

공식 문서와 해외 영상 자료를 보며 next-intl을 단기간에 익혀 적용했습니다. 라우트에 로케일을 넣고, 메시지 파일을 분리하고, 서버 컴포넌트에서 번역을 읽는 구조까지 세웠습니다.

다만 개발 도중 다른 프로젝트에 투입되면서 배포까지 마치지 못했습니다. 이후 회사의 경영 사정으로 퇴사하게 되어 끝내 마무리하지 못한 작업이 됐습니다. 결과물로 자랑할 수 있는 프로젝트는 아니지만, 국제화의 구조를 처음부터 세워 본 경험은 이후 작업에 계속 남았습니다.

02기술 결정

문제가 무엇이었고, 무엇을 골랐고, 그래서 어떻게 됐는지.

결정 01
번역 키는 화면이 아니라 도메인 기준으로 나눈다
문제
처음에는 페이지별로 메시지 파일을 나눴는데, 같은 문구가 여러 페이지에 등장하면서 번역이 갈라졌습니다. 한쪽만 고치면 다른 쪽이 그대로 남습니다.
선택
공통 용어를 도메인 단위 네임스페이스로 묶고, 페이지 전용 문구만 페이지 파일에 남겼습니다.
결과
같은 개념은 항상 같은 단어로 번역됩니다. 번역 담당자에게 넘길 파일 구조도 더 설명하기 쉬워졌습니다.
결정 02
로케일을 URL 경로에 둔다
문제
언어를 쿠키나 클라이언트 상태로만 관리하면 특정 언어 페이지를 링크로 공유할 수 없고, 검색 엔진도 언어별 페이지를 따로 색인하지 못합니다.
선택
`/[locale]/...` 형태로 로케일을 경로 세그먼트에 두고 hreflang을 함께 선언했습니다.
결과
언어별 URL이 생겨 공유와 색인이 가능해졌습니다. 언어 전환은 경로 치환만으로 처리됩니다.