Next.js App Directory & i18n - Full Tutorial

can we switch the locale without refreshing?

i did everything like u did but i have this isssue
app\[locale]\page.js[locale]/page.js doesn't have a root layout. To fix this error, make sure every page has a root layout.

can u help ne solve this please

I implemented next-intl and it has many issues.. it feel not stable.. sometimes it routes to completely different locale and it causes caching not working..

Great video, I just want to ask, if I use useTranslations in page.tsx, doesn't everything become a client component? Or is it something different than a classic hook? It confuses me how they have "use" in there, so I want to ask. :)

This video is great! I had just about given up on using next-intl but this video made it so clear, thank you!

hey, how do we chain this middleware with the normal middleware that has conditional statements for rewriting a path?

Thank you this video. That's great

Thank you for your great video. Even though everything in the video works. I am currently facing this reloading problem. When I try to change the language of the web, it fully reloads. I want to change the language without reloading the page. Is there any way to do that?

Ughhh this got soooo complicated and bad with the app directory. It was insanely straightforward with pages directory and next-i18next..

Thanks for the explanations tho :)

when creating a i18n.js file I get this error
Module '"next-intl/server"' has no exported member 'getRequestConfig'.
in the next-intl/server there is no getRequestConfig method

i have error when i use layout and import'./global.css' module not fount in [locale]

Does anyone has the same error? 'Error: Unable to find `next-intl` locale, have you configured the middleware?'

Im using redux and get a 404 after passing the layout, css and page to the [locale] folder, any thouhgts on that? thanks!

Thank you!

Useful....

Where is the src folder? Should be there, and you dont have it. All the time this error:

Error: Unable to find `next-intl` locale, have you configured the middleware?`

Next-translate is much better than next-intl.

See ya!

What theme are you using?

Is there a way to use it when my page is an async function?

Thanks, this video helped me a great deal.

Miten hyödynnät tätät DatoCMS kanssa esimerkiksi ?

Thank you! You have a wonderful English accent! The video was helpful!

nice turorial!!!! but how dose work output:"export" in next.config.js for static page?

Straight forward, tahnks!

import Link from "next-intl/link";

TypeError: (0 , next_navigation__WEBPACK_IMPORTED_MODULE_0__.useParams) is not a function

how do I solve :(

What a great video, it helped me a lot!
Now, how can I test if my defaultLocale would work correctly, I already tried to change Chrome's 'sensors' and there was no change, how can I test this?

I followed the steps but i had this error
Unhandled Runtime Error
Error: No intl context found. Have you configured the provider?

What if you have a blog with many posts, are you going to translate each post? Is there a better way to handle blog posts? Thanks

Why in change languages, page refreshed?
That's right?

Has danger error in next-intl, they don't work with app folder and BASE_URL. If you search in they github issues, has a topic posted there.

Thank you so much, sir! Your video was incredibly helpful ❤🫡. I wanted to mention that if you have an 'api' folder in your project, it is essential to place it outside of the '[local]' folder. Keep up the fantastic work, and thank you again for sharing your knowledge with us!

Thank you so much!

It sucks that you didn't do it in Typescript. Javascript only is completely useless for people who use Typescript and anyone who wants to work on a project professionally should be using Typescript. =\

guyyy, i love the way you pronounce hook

Not gonna lie the hardest part of this is figuring out whether I’m supposed to be using next-intl, react-intl, react-i18n, react-i18next, next-i18next.

It’s a complete mystery. And every tutorial or article recommends a different tool.

have you tried deploy this project into firebase hosting ? is next export supported now ?

Thanks a lot, great video :)

I want to ask which one has better performance i18n or next-intl with server and client side? btw your content helped me alot about app dir make more videos

I wished it was on typescript

Anyone knows how to make Static Site Generation with i18n? I tried everything but nothing works. Actually I don't really understand why something that much important like have a website with SSR and multi language is so hard. Can anyone help me?

I usually don't leave messages, but this video is amazing! You have a great way of explaining things that makes it so much easier to understand. Thanks for this video:)

What if we have a client component? It is impossible to think of an app without hooks. What can we do in this case?

How mange canonical tag in NextJs 13 next-intl

straight to the point! great as always!

Great tutorial.
How do you build the app if it has middlewares?

Is it possible to do it without path, only using cookies in the app router?

thank you a lot. that's exactly what i've been looking for

Cool video! @TuomoKankaanpaa How do you translate the page's title (browser's tab) that you define using next js metadata?

if you switch language your page rerendered. how to do without rerender

wow the time I am watching this is 7 days ago and server component is not on beta anymore since 4 days ago and the doc is changed