🔴 Get my Complete Frontend Interview Prep course - roadsidecoder.com/course-details 🧑💻 Source Code - github.com/piyush-eon/i18next-tutorial-yt ➡ Book an Interview Preparation call with me ( 20% OFF for limited time ) - topmate.io/roadsidecoder
I just watched your "Multi-Language Implementation" RUclips video, and I thought it was really informative. However, since all of the data is dynamically retrieved from the backend, I am having trouble with the multi-language configuration. Would you kindly explain or offer advice on how to manage translations for this kind of dynamic data? In particular, how should the backend replies be organized to provide smooth frontend multilingual integration?
i18next configuation : "6:08" same key for same content but in different languages : "8:00" useTanslation hook with key : "9:07" translating object : "16:56" changing data dynamically coming in json format from backend - interpolation {{channel}} : "20:22" apply styling dynamic data Trans : "22:04" different languages translation in different files : "25:25" task : make translation json file for different pages : ""
There is something you overlooked, I can't believe nobody else noticed; when using language detector, browsers don't return language in two-letter format, they return something like en-US, so you can't have your languages' names just with two letters, you gotta use the full identification code.
This is something which we all should do irrespective of project requirements. Even if we don’t need internationalisation in our app, we should define existing texts in this manner only. It will benefit in scaling the project
So, if I have a large website, I will have to put in a lot of effort to translate each line of content into a different language. So, can you suggest any other approach that is simple and converts my full website language into the required language?
Also, for your future videos, for arabic - it's not just the language, but the layout also changes RTL. Please demonstrate how can we also change the layout for RTL.
I just watched your "Multi-Language Implementation" RUclips video, and I thought it was really informative. However, since all of the data is dynamically retrieved from the backend, I am having trouble with the multi-language configuration. Would you kindly explain or offer advice on how to manage translations for this kind of dynamic data? In particular, how should the backend replies be organized to provide smooth frontend multilingual integration?
Very nice but for large content website we need to add all translation in our react js do we have any library so that atleast 60-70 percent of translation it can handle and for some content which is not getting translated we can translate it?
So how do they translate the data coming from the API? Most of the time, words like .../en .../fr .../hi are added to the end of the url. Is this because these words are added to the API endpoints? In other words, when a request is made to /en, English data is received, and when a request is made to /fr, French data is received.
Hello. Thankyou for making this tutorial. I have a question. My components have api file where I am storing information for all my grid child elements. Now, how do I assign language translations to them inside my api file?
This is static data..what about real world scenario like..i have multiple components..booking page..list page and all..then how can we do..this to all component..
Peace be upon you. I am a user of the i18next website on a site like this, and I am on the page work and i'm creating data in a js spicial file , not a json file, and the data viewer is on the page work with map function. I want to translate the file containing the data. I don't know how to connect it, and there's nothing in it that explains what I mean by it. All that is available is that it translates a sentence or two, not the entire file into a single file. please help.
What if I want to build a website in like 7-8 languages and website has lot of text content. Then it would be very inconvenient and hard for me to have all those translations in all these languages in my files. Like each and every page has lot kf text. Also what I hade blogs functionality in my website. If some user upload there blog the. How would I translate and show his blog in all these languages? I would have user to upload the blog in all the languages. How to solve such issue?
I am using the same interpolation technique, to chnage the value entered in the Input to be transalted to french but it's not converiting if someone can help I can share my code
Generally, We don’t do that in our application. We take the time from browsers which takes it from the Operating system. Timezone should be as per users local time and hence we avoid changing it
Hello bhaiya I create a video for top 10 best youtube channel for web development. And also mention your Channel name. And upload on youtube and Instagram. Because you are best educator for beginners. ❤ thanks bhaiya 🙏 . Programming with satyam - my channel name
🔴 Get my Complete Frontend Interview Prep course - roadsidecoder.com/course-details
🧑💻 Source Code - github.com/piyush-eon/i18next-tutorial-yt
➡ Book an Interview Preparation call with me ( 20% OFF for limited time ) - topmate.io/roadsidecoder
I just watched your "Multi-Language Implementation" RUclips video, and I thought it was really informative. However, since all of the data is dynamically retrieved from the backend, I am having trouble with the multi-language configuration.
Would you kindly explain or offer advice on how to manage translations for this kind of dynamic data? In particular, how should the backend replies be organized to provide smooth frontend multilingual integration?
One of the most thorough explanations based on actual project scenarios. Very helpful, buddy. Keep it up.
Thanks a ton!
I LOVE YOUR TUTORIALS!!! Straight to the points, clean, clear and updated (let alone you always have cherries on top)!!! Thanks a million!!!
Thanks man! Appreciated.
i18next configuation : "6:08"
same key for same content but in different languages : "8:00"
useTanslation hook with key : "9:07" translating object : "16:56"
changing data dynamically coming in json format from backend - interpolation {{channel}} : "20:22"
apply styling dynamic data Trans : "22:04"
different languages translation in different files : "25:25"
task : make translation json file for different pages : ""
There is something you overlooked, I can't believe nobody else noticed; when using language detector, browsers don't return language in two-letter format, they return something like en-US, so you can't have your languages' names just with two letters, you gotta use the full identification code.
Thank you for this tutorial. I had 2-3 shots at setting up i18next correctly, but always failed until I found your video!
I love these tutorials. Clean and precise. Thank you
On all accounts, we says true, there is no other tutorial like this one in RUclips.
This is something which we all should do irrespective of project requirements. Even if we don’t need internationalisation in our app, we should define existing texts in this manner only.
It will benefit in scaling the project
Yes, Right !
Bro it was awesome...you have solved very hectic thing for me
Glad I could help!
quite descriptive and useful video ... keep it up💛
What a great video brother, I understood everything thanks to you! Keep it up 😎
Glad to hear it!
Great!!! Thats what i was searching for!
this is a masterpiece! 💥
Bhai be lated happy birthday, or mai yahi dekhna cahata tha apne product me use karne ke leye, dashboard ke leye foreign clients ke leye 😊. Thanx bro
Thanks man 💖
Thank you bro you give us the details
You are the best (AADMI) on the entire youtube 🧡
My maaaan! You just won a new suscriber!!!! thx
Thank you very much. You helped me a LOT!
You are welcome!
I have subscriped just cuz of the awesome explanation 🔥
Welcome aboard!
handsdown the best tutorial
thank you, tutorial was helpful
thank a lot, guy, it will helpful a lot.
best tutorial ever watch
So, if I have a large website, I will have to put in a lot of effort to translate each line of content into a different language. So, can you suggest any other approach that is simple and converts my full website language into the required language?
Use some translation tools which can automatically translate using service like Google translate. And all the best with translated locale.
Or you can give to any ai tool to translate it into another language.
Also, for your future videos, for arabic - it's not just the language, but the layout also changes RTL. Please demonstrate how can we also change the layout for RTL.
I have demonstrated RTL as well
I just watched your "Multi-Language Implementation" RUclips video, and I thought it was really informative. However, since all of the data is dynamically retrieved from the backend, I am having trouble with the multi-language configuration.
Would you kindly explain or offer advice on how to manage translations for this kind of dynamic data? In particular, how should the backend replies be organized to provide smooth frontend multilingual integration?
@RoadsideCoder
U always come up with new content
Best Chanel for frontend developers
💖
I love u man ❤
Amazing Thanks
Very nice but for large content website we need to add all translation in our react js do we have any library so that atleast 60-70 percent of translation it can handle and for some content which is not getting translated we can translate it?
So how do they translate the data coming from the API? Most of the time, words like .../en .../fr .../hi are added to the end of the url. Is this because these words are added to the API endpoints? In other words, when a request is made to /en, English data is received, and when a request is made to /fr, French data is received.
If it is done as I think, data should be added in 3 languages in the dashboard, right? Can you explain how these things are done in real life?
Superb video ❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤❤
great but when i have two style and and i want switch beween then what can i do in this case ?
very good 😃
Thank you
Thanks for sharing.
Hello. Thankyou for making this tutorial. I have a question. My components have api file where I am storing information for all my grid child elements. Now, how do I assign language translations to them inside my api file?
can you make one more video , like by using API instead of storing in forntend
An informative tut video
Thanks for sharing...
please do video on auto generate translation.json using npm package
good tut but still didnt got how to translate words from api..
The best lessons ever. Greetings from Ukraine.
nice video sir
what if we get the translation from backend API, how to map in that case?
Continue DSA series
I am getting error text content does not match server-rendered html. It happened when I tried to make separate files for different components
This is static data..what about real world scenario like..i have multiple components..booking page..list page and all..then how can we do..this to all component..
you need to use async/await or RxJS
Peace be upon you. I am a user of the i18next website on a site like this, and I am on the page work and i'm creating data in a js spicial file , not a json file, and the data viewer is on the page work with map function. I want to translate the file containing the data. I don't know how to connect it, and there's nothing in it that explains what I mean by it. All that is available is that it translates a sentence or two, not the entire file into a single file. please help.
What if I want to build a website in like 7-8 languages and website has lot of text content. Then it would be very inconvenient and hard for me to have all those translations in all these languages in my files. Like each and every page has lot kf text.
Also what I hade blogs functionality in my website. If some user upload there blog the. How would I translate and show his blog in all these languages? I would have user to upload the blog in all the languages.
How to solve such issue?
Thats why companies have a separate translator for main taining all this data
@RoadsideCoder but what about blog functionality? And I have to make such a multilingual website how can I do so?
Bhai leken agar Data API se aaraha horo usko kaise change karenge ?🤔
I am using the same interpolation technique, to chnage the value entered in the Input to be transalted to french but it's not converiting if someone can help I can share my code
what if there is maping it does not work on maping
bro using this we can only translate static texts?
So i need to translate every sentence and word in my app even if it's freaking big?
that's how every app does it
Translator❌ Hashmap✅
make a video on polyfill useState hook From Scratch
Sure! I will!
I am using the usetranslation with in a usestate hook and it is not working . Can you suggest anything reg this
can you show me your code
Wait, do I have to rewrite all the translations content manually?
Yes, all websites do
main ye already use kiya hoon apne project me😅
great!
so we need to write our whole app in multi lang?
yes
what could have been a 4 min video .. its 30 min.. wooow
👏
@RoadsideCoder on page refresh language is changing to en in local storage
Good day greetings
Is it work for also next.js?
2000 years latter 😂
Bhai leken iske state ko mamage kaise karke rakhe, agar page ko koi reload kare to ?
i18n will automatically persist the state by using localstorage
Thanx bhai sone me suhaga bhai 😁
❤
how many years of experience do you have brother?
3
Name the extension to auto import react components
ES7+ React/Redux/React-Native snippets
@@RoadsideCoder not working
@@Ankit-01-01 just search it in extensions tab of VS Code
not for large websites
When Change the language, How to change also time in our website..
Generally, We don’t do that in our application. We take the time from browsers which takes it from the Operating system.
Timezone should be as per users local time and hence we avoid changing it
company m yhi krna h talk about timing
Hahah great! Dont forget to share 🤓
Github repo link please
In the description
Hi bro
Hey
How they read data from public folder for en, fr and hi language without change any settings?
BEST
Hello bhaiya I create a video for top 10 best youtube channel for web development. And also mention your Channel name. And upload on youtube and Instagram. Because you are best educator for beginners. ❤ thanks bhaiya 🙏 .
Programming with satyam - my channel name
LinkedIn id :
www.linkedin.com/in/piyush-eon/
When Change the language, How to change also time in our website..
Check this out - www.i18next.com/translation-function/formatting