Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: translation for useId #524

Merged
merged 9 commits into from Jul 30, 2023
Merged

Conversation

AndriP8
Copy link
Contributor

@AndriP8 AndriP8 commented May 1, 2023

Closes #402

Description

Translate the useId page.
Page URL: https://id.react.dev/reference/react/useId

src/content/reference/react/useId.md Outdated Show resolved Hide resolved
src/content/reference/react/useId.md Outdated Show resolved Hide resolved
@github-actions
Copy link

github-actions bot commented May 1, 2023

Size changes

📦 Next.js Bundle Analysis for react-dev

This analysis was generated by the Next.js Bundle Analysis action. 🤖

This PR introduced no changes to the JavaScript bundle! 🙌

Copy link
Collaborator

@zainfathoni zainfathoni left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

More terms to introduce in the glossary, @resir014 @r17x @mhaidarhanif @mazipan

English Indonesian
hardcode kode keras (?), menuliskan secara langsung di dalam kode
server rendering pe-render-an pada server
prefix awalan
suffix akhiran

Let's discuss them here: #337 (comment)


#### Caveats {/*caveats*/}

* `useId` is a Hook, so you can only call it **at the top level of your component** or your own Hooks. You can't call it inside loops or conditions. If you need that, extract a new component and move the state into it.
* `useId` adalah sebuah Hook, jadi Anda hanya dapat memanggilnya **di tingkat atas komponen Anda** atau Hook Anda sendiri. Anda tidak dapat memanggilnya di dalam loop atau kondisi. Jika Anda membutuhkannya, ekstrak komponen baru dan pindahkan *state* ke dalamnya.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
* `useId` adalah sebuah Hook, jadi Anda hanya dapat memanggilnya **di tingkat atas komponen Anda** atau Hook Anda sendiri. Anda tidak dapat memanggilnya di dalam loop atau kondisi. Jika Anda membutuhkannya, ekstrak komponen baru dan pindahkan *state* ke dalamnya.
* `useId` adalah sebuah Hook, jadi Anda hanya dapat memanggilnya **di tingkat teratas komponen Anda** atau Hook Anda sendiri. Anda tidak dapat memanggilnya di dalam perulangan (*loops*) atau kondisi (*conditions*). Jika Anda membutuhkannya, ekstrak komponen baru dan pindahkan *state* ke dalamnya.

src/content/reference/react/useId.md Outdated Show resolved Hide resolved
@@ -96,7 +95,7 @@ In regular HTML, you would write it like this:
</p>
```

However, hardcoding IDs like this is not a good practice in React. A component may be rendered more than once on the page--but IDs have to be unique! Instead of hardcoding an ID, generate a unique ID with `useId`:
Namun, memaksakan ID seperti ini bukanlah praktik yang baik di React. Sebuah komponen dapat dirender lebih dari sekali pada halaman—namun ID harus unik! Alih-alih melakukan pemaksaan ID, buat ID unik dengan `useId`:
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Namun, memaksakan ID seperti ini bukanlah praktik yang baik di React. Sebuah komponen dapat dirender lebih dari sekali pada halaman—namun ID harus unik! Alih-alih melakukan pemaksaan ID, buat ID unik dengan `useId`:
Namun, menuliskan ID secara langsung di dalam kode (*hardcoding*) seperti ini bukanlah praktik yang baik di React. Sebuah komponen dapat dirender lebih dari sekali pada halaman—namun ID harus unik! Alih-alih melakukan pemaksaan ID, bangkitkan sebuah ID unik dengan `useId`:


<Pitfall>

With [server rendering](/reference/react-dom/server), **`useId` requires an identical component tree on the server and the client**. If the trees you render on the server and the client don't match exactly, the generated IDs won't match.
Dengan [rendering server](/reference/react-dom/server), **`useId` membutuhkan pohon komponen yang identik di server dan klien**. Jika pohon yang Anda render di server dan klien tidak sama persis, ID yang dihasilkan tidak akan cocok.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
Dengan [rendering server](/reference/react-dom/server), **`useId` membutuhkan pohon komponen yang identik di server dan klien**. Jika pohon yang Anda render di server dan klien tidak sama persis, ID yang dihasilkan tidak akan cocok.
Dengan [pe-*render*-an pada *server*](/reference/react-dom/server), **`useId` membutuhkan pohon komponen yang identik di *server* dan klien**. Jika pohon yang Anda *render* di *server* dan klien tidak sama persis, ID yang dihasilkan tidak akan cocok.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I didn't fix it because the word pe-*render*-an is still under discussion

src/content/reference/react/useId.md Outdated Show resolved Hide resolved
src/content/reference/react/useId.md Outdated Show resolved Hide resolved
src/content/reference/react/useId.md Outdated Show resolved Hide resolved
src/content/reference/react/useId.md Outdated Show resolved Hide resolved
src/content/reference/react/useId.md Outdated Show resolved Hide resolved
@r17x
Copy link
Collaborator

r17x commented May 7, 2023

Need to re-check @zainfathoni

src/content/reference/react/useId.md Outdated Show resolved Hide resolved
@mazipan
Copy link
Collaborator

mazipan commented May 8, 2023

Waiting your approval, @zainfathoni

@zainfathoni
Copy link
Collaborator

Okay, I'll review it tonight.

Copy link
Collaborator

@zainfathoni zainfathoni left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for addressing some of my previously requested changes.
Here is another review of the unaddressed change requests.

src/content/reference/react/useId.md Outdated Show resolved Hide resolved
src/content/reference/react/useId.md Outdated Show resolved Hide resolved
src/content/reference/react/useId.md Outdated Show resolved Hide resolved
src/content/reference/react/useId.md Outdated Show resolved Hide resolved
@AndriP8 AndriP8 requested a review from zainfathoni May 10, 2023 01:51
@r17x
Copy link
Collaborator

r17x commented Jun 29, 2023

@zainfathoni need to recheck latest changes

@resir014
Copy link
Member

@zainfathoni do you have time for re-review?

@zainfathoni
Copy link
Collaborator

@zainfathoni do you have time for re-review?

Yes, I will have some time to review this weekend. Sorry for the delay. 🙏

Copy link
Collaborator

@zainfathoni zainfathoni left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approved with a minor suggestion. 💯
Thanks for making the requested changes! 🙏

src/content/reference/react/useId.md Outdated Show resolved Hide resolved
@zainfathoni zainfathoni merged commit 49a97ac into reactjs:main Jul 30, 2023
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

useId
6 participants