Nextjs14 app router 기반 다국어 번역 적용하기(1)


• 회사에서 사이트의 영문 번역 버전이 필요해져서 Next.js의 app router를 이용한 국제화를 구현하기로 결정했다. 이는 서버사이드 랜더링의 효율성과 URL path에 로케일 정보를 담아 직관적인 라우팅을 가능하게 하기 위함이다.
• Next.js의 app routing 기반 국제화는 Sub-path Routing을 사용하며, 이는 URL의 path에 언어 코드를 정의하는 방식이다. 이를 구현하기 위해 middleware 설정 등 공식 문서의 지침을 따랐다.
• Next.js의 `middleware.ts` 파일을 사용하여 서버 요청을 가로채고, 로케일 설정 및 세션 기반 권한 관리를 수행하는 미들웨어를 설정하는 방법을 설명하고 있다.
• 미들웨어는 정적 자원 요청을 그대로 처리하고, 로케일이 없는 주소를 유저 선호 로케일로 리다이렉트하며, 세션에 따른 권한을 확인하여 필요한 경우 리다이렉트하는 기능을 포함한다.

북마크
공유하기
신고하기