[Beta] Translating New React Docs

[gaearon]

It's time to translate new React docs at https://react.dev!

• Translation status: https://translations.react.dev/
• How to start a new translation: https://github.com/reactjs/translations.react.dev

Who is this issue for?

This issue is for existing translation repo maintainers.

What is ok to translate now?

All pages in src/content are good to translate.

Something unclear?

Please comment here with concerns or suggestions. Originally we wanted to suggest translating when more of the content is written. However, some translators have expressed interest in starting earlier so that's why we made this issue.

[arshadkazmi42]

Hi @gaearon

Does that mean, we should stop the translation of the current website, which in progress? And start focusing on this?

[gaearon]

I think that would make the most sense. (Sorry if you spent a bunch of effort on this.)

[arshadkazmi42]

I think that would make the most sense. (Sorry if you spent a bunch of effort on this.)

Thank you for confirmation. Will start working towards that.

[jakubdrozdek]

@gaearon Hey, I just started working on the Polish docs, but unfortunately my first PR's CI checks fail on Analyze bundle job.
https://github.com/reactjs/pl.reactjs.org/runs/4360534093?check_suite_focus=true
Do you know what's the problem? Is it required to pass?

And second question: where can we preview our translated website and what's the URL for the live Polish beta? The link in PR for Vercel app links to the old React docs: https://plreactjsorg-7luo3ndx9-fbopensource.vercel.app/

[smikitky]

@jakubdrozdek That happened on our fork (Japanese), too. That dawidd6/action-download-artifact@v2 GitHub action tries to download "external" files (artifact) that had been generated by a workflow executed on the main branch. You got that error because no relevant workflow has been previously merged into the main. If I understand correctly, you can ignore that error and just merge the PR for now. Everything should be fine from the next PR.

[gaearon]

Do you know what's the problem? Is it required to pass?

Like @smikitky said, try without it passing and see if that resolves next time. I wouldn't worry about it for now.

And second question: where can we preview our translated website and what's the URL for the live Polish beta?

If you write a few pages I'll set up a project. Unfortunately it's manual so write here and we'll do it.

[smikitky]

The current pre-commit hook has the following two lines:

https://github.com/reactjs/reactjs.org/blob/4022f9774b8dd93d863fd6bca6447b1f03ae3979/beta/.husky/pre-commit#L5-L6

This may make sense on the main repo but makes no sense on translation forks. Every time I commit, I see many useless notices saying the explicit IDs are different from auto-generated ones.

https://github.com/reactjs/reactjs.org/blob/4022f9774b8dd93d863fd6bca6447b1f03ae3979/beta/scripts/generateHeadingIDs.js#L55-L57

What's worse, because of the unconditional git add -u, I accidentally committed and pushed a draft translation without knowing it. I think this process could be smarter and less confusing to new translators.

[gaearon]

@smikitky yeah this sounds confusing! do you have a fix in mind? how did this work before?

[hg-pyun]

@gaearon Is there a schedule for the official release of new documents? It would be nice to share roughly.

[smikitky]

@gaearon In the future, it would be nice to run pre-commit generate-ids only on the main repo. When it finds a heading without an explicit ID, it should reject the commit instead of unconditionally fixing it and committing it. Alternatively, it could auto-fix only the files to be committed, not all the files in the src directory.

But in the meantime, I think this pre-commit hook could be simply removed.

[harish-sethuraman]

When it finds a heading without an explicit ID, it should reject the commit instead of unconditionally fixing it and committing it.

We might have to write a custom hook for that will look into that.

But in the meantime, I think this pre-commit hook could be simply removed

Will remove it

[arshadkazmi42]

Hey @gaearon

I received two PR in hindi translation repository today.

reactjs/hi.react.dev#224
reactjs/hi.react.dev#223

I didn't find any updates in this thread on how to proceed further with these PRs. Is it fine to merge the latest react.dev PR and ignore the Sync PR?

[gaearon]

Please wait, we'll get them merged ourselves.

[gaearon]

We've updated main and legacy branches for all active languages and closed all stale sync PRs. As the next step, we will update the issue templates across repos to be consistent and reflect the current set of pages on the website. Then we'll fix https://translations.react.dev to show the correct percentages, and ensure that the repo permissions set from https://github.com/reactjs/translations.react.dev are actively synced.

[gaearon]

We've updated the translation checklist issue across all repositories, fixed some lost translated pages, and fixed the global progress tracker at https://translations.react.dev/ to show the status of new translations!

[tdd]

Is there any way to enable some smart quoting for Markdown contents, as was the case for legacy docs? I'm looking in particular for apostrophes in text becoming ’ instead of of ASCII single quote (').

We try to honor French typographic code to the best of our abilities in our translations, the legacy docs had it, but for now we have to manually type the proper apostrophe or search-and-replace it before pushing or at PR review time.

/poke @gaearon

[gaearon]

We've moved content sync scripts to run on a public repo so that it's more noticeable if they start failing again: https://github.com/reactjs/translations.react.dev/actions.

We've also fixed the infrastructure for creating new translations: reactjs/translations.react.dev#285. We're no longer keeping the maintainer lists in a centralized repo — they can now be managed by individual teams using each project's Settings, which is how people have already been de facto updating them. (I'll remove the redundant "teams" later.)

If you want to start a new translation, please consider looking through https://github.com/reactjs/translations.react.dev/pulls for calls for volunteers. You can also submit your own request (ideally you'd have some translation experience before volunteering as a maintainer).

[gaearon]

@tdd I think smart quoting works for English, can you check that? If it doesn't work for French, maybe we can find where it's happening (I suspect some MDX plugin) and adjust the logic?

[faisalhani]

Hello @gaearon I would like to contribute to the translation on Arabic Language, please add me to the maintainers group if available.

[gaearon]

@faisalhani Please discuss this in the Arabic language repository. Existing maintainers make a decision on whether to add more maintainers.

[Kamilius]

@gaearon I would like to start translating into Ukrainian. Is there any place to ask questions besides this thread? (Discord, etc.?).
I've already read through the guidelines, but don't know how to coordinate with the rest of the repo maintainers, to let them know that some part of the website is already being worked on.

[gaearon]

@Kamilius The current Ukrainian repo maintainers are @vldmrkl @ithompson4 @oleksii-polovyi @MargarytaChepiga. The issue you should be using is reactjs/uk.react.dev#457. If they are not responsive in the issue for several weeks, please file a new issue in the repo to form a new team of maintainers. Once you have assembled a team of maintainers, please let us know by filing an issue in https://github.com/reactjs/translations.react.dev, and we'll give you the rights.

[smikitky]

Hi. I made this little tool that translates a Markdown file into another language using the ChatGPT API.

ChatGPT Markdown Translator: https://github.com/smikitky/markdown-gpt-translator

Of all the AI products I know, ChatGPT (especially GPT-4) provides the most accurate translations, but it unfortunately cannot process long texts in one go. This tool splits a Markdown file into segments, translates them in parallel, and combines the results.

I have tried it with a dozen files, and although it still makes mistakes, I found it can significantly reduce the time needed to finish the translation. If you are interested, please give it a try.

As an example, this page was created by translating the original Tic-tac-toe Tutorial using this tool (with GPT-4) and spending a few minutes fixing format errors.

[gaearon]

Amazing, thank you for sharing! FWIW, my stance on this is that it doesn't matter how the translation gets generated as long as there are humans in the loop that ensure the terminology is consistent, the style is pleasant to read and idiomatic for the target language, and that inaccuracies don't creep in.

[yousufkalim]

Dear @gaearon,

I am writing to express my interest in volunteering to create/translate React documentation in Urdu language. I am a native Urdu speaker and have been using React for several years. I am confident that I can create clear and concise documentation that will be helpful to a lot of Urdu speakers who are learning and using React.

I’m the author of the most famous react-easy-router library with around 4 million downloads a week, @yousufkalim is my GitHub profile, where you can see my other work and famous open-source libraries built for react.

I am available to start working on the documentation immediately. I am also willing to work on other projects related to React, such as creating tutorials, writing blog posts, or giving talks.

Thank you for your time and consideration. I look forward to hearing from you soon.

Sincerely,

Yousuf Kalim

[gaearon]

@yousufkalim To start a new translation, please see the process in https://github.com/reactjs/translations.react.dev.

[gaearon]

I'm going to close this issue since we got the translation process running.

Status of translations: https://translations.react.dev/
How to start a new translation: https://github.com/reactjs/translations.react.dev

[ysh199882]

We've updated the translation checklist issue across all repositories, fixed some lost translated pages, and fixed the global progress tracker at https://translations.react.dev/ to show the status of new translations!我们更新了所有存储库的翻译清单问题，修复了一些丢失的翻译页面，并修复了 https://translations.react.dev/ 上的全局进度跟踪器以显示新翻译的状态！

Hello,

I am a loyal user of React. I would like to contribute to the translation of the React documentation. However, I noticed that there used to be a progress indicator for Simplified Chinese translation in this image, but now it's gone. Was there any particular reason for this change?

[smikitky]

Hi, I think many translators are still following this issue, so let me introduce this this small tool to translate OGP images stored as public/images/og-*.png. Such images are used by Facebook and other SNS.

https://codesandbox.io/p/sandbox/react-ogp-image-generator-8299gn

You can generate images like this in 30 seconds:

RTL and composite fonts are not supported, but you can edit the source code to suit your needs.

[smikitky]

By the way, if there are translators who are wondering why the new translations are not showing up on Google, please refer to #6260.

[tdd]

Thank you for this! Just used it for the FR translation 😉

[fabiarias]

I would like to help with the translate.