ReactDOM Translation

content/docs/reference-react-dom.md

@@ -6,53 +6,53 @@ category: Reference
 permalink: docs/react-dom.html
 ---
 
-If you load React from a `<script>` tag, these top-level APIs are available on the `ReactDOM` global. If you use ES6 with npm, you can write `import ReactDOM from 'react-dom'`. If you use ES5 with npm, you can write `var ReactDOM = require('react-dom')`.
+Jika Anda memuat React dari sebuah `<script>` *tag*, API-API tingkat atas ini terdapat di `ReactDOM` *global*. Jika Anda menggunakan ES6 dengan npm, Anda dapat mengetik `import ReactDOM from 'react-dom'`. Jika Anda menggunakan ES5 dengan npm, Anda dapat mengetik `var ReactDOM = require('react-dom')`.
 
-## Overview {#overview}
+## Ikhtisar {#overview}
 
-The `react-dom` package provides DOM-specific methods that can be used at the top level of your app and as an escape hatch to get outside of the React model if you need to. Most of your components should not need to use this module.
+*Package* `react-dom` menyediakan metode-metode spesifik DOM yang dapat digunakan di tingkat atas aplikasi Anda, juga sebagai jalan untuk keluar dari React *model* jika diperlukan. Pada umumnya komponen-komponen Anda tidak memerlukan modul ini.
 
 - [`render()`](#render)
 - [`hydrate()`](#hydrate)
 - [`unmountComponentAtNode()`](#unmountcomponentatnode)
 - [`findDOMNode()`](#finddomnode)
 - [`createPortal()`](#createportal)
 
-### Browser Support {#browser-support}
+### Dukungan *Browser* {#browser-support}
 
-React supports all popular browsers, including Internet Explorer 9 and above, although [some polyfills are required](/docs/javascript-environment-requirements.html) for older browsers such as IE 9 and IE 10.
+React mendukung semua *browser* populer, termasuk Internet Explorer 9 dan setelahnya, meskipun [memerlukan beberapa *polyfills*](/docs/javascript-environment-requirements.html) untuk *browser*-*browser* usang seperti IE 9 dan IE 10.
 
-> Note
+> Catatan
 >
-> We don't support older browsers that don't support ES5 methods, but you may find that your apps do work in older browsers if polyfills such as [es5-shim and es5-sham](https://github.com/es-shims/es5-shim) are included in the page. You're on your own if you choose to take this path.
+> Kami tidak mendukung *browser*-*browser* usang yang tidak mendukung metode-metode ES5, tapi Anda mungkin menemukan bahwa aplikasi-aplikasi Anda ternyata dapat berjalan di *browser*-*browser* usang jika *polyfills* seperti [es5-shim dan es5-sham](https://github.com/es-shims/es5-shim) disertakan di halaman web. Kami tidak dapat membantu Anda jika Anda melakukan ini.
 
 * * *
 
-## Reference {#reference}
+## Referensi {#reference}
 
 ### `render()` {#render}
 
 ```javascript
 ReactDOM.render(element, container[, callback])
 ```
 
-Render a React element into the DOM in the supplied `container` and return a [reference](/docs/more-about-refs.html) to the component (or returns `null` for [stateless components](/docs/components-and-props.html#functional-and-class-components)).
+Me-*render* sebuah elemen React ke dalam DOM di dalam `container` yang diberikan dan mengembalikan sebuah [referensi](/docs/more-about-refs.html) kepada komponen (atau mengembalikan `null` untuk [stateless components](/docs/components-and-props.html#functional-and-class-components)).
 
-If the React element was previously rendered into `container`, this will perform an update on it and only mutate the DOM as necessary to reflect the latest React element.
+Jika elemen React tersebut sebelumnya di-*render* ke dalam `container`, ini akan memperbaruinya dan hanya mengubah DOM seperlunya untuk memperlihatkan elemen React terbaru.
 
-If the optional callback is provided, it will be executed after the component is rendered or updated.
+Jika *callback* opsional diberikan, *callback* ini akan dijalankan setelah komponen di-*render* atau diperbarui.
 
-> Note:
+> Catatan:
 >
-> `ReactDOM.render()` controls the contents of the container node you pass in. Any existing DOM elements inside are replaced when first called. Later calls use React’s DOM diffing algorithm for efficient updates.
+> `ReactDOM.render()` mengendalikan isi dari *container node* yang Anda berikan. Semua elemen-elemen DOM yang ada di dalam diganti pada saat dipanggil pertama kali. Panggilan-panggilan berikutnya menggunakan algoritma pembeda DOM dari React untuk pembaruan yang efisien.
 >
-> `ReactDOM.render()` does not modify the container node (only modifies the children of the container). It may be possible to insert a component to an existing DOM node without overwriting the existing children.
+> `ReactDOM.render()` tidak memodifikasi *container node* (hanya memodifikasi anak-anak dari *container*). Hal tersebut memungkinkan kita untuk memasukkan sebuah komponen ke dalam sebuah *DOM node* yang ada tanpa menimpa anak-anaknya.
 >
-> `ReactDOM.render()` currently returns a reference to the root `ReactComponent` instance. However, using this return value is legacy
-> and should be avoided because future versions of React may render components asynchronously in some cases. If you need a reference to the root `ReactComponent` instance, the preferred solution is to attach a
-> [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute) to the root element.
+> `ReactDOM.render()` pada saat ini mengembalikan sebuah referensi ke *root* `ReactComponent` *instance*. Tetapi, penggunaan hasil fungsi ini adalah usang
+> dan harus dihindari karena React versi-versi berikutnya mungkin akan me-*render* komponen-komponen secara *asynchronous* dalam beberapa situasi tertentu. Jika Anda memerlukan referensi ke *root* `ReactComponent` *instance*, solusi yang disarankan adalah dengan melampirkan sebuah
+> [callback ref](/docs/more-about-refs.html#the-ref-callback-attribute) ke elemen dasar.
 >
-> Using `ReactDOM.render()` to hydrate a server-rendered container is deprecated and will be removed in React 17. Use [`hydrate()`](#hydrate) instead.
+> Menggunakan `ReactDOM.render()` untuk mengisi sebuah *container* yang di-*render* *server* dianggap usang dan akan tidak berlaku lagi di React 17. Sebaiknya gunakan [`hydrate()`](#hydrate).
 
 * * *
 
@@ -62,15 +62,15 @@ If the optional callback is provided, it will be executed after the component is
 ReactDOM.hydrate(element, container[, callback])
 ```
 
-Same as [`render()`](#render), but is used to hydrate a container whose HTML contents were rendered by [`ReactDOMServer`](/docs/react-dom-server.html). React will attempt to attach event listeners to the existing markup.
+Sama seperti [`render()`](#render), tapi digunakan untuk meng-*hidrasi* sebuah *container* yang isi HTML-nya di-*render* oleh [`ReactDOMServer`](/docs/react-dom-server.html). React akan mencoba untuk melampirkan *event listeners* ke *markup* yang ada.
 
-React expects that the rendered content is identical between the server and the client. It can patch up differences in text content, but you should treat mismatches as bugs and fix them. In development mode, React warns about mismatches during hydration. There are no guarantees that attribute differences will be patched up in case of mismatches. This is important for performance reasons because in most apps, mismatches are rare, and so validating all markup would be prohibitively expensive.
+React mengharapkan bahwa isi yang di-*render* adalah sama antara *server* dan klien. React dapat memperbaiki perbedaan dalam isi teks, tetapi Anda harus menganggap ketidakcocokan sebagai kesalahan dan memperbaikinya. Dalam mode *development*, React memperingatkan tentang ketidakcocokan pada saat *hidrasi*. Tidak ada jaminan bahwa perbedaan atribut akan diperbaiki jika terjadi ketidakcocokan. Ini penting untuk alasan-alasan kinerja karena dalam aplikasi-aplikasi pada umumnya, ketidakcocokan jarang terjadi, dan memeriksa semua *markup* akan amat sangat berat.
 
-If a single element's attribute or text content is unavoidably different between the server and the client (for example, a timestamp), you may silence the warning by adding `suppressHydrationWarning={true}` to the element. It only works one level deep, and is intended to be an escape hatch. Don't overuse it. Unless it's text content, React still won't attempt to patch it up, so it may remain inconsistent until future updates.
+Jika atribut dari sebuah elemen atau isi tek berbeda antara *server* dan klien (contohnya, sebuah *timestamp*), Anda dapat membungkam *warning* dengan menambahkan `suppressHydrationWarning={true}` di elemen tersebut. Ini hanya dapat dilakukan pada kedalaman satu tingkat, dan dimaksudkan sebagai jalan keluar. Jangan disalahgunakan. Kecuali isi teksnya, React tidak akan mencoba untuk memperbaiki hal ini, jadi ini mungkin akan tetap tidak konsekuen sampai diperbarui di masa depan.
 
-If you intentionally need to render something different on the server and the client, you can do a two-pass rendering. Components that render something different on the client can read a state variable like `this.state.isClient`, which you can set to `true` in `componentDidMount()`. This way the initial render pass will render the same content as the server, avoiding mismatches, but an additional pass will happen synchronously right after hydration. Note that this approach will make your components slower because they have to render twice, so use it with caution.
+Jika Anda sengaja perlu untuk me-*render* sesuatu yang berbeda antara *server* dan klien, Anda dapat melakukan *two-pass rendering*. Komponen-komponen yang me-*render* sesuatu yang berbeda di klien dapat membaca sebuah *state variable* seperti `this.state.isClient`, dimana Anda dapat menetapkannya menjadi `true` di `componentDidMount()`. Dengan cara ini *render pass* pertama akan me-*render* isi yang sama dengan *server*, menghindari ketidakcocokan, tetapi sebuah *pass* tambahan akan terjadi secara sinkron, langsung setelah *hidrasi*. Perhatikan bahwa cara ini akan mengakibatkan komponen-komponen Anda lebih lambat karena mereka harus me-*render* dua kali, jadi gunakan dengan hati-hati.
 
-Remember to be mindful of user experience on slow connections. The JavaScript code may load significantly later than the initial HTML render, so if you render something different in the client-only pass, the transition can be jarring. However, if executed well, it may be beneficial to render a "shell" of the application on the server, and only show some of the extra widgets on the client. To learn how to do this without getting the markup mismatch issues, refer to the explanation in the previous paragraph.
+Ingatlah untuk berhati-hati dalam hal pengalaman pengguna (*user experience*) pada saat koneksi lambat. Kode JavaScript mungkin akan dimuat lebih lambat dari saat *render* HTML pertama kali, jadi jika Anda me-*render* sesuatu yang hanya ada di klien saja, transisinya bisa jadi kasar. Meskipun begitu, jika dieksekusi dengan baik, mungkin akan bermanfaat untuk me-*render* "*shell*" dari aplikasi di *server*, dan hanya menunjukkan beberapa *widget* ekstra di klien. Untuk belajar mengenai bagaimana melakukan ini tanpa mengalami masalah ketidakcocokan *markup*, lihat penjelasan di paragraf sebelumnya.
 
 * * *
 
@@ -80,28 +80,28 @@ Remember to be mindful of user experience on slow connections. The JavaScript co
 ReactDOM.unmountComponentAtNode(container)
 ```
 
-Remove a mounted React component from the DOM and clean up its event handlers and state. If no component was mounted in the container, calling this function does nothing. Returns `true` if a component was unmounted and `false` if there was no component to unmount.
+Membuang sebuah komponen React yang terpasang dari DOM dan membersihkan *event handlers* dan *state* terkait. Jika tidak terdapat komponen yang terpasang di dalam *container*, memanggil *function* ini tidak akan melakukan apa-apa. Mengembalikan `true` jika sebuah komponen berhasil dilepas dan `false` jika tidak ada komponen yang dilepas.
 
 * * *
 
 ### `findDOMNode()` {#finddomnode}
 
-> Note:
+> Catatan:
 >
-> `findDOMNode` is an escape hatch used to access the underlying DOM node. In most cases, use of this escape hatch is discouraged because it pierces the component abstraction. [It has been deprecated in `StrictMode`.](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
+> `findDOMNode` adalah sebuah jalan pintas yang digunakan untuk mengakses *DOM node* yang mendasari komponen tersebut. Dalam banyak kasus, penggunaan cara ini tidak disarankan karena dapat merusak abstraksi komponen. [Sudah tidak berlaku dalam `StrictMode`.](/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage)
 
 ```javascript
 ReactDOM.findDOMNode(component)
 ```
-If this component has been mounted into the DOM, this returns the corresponding native browser DOM element. This method is useful for reading values out of the DOM, such as form field values and performing DOM measurements. **In most cases, you can attach a ref to the DOM node and avoid using `findDOMNode` at all.**
+Jika komponen ini telah terpasang ke dalam DOM, mengembalikan elemen DOM asli *browser* yang terkait. Metode ini berguna untuk membaca nilai hasil dari DOM, seperti nilai-nilai isian form dan melakukan pengukuran DOM. **Pada umumnya, Anda dapat melampirkan sebuah referensi ke *DOM node* dan menghindari penggunaan `findDOMNode` sepenuhnya.**
 
-When a component renders to `null` or `false`, `findDOMNode` returns `null`. When a component renders to a string, `findDOMNode` returns a text DOM node containing that value. As of React 16, a component may return a fragment with multiple children, in which case `findDOMNode` will return the DOM node corresponding to the first non-empty child.
+Ketika sebuah komponen me-*render* menjadi `null` atau `false`, `findDOMNode` mengembalikan `null`. Ketika sebuah komponen me-*render* menjadi sebuah teks, `findDOMNode` mengembalikan sebuah *DOM node* teks dengan nilai teks tersebut sebagai isinya. Dimulai dari React 16, sebuah komponen dapat mengembalikan sebuah fragmen dengan banyak anak, dimana `findDOMNode` akan mengembalikan *DOM node* yang sesuai dengan anak pertama yang tidak kosong.
 
-> Note:
+> Catatan:
 >
-> `findDOMNode` only works on mounted components (that is, components that have been placed in the DOM). If you try to call this on a component that has not been mounted yet (like calling `findDOMNode()` in `render()` on a component that has yet to be created) an exception will be thrown.
+> `findDOMNode` hanya dapat digunakan pada komponen-komponen yang telah terpasang (dengan kata lain, komponen-komponen yang telah ditempatkan di dalam DOM). Jika Anda mencoba memanggil *function* ini pada sebuah komponen yang belum terpasang (seperti memanggil `findDOMNode()` di dalam `render()` dari sebuah komponen yang belum diciptakan), akan menghasilkan sebuah *exception*.
 >
-> `findDOMNode` cannot be used on function components.
+> `findDOMNode` tidak dapat digunakan pada komponen-komponen *function*.
 
 * * *
 
@@ -111,4 +111,4 @@ When a component renders to `null` or `false`, `findDOMNode` returns `null`. Whe
 ReactDOM.createPortal(child, container)
 ```
 
-Creates a portal. Portals provide a way to [render children into a DOM node that exists outside the hierarchy of the DOM component](/docs/portals.html).
+Membuat sebuah *portal*. *Portal* merupakan cara untuk [me-*render* anak-anak ke dalam sebuah *DOM node* yang berada diluar hirarki dari komponen DOM](/docs/portals.html).