New Hindi Translation Progress

[arshadkazmi42]

ReactJs - Hindi Documentation - New Site

Maintainer List

• @saranshkataria
• @arshadkazmi42

For New Translators

To translate a page:

1. Check that no one else has claimed your page in the checklist and comments below.
2. Comment below with the name of the page you would like to translate. Please take only one page at a time.
3. Clone this repo, translate your page, and submit a pull request!

Before contributing, read the glossary and style guide (once they exist) to understand how to translate various technical and React-specific terms.

Please be prompt with your translations! If you find find that you can't commit any more, let the maintainers know so they can assign the page to someone else

Main Content

To do before releasing as an "official" translation. Please translate these pages first.

Note that each section has an index page, which needs to be translated too.

Learn React

• Quick Start (@tnniras )

  • Tutorial: Tic Tac Toe (@saurabhsri108 )
  • Thinking in React (@USKhokhar )

• Installation (@khizarq313 ) React "Installation" page translated into hindi. #243

  • Start a New React Project (@Johnn837 ) Add files via upload #255
  • Add React to an Existing Project (@MayankPrasher )
  • Editor Setup (@Subramanyarao11 ) Translated editor-setup page to hindi #246
  • Using TypeScript (@sohail-313 ) docs: Translate "Using TypeScript" page to Hindi #266
  • React Developer Tools (@Anishpras ) Beta react developer tools translation done #174

• Describing the UI

  • Your First Component (@Akshit1025 ) Translated your first component #204
  • Importing and Exporting Components (@ujvaljoshi )
  • Writing Markup with JSX (@Anku5hk ) Translated Writing Markup with JSX Page #198
  • JavaScript in JSX with Curly Braces (@lucifertrj ) Hindi translation to this page is complete, pushing for review #175
  • Passing Props to a Component (@sanskar-mk2 ) Added hindi translation for Passing props to a component #199
  • Conditional Rendering (@sanchit36 ) conditional rendering page, done translation till line 258 #176 conditional rendering page translation #177
  • Rendering Lists (@lucifertrj )
  • Keeping Components Pure

• Adding Interactivity

  • Responding to Events (@tushgaurav )
  • State: A Component's Memory (@MayurSMahajan ) Translation for "State: A Component's Memory". Solves issue #208 #209
  • Render and Commit (@Rohan-Makwana ) Translated Render & Commit Page #179
  • State as a Snapshot (@PriyankaBelhekar77 ) Translate State as a Snapshot #236
  • Queueing a Series of State Updates (@anaskhan28 )
  • Updating Objects in State (@Akshat2Jain ) translated till line 50 #211
  • Updating Arrays in State (@DeepshikaS )

• Managing State

  • Reacting to Input with State (@Kalyan-velu )
  • Choosing the State Structure (@BrijenMakwana ) translation of choosing-the-state-structure page in Hindi #221
  • Sharing State Between Components (@BryanRonad ) Translation for "Sharing State Between Components" #212
  • Preserving and Resetting State (@gunadhya11 ) preserving and resetting state #293
  • Extracting State Logic into a Reducer (@GyanPrakashRaj )
  • Passing Data Deeply with Context (@gunadhya11 )
  • Scaling Up with Reducer and Context

• Escape Hatches

  • Referencing Values with Refs (@khizarq313 ) referencing-values-with-refs translated in hindi #229
  • Manipulating the DOM with Refs
  • Synchronizing with Effects
  • You Might Not Need an Effect
  • Lifecycle of Reactive Effects
  • Separating Events from Effects
  • Removing Effect Dependencies
  • Reusing Logic with Custom Hooks

API Reference

• react: Hooks

  • useCallback
  • useContext
  • useDebugValue
  • useDeferredValue
  • useEffect (@Rajvardhan222 )
  • useId
  • useImperativeHandle
  • useInsertionEffect
  • useLayoutEffect
  • useMemo
  • useReducer
  • useRef
  • useState
  • useSyncExternalStore
  • useTransition

• react: Components

  • <Fragment> (<>)
  • <Profiler>
  • <StrictMode>
  • <Suspense>

• react: APIs

  • createContext
  • forwardRef
  • lazy
  • memo
  • startTransition

• react-dom: Components

  • Common (e.g. <div>)
  • <input>
  • <option>
  • <progress>
  • <select>
  • <textarea>

• react-dom: APIs

  • createPortal
  • flushSync
  • findDOMNode
  • hydrate
  • render
  • unmountComponentAtNode

• react-dom/client: Client APIs

  • createRoot
  • hydrateRoot

• react-dom/server: Server APIs

  • renderToNodeStream
  • renderToPipeableStream
  • renderToReadableStream
  • renderToStaticMarkup
  • renderToStaticNodeStream
  • renderToString

Navigation and UI

We suggest to leave most of the UI translation until the end. We plan to do some invasive changes to the website folder layout and components, so postponing this until your translation is almost complete would make it easier to merge the changes from our side later. It might make sense to translate the homepage above the fold early, but leave the rest for later. As individual pages get translated, you can change the page titles in the corresponding sidebar files. Finally, when you're translating the navigation, make sure to test both desktop and mobile layouts.

• Homepage (currently in HomeContent.js)
• Sidebars (currently in src/sidebar*.json)
• Top-level navigation (currently in TopNav.tsx)

When You're Ready...

After everything above is translated, add your language to deployedLanguages in Seo.tsx of the original reactjs/react.dev repository.

Secondary Content

These API pages should ideally be translated too, but they're less urgent and can be done after the others:

• Legacy React APIs
  • Children
  • cloneElement
  • Component
  • createElement
  • createFactory
  • createRef
  • isValidElement
  • PureComponent

Optional Content

These aren't the main translation targets, but if you'd like to do them, feel free to expand the list to include their subpages:

• Community
• Blog
• Warnings

[NegiAkash890]

Hi @arshadkazmi42 can I do translations for the blog and community pages ?

[arshadkazmi42]

@NegiAkash890 We are yet to update this issue with all details. But you can go ahead start. Just FYI, we are starting with transaction of pages in beta folder.

[arshadkazmi42]

@NegiAkash890 please select pages from the live above which have a ✅ added to it.

[NegiAkash890]

@NegiAkash890 please select pages from the live above which have a ✅ added to it.

Ok. I will start with translation.

[kumard3]

can you please assign me Thinking in React page

[arshadkazmi42]

can you please assign me Thinking in React page

Go ahead. I have assigned the page to you

[NegiAkash890]

Hi @arshadkazmi42 I am almost done with translation for the Start a new React Project page translation can I work on the Your First Component page side by side?

[arshadkazmi42]

@NegiAkash890
Lets get one page merge then we can move to next pages. We don't want alot of pending PRs. :)

You can pick up a new page, once current page is merged.

[lucifertrj]

Can you please assign Form page or Create A New React App to me? As you mentioned I will open a pull request after a current page is merged

[arshadkazmi42]

Hi @lucifertrj

We are only translating the page in the issues list. Can you pick one page from the list above.

[lucifertrj]

Hello @arshadkazmi42
Can you assign me Javascript in JSX with Curly Braces page

[arshadkazmi42]

Pages assigned. go ahead

[Anishpras]

@arshadkazmi42 Can you assign me the react developers tool page?

[arshadkazmi42]

Page assigned

[Anishpras]

Page assigned

Thank you.

[Anishpras]

@arshadkazmi42 Can you assign me the editor setup page?

[arshadkazmi42]

@Anishpras Page assigned.

[lucifertrj]

I have completed the translation of the JavaScript In JSX Curly Bracket page. Can you assign me the Rendering Lists Page? @arshadkazmi42

[arshadkazmi42]

Hi @lucifertrj Lets first get your open PR reviewed and closed. Then you can take up a new page.

[sanchit36]

Hey @arshadkazmi42 can i work on Conditional Rendering page.

[arshadkazmi42]

Hey @arshadkazmi42 can i work on Conditional Rendering page.

@sanchit36 Go ahead. I have assigned the page to you

[arshadkazmi42]

@arshadkazmi42 , please assign 'Preserving and Resetting State' page to me.

@gunadhya11 page assigned

[gunadhya11]

@arshadkazmi42 i am facing this issue. Am i missing anything?
ERROR: Permission to reactjs/hi.react.dev.git denied to gunadhya11.
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.

[arshadkazmi42]

@gunadhya11 Are you getting this issue in cloning or pushing? Make sure you fork the repository and work on the forked version and then create the PR.

Here is small guide on how to contribute to GitHub repositories https://github.com/firstcontributions/first-contributions

[tnniras]

@tnniras Assigned Quick Start Page

Working on this.

[MayankPrasher]

@arshadkazmi42 please assign me "Add React to an Existing Project" for translation.

[arshadkazmi42]

@arshadkazmi42 please assign me "Add React to an Existing Project" for translation.

@MayankPrasher page assigned

[MayankPrasher]

@arshadkazmi42 i'm facing this error while running it locally

[gunadhya11]

hi @arshadkazmi42 , please assign 'Passing Data Deeply with Context' this topic to me.

[arshadkazmi42]

@gunadhya11 Page assigned. Just to let you know, we will first review and close the first PR before starting on the second, but feel free to translate and create a PR.

[arshadkazmi42]

@MayankPrasher Have you tried running

• yarn install
• yarn run dev

also can you share your node version and yarn version which you are using.

[MayankPrasher]

@arshadkazmi42 , i tried yarn install and yarn run dev and my node version is 22.7.0 and yarn version is 1.2.1 but still facing same error

[arshadkazmi42]

Can you provide more logs from console if you have any? Otherwise you can also make changes to the file in GitHub. Just press . in the GitHub repository and that will be open web version of VSCode. That will help you edit the file online.

[MayankPrasher]

I did it through GitHub.
but still let me tell you what the error is, it says author and description not specified in hi.react.dev\src\content\blog\index.md.

[epandey]

can i help ?

[arshadkazmi42]

@epandey Sure. You can choose a page from the list above which you would like to translate. I will assign the page to you and you can start translating that page.

[Rajvardhan222]

I am willing to transalate useEffect page can I do that.

[arshadkazmi42]

@Rajvardhan222 page assigned.

[Rajvardhan222]

Can you please show me the steps to get that file. If i am wrong .
I have to translate useEffect.md

And I am not able to run the project locally getting some errors..

[arshadkazmi42]

@Rajvardhan222 this is the file https://github.com/reactjs/hi.react.dev/blob/main/src/content/reference/react/useEffect.md

Can you share some details about the error you are getting

[Rajvardhan222]

https://github.com/Rajvardhan222/hi.react.dev/blob/translating/useEffect.md/src/content/reference/react/useEffect.md?plain=1

I have translated the heading and when should i creake a PR after full page translation or in parts.

And error is gone i am not getting it now.

[arshadkazmi42]

create PR will full page translation

[Milan-960]

I am willing to transalate the page but not sure which one to start from. can you point me what are the pages that needs to be done?

[arshadkazmi42]

@Milan-960 There is list of pages which needs to be translated mentioned in the issue description. You can pick one and let me know I can assign that page to you.

[harshitphoenix]

Hey @arshadkazmi42
I am Harshit Yadav, a Full Stack Engineer from India.
I have very strong hand in frontend development and have more than 3 years of experience in frontend engineering. I would like get started contributing to the project.
Please assign me issues/task.

[arshadkazmi42]

@harshitphoenix This repository is for Hindi translation and only task we have here is for translating the pages listed in the issues in Hindi.

If you would like to contribute, feel free to pick a page (which is not already taken) from the list in the description of the issue and let me know. I will assign the page to you and you can work on translating it in Hindi.

[tushgaurav]

Can you assign "Responding to Events" page to me?

[arshadkazmi42]

@tushgaurav page assigned

[tnniras]

Hello @arshadkazmi42

Have we ever considered using material-mkdocs to translate the documents and later modify if required?

I've seen that material-mkdocs is being used for many open source projects.

[arshadkazmi42]

@tnniras That sounds promising. I haven't tried it before but was looking for something like that to do the translation in a go and then fix it in follow up PRs.

Do you have any example or sample on how to use it? Does it can do English to Hindi translation?

[tnniras]

@arshadkazmi42
I'm also exploring this.

I'm contributing to Rocky Linux and realised that they are using [crowdin](https://crowdin.com/) for their document translations.