search

i18next / i18next-gitbook

165 stars 172 forks source link

Language change can be reflected to URL route? #184

Closed sjb3 closed 2 years ago

sjb3 commented 3 years ago

Hi, i18n,

While browsing the gitHub, I just learned that gitHub now supports many different languages. Also, per selecting the language in dropdown, the URL also gets updated with corresponding country code! (not the contents though). Wonder how can it be achieved with i18thnext (or is gitHub already using your library?). I did a bit of testing/implementing but no success so far, if there's a way it will be AWESOME(care to share how to) otherwise it can be a good proposal for future development?

Cheers,

sjb3

jamuhl commented 3 years ago

There are two parts to that problem.

1) you build or use a UI framework (eg. next.js) / server that supports routing with language codes 2) the i18n lib needs to get the language code from route (or server side) - this can be done using the language-detector

jamuhl commented 3 years ago

have a look at https://github.com/isaachinman/next-i18next

sjb3 commented 3 years ago

Hi Jan,

Thanx for the quick response and resources! Currently, as we're using aws serverless for backend, no plan to add/migrate to nextJS but will stay with reactJS.

After checking the nextJS, is there any other way that(from frontend) that we can change the route or path?

Thanx in advances!

Justin

From: Jan Mühlemann @.> Sent: Friday, October 8, 2021 10:58 PM To: i18next/i18next-gitbook @.> Cc: Justin Byun @.>; Author @.> Subject: Re: [i18next/i18next-gitbook] Language change can be reflected to URL route? (#184)

There are two parts to that problem.

  1. you build or use a UI framework (eg. next.js) / server that supports routing with language codes
  2. the i18n lib needs to get the language code from route (or server side) - this can be done using the language-detector

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/i18next/i18next-gitbook/issues/184#issuecomment-939234611, or unsubscribehttps://github.com/notifications/unsubscribe-auth/ADM7JKW4GULYIKR3W7S5WLLUF7KYDANCNFSM5FUR6Q6Q. Triage notifications on the go with GitHub Mobile for iOShttps://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Androidhttps://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.

sjb3 commented 3 years ago

I kind of came up with this temporary solution.

<Router basename={/TEMP/${currentLanguageCode}} forceRefresh> It's sort of working on local but the changes are not immediately reflected, hence added forceRefresh, to get it updated i will need to click tabs a few more.

Mostly upsetting thing is, on our internal dev server, forceRefresh in the directive is not applicable.

Any ideas?

Just

jamuhl commented 3 years ago

No sorry...personally I never had the demand to have a clientside solution do this. It's a problem that needs to be somewhat solved in whatever router solution you're using...guessing it's react-router...

sjb3 commented 3 years ago

Yeah right,

I can get it worked using react-router-dom but not quite smooth as I expect though.

Just

From: Jan Mühlemann @.> Sent: Monday, October 11, 2021 12:02 AM To: i18next/i18next-gitbook @.> Cc: Justin Byun @.>; Author @.> Subject: Re: [i18next/i18next-gitbook] Language change can be reflected to URL route? (#184)

No sorry...personally I never had the demand to have a clientside solution do this. It's a problem that needs to be somewhat solved in whatever router solution you're using...guessing it's react-router...

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/i18next/i18next-gitbook/issues/184#issuecomment-939741585, or unsubscribehttps://github.com/notifications/unsubscribe-auth/ADM7JKVLOV3ZJ4X2Y5JR7L3UGKDW3ANCNFSM5FUR6Q6Q. Triage notifications on the go with GitHub Mobile for iOShttps://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Androidhttps://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.