The languages that needed for my website are Chinese and English. I am using Meteor + React to build the website. I want to know how to properly setup the website with ability to switch the language between Chinese and English.
What comes in my mind is first I would structure the project like below:
// standard meteor project structure as documentation guide
...
/pages
../Home
../en/Home.jsx
../cn/Home.jsx
Then having my URL setup with say example.com/cn/...
according to language user choose which maybe I will put it inside navbar or dropdown option.
In my database, I would try to find of way to create another Collection to link between different languages.
What do you think of the way of me thinking of setting the website up ?
What you try to do is called "Internalisation" which is basically adding support for multiple languages, dynamically, for your UI. You can also see the term i18n instead of "Internalisation" as i18n is the short form of it.
You will create JSON files for translations in the naming convention of <filename>.<language>.i18n.json
.
There a couple of packages you can use with Meteor. The most common one is tap:i18n
.
Check this section in the the official Meteor guide for i18n
, related 3rd party packages and the React implementation.
There is also a nice article from Meteor Chef as another useful resource for i18n, Meteor and React.