Translating a Next Js Website (App Router i18n)
I migrated my website to the `app` directory router. However, it’s a multilingual website with content both in French and English, and the translation library I was using, i18next, doesn’t work server-side. So this is the story of how I rolled my own translation system and what I had to set up to make it work.
And even if you don’t need to translate your NextJS website, you might need to use a middleware or a lookup for something else. If you don’t, this video on the new SEO features in Next JS might be interesting to you.
For those of you who are still here, there are three parts to this :
- first how I structured my app directory to handle locales
- second, how I coded the lookup function to translate strings within pages
- third, how I set up the middleware to switch users from one version to the other depending on their browser language.
Let’s dive right in.
You can find the latest code here : https://github.com/Kodaps/gradient-as...
----
Want to go into further depth? Head to https://kodaps.dev/
Watch video Translating a Next Js Website (App Router i18n) online without registration, duration hours minute second in high quality. This video was added by user Kodaps Academy 01 January 1970, don't forget to share it with your friends and acquaintances, it has been viewed on our site 25,098 once and liked it 277 people.