nextjs 13에서 다국어 지원하기 - next-intl
Next.js를 사용해서 다국어 지원하는 방법 - next-intl, next app router
Nextjs 13/14에서 다국어(localization)를 지원 할 수 있도록 설치 부터 어떻게 다른 언어를 사용 할 수 있는지 알아보겠습니다. 예시에서 사용될 next.js에 버전은 13/14이고 여기서 app 라우팅을 사용해서
surviveasdev.tistory.com
+) 지역에 따른 locale 설정 : HTTP헤더의 accept-language를 따라간다. 따라서 브라우저의 언어 설정을 지정해주면 거기에 맞춰 language가 선택된다.
나의 경우 middleware.js에서 defaultLocale을 en으로 해놨고 navigation.js에서 지원 언어를 [en, ko]로 설정해놨다.
크롬 언어 설정을 바꾸면서 시험해봤는데, 이렇게하면
1순위 언어가 영어일때는 - /en
한국어 - /ko
그 외 언어 - /en
으로 자동 접속되는걸 확인했다.
https://developer-syubrofo.tistory.com/72
Spring으로 다국어 페이지 만들기
회사 홈페이지를 다국어로 퍼블리싱을 해야 한다는 이야기를 듣고 나서 Spring을 이용한 다국어 페이지 만드는 방법을 여러가지 검색을 해보면서 구현을 해봤다. 나는 메세지 번들까지는 사용하
developer-syubrofo.tistory.com
++) next-intl에서 router.push()로 언어를 바꾸고 이전에 방문한 페이지를 들어가면 그 페이지에서 마지막으로 쓰였던 locale로 바뀌는 오류
무슨말이냐면
/en/하위페이지1 로 들어간다.
-> /en/하위페이지2 로 넘어간다.
-> language 전환 버튼을 눌러 /ko/하위페이지2로 변경 후 뒤로가기 or /하위페이지1로 접속
-> /ko/하위페이지1이 아닌 /en/하위페이지1로 자동접속됨
이게 이전에 한번씩 방문했던 페이지가 계속 그랬다. 새로 접속하는 페이지에서는 전환한 language로 잘 나왔다. => 이것도 다시한번 전환 후 접속하면 오류 발생
뭔가 기록이 남아서 자동으로 바뀌는거같은데, 공식 홈페이지를 보면 계속 유지돼야하는게 맞는거같은데.. 시간이 지나서 잘 모르겠다. 어쨋든 해결방법은 그냥 이동메뉴 link 앞에
/${locale === "ko" ? "ko" : "en"}넣어주기