State of CSS 2020: translating the survey in your language

[SachaG]

IMPORTANT: the translations files have moved to another repo

In previous years we've tried to make the results of each survey available in multiple languages, but this year we want to go one step further and translate the survey questions too in order to reach non-english speakers as well.

Getting Started

The YAML files to translate live in the StateOfJS-API repo, which contains our API:

• https://github.com/StateOfJS/state-of-js-graphql-results-api/tree/master/src/i18n

IMPORTANT: check that there aren't any existing PRs for the language you want to translate first!

You can copy the model files to use as starting point:

• https://github.com/StateOfJS/state-of-js-graphql-results-api/tree/master/src/i18n/model

Previous Translations

You may also want to take a look at previous year's translations if that helps:

• State of JS 2019
• State of CSS 2019

Getting Credit

Every translator will be credited on any site that makes use of the translations, starting with the survey-taking app. You can add your name here if it's not already there.

• https://github.com/StateOfJS/state-of-js-graphql-results-api/blob/master/src/i18n/locales.yml

Translation API

You can get extra data such as the completion percentage for a locale or the untranslated strings via our API, available at:

• https://graphiql.stateofjs.com/

Here is a sample query:

query GetLocaleData {
  locale(localeId: "ru-RU") {
    completion
    totalCount
    translatedCount
    translators
    untranslatedKeys
  }
}

[SachaG]

But I already translated this last year!

A note to the many awesome people who have helped us translate the survey in the past: one thing we are trying to do this year is prevent the need for re-translating the same strings every year.

For that reason we'll try to reuse the strings in this repo as much as possible for the results site (e.g. https://2019.stateofjs.com/, etc.) as well. Hopefully we'll then be able to have a much smaller, separate translation project that only targets the character strings specific to the results site.

[SachaG]

I don't speak language XYZ but still want to help!

Even if you don't speak language XYZ but would still like to help, here's what you can do:

1. Create new xyz-XYZ.yml files for the locale if it doesn't already exist inside this repo's /i18n directory (by using the model.yml file as model).
2. Look at the existing translation files for State of JS and State of CSS.
3. For every string in the xyz-XYZ.yml files in this repo, try to find matching translations in the translation files for previous years. Note that the keys might sometimes be a little different.
4. If you did find a string, remove the # todo comment.

[SachaG]

I want to test my translation locally

If you want to see your translations in context inside the survey app, you will need to run the SurveyVulcan repo, which uses the Vulcan.js framework.

The installation might be a little more involved since it might require the two-repo install, but if you want to do it and run into any issues I suggest pinging me on the Vulcan.js Slack.

[polettoweb]

I might be able to help with Italian this year as well. I suppose there is a time limit to finish it. A bit busy at this moment, but I can find time soon

[SachaG]

@polettoweb great! We'd like to launch the survey early next week which is a bit short on time, but we can always add more translations as we go.

[polettoweb]

Ok, I'll do my best to squeeze it in :-)

[polettoweb]

You might consider registering https://github.com/StateOfJS/StateOfJS-Vulcan to https://hacktoberfest.digitalocean.com/ it might attract more quick help :-)

[SachaG]

Or more spam… I think I'll avoid it for this year!

[polettoweb]

Fair enough

[SachaG]

I added a few new features based on the feedback we received, here's the commit: Devographics/StateOfJS-Vulcan@ad78403

[SachaG]

whoops, I realized I forgot to add unit/selector names to the translation files: Devographics/StateOfJS-Vulcan@b1ecb06#diff-c97a3dab92e66d7d2b4f45531b0e6d2a

[Omhet]

@SachaG Hi, I think I could help with russian 😊

[SachaG]

@Omhet that'd be great! Russia has a huge presence on the web so it'd be nice to reach that audience as well :)

[zainab-oraby]

I understand from the thread that time is running short as the survey is coming out early next week, but I would like to help with Arabic and will do my best to get something up asap.

[SachaG]

@zmmorabya thanks! RTL languages might require some extra styling so if you have time to contribute the translations I'll look into adding a special class to the body or something when RTL languages are enabled.

[zainab-oraby]

That sounds very good! I will carry on and put the translation up for review as soon as I can. And may be later I can help with the RTL styling, I'd be glad to do so.

[Omhet]

@SachaG Made a PR for russian translation Devographics/StateOfJS-Vulcan#38

[SachaG]

Note that the translations files have moved to another repo: https://github.com/StateOfJS/state-of-js-graphql-results-api/tree/master/src/i18n

If you have PRs in progress on the old repo go ahead with them and I'll figure out how to merge everything properly, but if you're starting fresh then use the new repo!

[SachaG]

First of all, thanks again for everybody's help with this! It's been amazing to see all the translations PRs come in! A quick update about the project:

1. New Repo

As written above, the translation files have been moved to a new repo:

https://github.com/StateOfJS/state-of-js-graphql-results-api/tree/master/src/i18n

The reason behind the move is that the translations are now pulled through our central GraphQL API, which will make it easier to reuse them for our results site as well (in addition to the survey-taking app).

2. New Strings

I've added a few more new strings to translate. If you can search for # TODO throughout the translation files for your languages you should find them!

3. Launch Date

We will try and launch the survey next Monday (October 19th). Hopefully we can get a few more languages finalized before then!

4. Translation Credit

Every translator will be credited on any site that makes use of the translations, starting with the survey-taking app. You can add your name here if it's not already there.

[SachaG]

The survey is now live! Thanks for your hard work!

https://stateofcss.com/

(Of course you can still keep translating even if the survey is live… and we'll need your help again for the results very soon!)

[ervinismu]

Hi @SachaG, can I translate to Indonesian? 😊

[SachaG]

@ervinismu yes of course! that'd be great!

[MarianaPicolo]

I'd love to translate for brazilian portuguese 😀

[SachaG]

@MarianaPicolo how different would a Brazilian Portuguese version be compared to the current Portuguese version? If the current version is understandable by Brazilian Portuguese speakers we'd probably prefer avoid having multiple versions of the same language, just to make maintenance easier over the long term. Is there a way to make a "neutral" version that avoids terms that are specific to either language?

[MarianaPicolo]

@MarianaPicolo how different would a Brazilian Portuguese version be compared to the current Portuguese version? If the current version is understandable by Brazilian Portuguese speakers we'd probably prefer avoid having multiple versions of the same language, just to make maintenance easier over the long term. Is there a way to make a "neutral" version that avoids terms that are specific to either language?

There are some words and expressions that differ from the Portuguese version.

[SachaG]

I think we're going to apply the same guidelines as Wikipedia, which as far as I can tell only has one general Portuguese version. So I would suggest contributing to the existing Portuguese version instead, sorry…

[adamkudrna]

@SachaG I'd like to translate into Czech, or am I late to the party?

[SachaG]

@adamkudrna sure that'd be great!

[adamkudrna]

Here we go: Devographics/state-of-js-graphql-results-api#46 🇨🇿

[ymcheung]

Some strings for State of CSS use the ones in state_of_js.yml
For example:
https://github.com/StateOfJS/state-of-js-graphql-results-api/blob/e44865a7cdd4cbd4d1395b424cc31572d87e6fc2/src/i18n/model/state_of_css.yml#L54 ~ L57

https://github.com/StateOfJS/state-of-js-graphql-results-api/blob/e44865a7cdd4cbd4d1395b424cc31572d87e6fc2/src/i18n/model/state_of_css.yml#L93 ~ L101

https://github.com/StateOfJS/state-of-js-graphql-results-api/blob/e44865a7cdd4cbd4d1395b424cc31572d87e6fc2/src/i18n/model/state_of_css.yml#L103 ~ 111

[SachaG]

@ymcheung you're right, we should remove those from state_of_js.yml and probably move them to common.yml if they exist in both surveys. I won't change it for now to avoid merge conflicts but at some point we'll take a moment to clean up the keys.

[SachaG]

Since we're trying to centralize translations and avoid duplicate work between the CSS and JS surveys, I'll also move all discussion about this topic to a central thread:

Devographics/state-of-js-graphql-results-api#50

[SachaG]

We have added a few more strings to translate: Devographics/state-of-js-graphql-results-api#50 (comment)