NextJS APP Router | i18n Internationalization (i18next - next-intl) | Multiple languages (idioms)

  Рет қаралды 9,344

The JavaScript Way

The JavaScript Way

Күн бұрын

Пікірлер: 39
@yousefsaeed732
@yousefsaeed732 6 ай бұрын
I used this library in my portfolio to convert between Arabic and English or vice versa. The strange thing is that if the language is English and I switch to Arabic, then click on any link on the site, the language switches back to English. I tried to understand the reason but couldn't. I solved the problem by making the site reload 800 milliseconds after changing the language. Do you have any idea about the problem?
@TheJavascriptWay
@TheJavascriptWay 6 ай бұрын
Hey. Not totally sure but I believe languages like Arabic are a special case in fact due to their specific characters. In fact I only tried to translate to european languages. Please check the docs for the exceptions. Don't know how to solve this at this point but believe that's the issue.
@yousefsaeed732
@yousefsaeed732 6 ай бұрын
@@TheJavascriptWay when i change language it changes in url and cookies is there something else ? However when just navigate to another route it returns the same language as before changing
@iwilldowhatiwannado843
@iwilldowhatiwannado843 9 ай бұрын
ok.. Thanks for the video.. However.. you are using it only inside of the server component.. I expected how to use in client components.. I said before that next-intl might drop performance.. here are my questions.. is NextIntlClientProvider causes some performance issues? and can I use next-intl without generateStaticParams and unstable_setRequestLocale although I use both server and client components.. I am experiecing some performance Issues after using next-intl.. everything works well but it feels a bit slow and caching is not working.. I dont know is it next-intl's problem or from next.js..
@TheJavascriptWay
@TheJavascriptWay 9 ай бұрын
All I am doing is to show how to implement i18n using the docs. I delayed this tut because I wanted to do something more advanced but in the last minute just tried to do the standard. For sure the implementation is now correct but to answer to your questions more development and testing is necessary. Cannot at this point confidently answer your questions. Maybe another viewer can.
@ezadeeeeen
@ezadeeeeen 4 ай бұрын
All video the sam content ,what about multi page and multi layout ,there is many problem .
@TheJavascriptWay
@TheJavascriptWay 3 ай бұрын
This tutorial does not cover every single use case scenario.
@hamzaking127
@hamzaking127 6 ай бұрын
Hello, I have a problem with the Google search console. What is the link that will take me to the page? Am I original or /en?
@TheJavascriptWay
@TheJavascriptWay 6 ай бұрын
Hey. Wathever you defined as your default idiom I believe. So, without the locale in the URL.
@Miguel-qj2dw
@Miguel-qj2dw 6 ай бұрын
By following the entire tutorial, almost everything works correctly, with the exception of the errors that are not defined, it gives me a hydration error.
@TheJavascriptWay
@TheJavascriptWay 6 ай бұрын
Hydration errors can happen in seveval contexts. It's a tutorial on its own. Have a look.
@adenbinfarrukh4650
@adenbinfarrukh4650 7 ай бұрын
Hi great video on translations. Wanted to ask if I can translate text without having any change in the URL ( without using /en, /fr etc or without anything like .en or .fr etc )
@TheJavascriptWay
@TheJavascriptWay 7 ай бұрын
Hey. Thanks. Well this is the recommend way. Never tried a different way.
@adenbinfarrukh4650
@adenbinfarrukh4650 7 ай бұрын
@@TheJavascriptWay Got it. Thanks
@darawan_omar
@darawan_omar 3 ай бұрын
Hiw we can change direction to rtl when change to arabic
@TheJavascriptWay
@TheJavascriptWay 2 ай бұрын
You need to check the docs for that. I do not cover that on this video.
@germancardosodesousa5183
@germancardosodesousa5183 7 ай бұрын
Hi! Great videooo! Helps me a lot. Could you explain me how could i add a /about and /contact page on this proyect? I saw you other video, but i could't make it works... Thanks!!
@TheJavascriptWay
@TheJavascriptWay 7 ай бұрын
Hey. Thanks for your feedback. Adding pages is all about Routing (check my other projects). After that comes translating content anywhere inside your app but the core principles remain the same. I suggest you to check tutorials where I create pages (Routing) and you create your own project. After that implement i18next. It's not that hard. In the near future hope to build a project where I fully translate the App.
@germancardosodesousa5183
@germancardosodesousa5183 7 ай бұрын
@@TheJavascriptWay Thanks for your support! I going to continue working on that, and in the worst escenario, i will waint for you future video :) My issue i think, is that i cant psuh the locale into my url, adding to the route. For example localhost/es/about. Thanks again!
@germancardosodesousa5183
@germancardosodesousa5183 7 ай бұрын
​@@TheJavascriptWay Thank you for your support! I truly appreciate it. I managed to navigate through the URL, for example, between localhost:3000/es/ and localhost:3000/es/about, but I can't do it through the navbar using . I assume it's done by handling the URL, but I can't figure out how. I'm eagerly awaiting that video :) Thanks again for the help!
@germancardosodesousa5183
@germancardosodesousa5183 7 ай бұрын
Thank you for your support! I truly appreciate it. I managed to navigate through the URL, for example, between localhost:3000/es/ and localhost:3000/es/about, but I can't do it through the navbar using . I assume it's done by handling the URL, but I can't figure out how. I'm eagerly awaiting that video :) Thanks again for the help!@@TheJavascriptWay
@poojagarva
@poojagarva 6 ай бұрын
Hello, did you find any solution for /about or /contact page?
@rokkazmvm
@rokkazmvm 6 ай бұрын
Hey, is there a way to have one language(lets say english) not have any prefix by default? And others have like shown on video?
@TheJavascriptWay
@TheJavascriptWay 6 ай бұрын
Hey. If you want to have 1 single idiom there's no point to use i18next. The default idiom does not change the URL structure but if you add more languages the "en/pt/fr" will be shown inside the URL.
@sahilsworkmail
@sahilsworkmail 6 ай бұрын
Yes you can
@kanwarsingh3369
@kanwarsingh3369 7 ай бұрын
thanks for the vedio. but where can i get the source code for this?
@TheJavascriptWay
@TheJavascriptWay 7 ай бұрын
Hey. I guess I forgot to link it in the description. It's not for free. You can get it from my Ko-fi page, later.
@TheJavascriptWay
@TheJavascriptWay 6 ай бұрын
👉 Source Code: ko-fi.com/s/807b0f562e
@manikarthik2781
@manikarthik2781 4 ай бұрын
Could you do video on Pages router
@TheJavascriptWay
@TheJavascriptWay 4 ай бұрын
No. Sorry. You're the ONLY person requesting that. Just check the docs after checking this tutorial and it should help you.
@togya4
@togya4 8 ай бұрын
Hey thanks for sharing, can you now please explain about client component?
@TheJavascriptWay
@TheJavascriptWay 8 ай бұрын
It's super simple. By default all components in NJ14 are server side components and you must leave them like that in most cases so you get benefits from server side rendering like faster page loading and more. In some other cases where you need user interactivity like click events or when using react hooks you need to change them to client side using "use client" at the top of the file.
@togya4
@togya4 8 ай бұрын
@@TheJavascriptWay thanks again, My bad i didn't make it clear I meant the i18n client component how to use i18n? Again my apologies
@YTthings666
@YTthings666 7 ай бұрын
@@TheJavascriptWay Thanks a lot !! Can you make a video with a responsive navbar ?
@MohamedAymanpro
@MohamedAymanpro 7 ай бұрын
Peace be upon you. I am a use of i18next on a site like this, and I am on the page work I create the data in a spicial js file and the displays are in the map. I want to translate the file that contains the data. I do not know how to connect it, and there is nothing in it to explain what I mean. All that is available is that it translates a sentence or two. i want to translates completly one entire file.can you help me
@TheJavascriptWay
@TheJavascriptWay 7 ай бұрын
I am not sure if I understand what you mean but keep in mind that for this to work you need to use the exact filenames and file structure. It will break the APP if you don't! Translating 1 Page or the full website comes down to the same process. I would recommend you to rewatch the full video again and code along. Good luck. Thanks for your comment.
@mehdialijani5247
@mehdialijani5247 4 ай бұрын
perfecttt
@mamzouj
@mamzouj 3 ай бұрын
hhhhh this type of code will be free
@TheJavascriptWay
@TheJavascriptWay 3 ай бұрын
Cool
The basics - Internationalization with Next.js in 2024 (app router)
25:26
Rendr - Crafting Web Platforms
Рет қаралды 7 М.
Thank you mommy 😊💝 #shorts
0:24
5-Minute Crafts HOUSE
Рет қаралды 33 МЛН
Какой я клей? | CLEX #shorts
0:59
CLEX
Рет қаралды 1,9 МЛН
10 common mistakes with the Next.js App Router
20:37
Vercel
Рет қаралды 236 М.
Internationalization in NextJs 14 with Next-Intl | i18n
28:40
The Dome Paradox: A Loophole in Newton's Laws
22:59
Up and Atom
Рет қаралды 1 МЛН
How to set up Docker, Celery, and Redis in a Django project
27:15
Nehemiah Kamolu
Рет қаралды 279
Next.js i18n: App Router + next-intl Tutorial
10:04
Frontend Basics
Рет қаралды 9 М.