requested changes applied

Author: handywijaya

content/docs/hooks-intro.md

@@ -31,7 +31,7 @@ function Example() {
 
 >Catatan
 >
-> React 16.8.0 adalah versi rilis pertama yang mendukung *Hooks*. Ketika meng-*upgrade*, jangan lupa untuk memperbarui semua *package*, termasuk React DOM. React Native akan mendukung *Hooks* di versi rilis stabil selanjutnya.
+> React 16.8.0 adalah versi rilis pertama yang mendukung *Hooks*. Ketika melakukan *upgrade*, jangan lupa untuk memperbarui semua *package*, termasuk React DOM. React Native akan mendukung *Hooks* di versi rilis stabil selanjutnya.
 
 ## Video Pengenalan {#video-introduction}
 
@@ -57,19 +57,19 @@ Sebelum kita melanjutkan, perlu diingat bahwa *Hooks*:
 
 ## Motivasi {#motivation}
 
-*Hooks* memecahkan berbagai masalah yang nampak tidak terhubung yang telah kami temui selama lima tahun menulis dan memelihara ribuan komponen di React. Tidak peduli apakah Anda mempelajari React, berinteraksi sehari-hari, atau bahkan menggunakan *library* yang menggunakan model komponen yang mirip, Anda mungkin juga menemukan beberapa masalah yang kami temui seperti di bawah.
+*Hooks* memecahkan berbagai masalah yang terlihat tidak berhubungan yang telah kami temui selama lima tahun menulis dan memelihara ribuan komponen di React. Tidak peduli apakah Anda mempelajari React, berinteraksi sehari-hari, atau bahkan menggunakan *library* yang menggunakan model komponen yang mirip, Anda mungkin juga menemukan beberapa masalah yang kami temui seperti di bawah.
 
 ### Kesulitan untuk menggunakan kembali *stateful logic* antar komponen {#its-hard-to-reuse-stateful-logic-between-components}
 
-React tidak memberikan cara untuk "melampirkan" perilaku yang dapat digunakan kembali ke sebuah komponen (misal, menghubungkan komponen ke sebuah *store*). Jika Anda sudah pernah menggunakan React, Anda mungkin sudah akrab dengan cara seperti [render props](/docs/render-props.html) dan [higher-order components](/docs/higher-order-components.html) untuk mengatasi masalah ini. Namun cara-cara tersebut mengharuskan Anda untuk merekstrukturisasi komponen, yang mana akan menimbulkan kerumitan dan kesulitan untuk mengikuti kode. Jika Anda melihat aplikasi React pada umumnya di React DevTools, Anda mungkin menemukan "wrapper hell" dari komponen-komponen yang dibungkus oleh berlapis-lapis *provider*, *consumer*, *higher-order component*, *render props*, dan abstraksi lainnya. Meski kita dapat [menyaring mereka di DevTools](https://github.com/facebook/react-devtools/pull/503), ternyata hal ini menunjukkan bahwa adanya masalah yang lebih mendasar: React memerlukan cara yang lebih praktis untuk membagikan *stateful logic*.
+React tidak memberikan cara untuk "melampirkan" perilaku yang dapat digunakan kembali ke sebuah komponen (misal, menghubungkan komponen ke sebuah *store*). Jika Anda sudah pernah menggunakan React, Anda mungkin sudah akrab dengan cara seperti [render props](/docs/render-props.html) dan [higher-order components](/docs/higher-order-components.html) untuk mengatasi masalah ini. Namun cara-cara tersebut mengharuskan Anda untuk merekstrukturisasi komponen, yang mana akan menimbulkan kerumitan dan kesulitan untuk mengikuti kode. Jika Anda melihat aplikasi React pada umumnya di React DevTools, Anda mungkin menemukan "wrapper hell" dari komponen-komponen yang dibungkus oleh lapisan-lapisan *provider*, *consumer*, *higher-order component*, *render props*, dan abstraksi lainnya. Meski kita dapat [menyaring mereka di DevTools](https://github.com/facebook/react-devtools/pull/503), ternyata hal ini menunjukkan bahwa adanya masalah yang lebih mendasar: React memerlukan cara yang lebih praktis untuk membagikan *stateful logic*.
 
 Dengan *Hooks*, Anda dapat mengekstrak *stateful logic* dari sebuah komponen sehingga dapat dilakukan *testing* secara independen dan digunakan kembali. **Hooks memperbolehkan Anda untuk menggunakan kembali *stateful logic* tanpa mengubah hirarki komponen.** Hal ini mempermudah untuk membagikan *Hooks* ke komponen-komponen atau ke komunitas.
 
 Kita akan membahas lebih lanjut mengenai hal ini di bagian [Membuat *Hooks* Anda sendiri](/docs/hooks-custom.html).
 
 ### Komponen kompleks menjadi sulit untuk dimengerti {#complex-components-become-hard-to-understand}
 
-Kita sering menemui kesulitan untuk memelihara komponen yang awalnya simpel, tetapi seiring berjalannya waktu berubah menjadi kompleks dengan *stateful logic* yang rumit dan efek samping-efek sampingnya. Setiap *lifecycle method* berisi campuran dari logika yang tidak berhubungan sama sekali. Contoh, komponen melakukan pengambilan data di `componentDidMount` dan `componentDidUpdate`. Namun, *method* `componentDidMount` yang sama juga terdapat logika yang tidak berkaitan, seperti memasang *event listener*, dengan permbersihannya yang dilakukan di `componentWillUnmount`. Kode yang berhubungan berjauhan, tetapi kode yang tidak berhubungan malah berada pada satu *method* yang sama. Hal ini rentan untuk menghasilkan *bug* dan ketidakkonsistenan.
+Kita sering menemui kesulitan untuk memelihara komponen yang awalnya sederhana, tetapi seiring berjalannya waktu berubah menjadi kompleks dengan *stateful logic* yang rumit dan berbagai efek samping. Setiap *lifecycle method* berisi campuran dari logika yang tidak berhubungan sama sekali. Contoh, komponen melakukan pengambilan data di `componentDidMount` dan `componentDidUpdate`. Namun, *method* `componentDidMount` yang sama juga terdapat logika yang tidak berkaitan, seperti memasang *event listener*, dengan permbersihannya yang dilakukan di `componentWillUnmount`. Kode yang berhubungan berjauhan, tetapi kode yang tidak berhubungan malah berada pada satu *method* yang sama. Hal ini rentan untuk menghasilkan *bug* dan ketidakkonsistenan.
 
 Dalam beberapa kasus tidak mungkin untuk memecah komponen menjadi beberapa komponen kecil karena *stateful logic* yang tersebar. Dan juga susah untuk diuji. Ini merupakan salah satu alasan bahwa banyak orang lebih memilih untuk mengkombinasikan React dengan *library* manajemen *state* yang lain. Sayangnya, hal tersebut menimbulkan abstraksi yang terlalu banyak, yang mengharuskan Anda untuk berpindah-pindah *file*, dan menggunakan ulang komponen yang sudah ada menjadi lebih sulit.
 
@@ -81,7 +81,7 @@ Kita akan membahas hal ini lebih lanjut di [Menggunakan Effect Hook](/docs/hooks
 
 Selain membuat penggunaan kode kembali dan pengorganisasian kode menjadi lebih sulit, kami mendapati bahwa kelas dan menjadi penghalang besar untuk mempelajari React. Anda harus memahami cara kerja `this` di Javascript, yang mana sangat berbeda dengan cara kerjanya di mayoritas bahasa lainnya. Anda perlu ingat untuk melakukan *bind* *event handler* yang ada. Tanpa [syntax proposals](https://babeljs.io/docs/en/babel-plugin-transform-class-properties/) yang tidak stabil, kode akan menjadi sangat bertele-tele. Orang dapat memahami *props*, *state*, dan alur data *top-down* dengan sangat baik namun tetap kesulitan dengan kelas. Perbedaan antara *function* dan komponen kelas di React serta kapan menggunakan salah satunya menghasilkan perbedaan pendapat bahkan antara developer React yang sudah berpengalaman.
 
-Selain itu, React sudah berumur sekitar lima tahun, dan kami ingin memastikannya untuk lima tahun ke depan lagi. Seperti [Svelte](https://svelte.technology/), [Angular](https://angular.io/), [Glimmer](https://glimmerjs.com/), dan yang lain perlihatkan, [ahead-of-time compilation](https://en.wikipedia.org/wiki/Ahead-of-time_compilation) dari komponen memiliki potensi di masa depan. Terutama apabila tidak terikat pada *template*. Akhir-akhir ini, kami sedang bereksperimen dengan [component folding](https://github.com/facebook/react/issues/7323) menggunakan [Prepack](https://prepack.io/), dan kami melihat hasil awal yang menjanjikan. Sayangnya, kami menemukan bahwa kelas komponen dapat menyebabkan pola yang tidak sengaja yang menyebabkan optimasi malah menjadi lebih lambat. Kelas membawa masalah pada alat-alat yang ada saat ini. Contohnya, kelas tidak dapat di-*minify* dengan baik, dan mereka membuat *hot reloading* menjadi rumit dan tidak dapat diandalkan. Kami ingin menunjukkan sebuah API yang akan membuat kode untuk tetap dapat dioptimasi dengan baik.
+Selain itu, React sudah berumur sekitar lima tahun, dan kami ingin memastikannya untuk lima tahun ke depan lagi. Seperti yang diperlihatkan [Svelte](https://svelte.technology/), [Angular](https://angular.io/), [Glimmer](https://glimmerjs.com/), [ahead-of-time compilation](https://en.wikipedia.org/wiki/Ahead-of-time_compilation) dari komponen memiliki potensi di masa depan. Terutama jika tidak terbatas oleh *template* saja. Akhir-akhir ini, kami sedang bereksperimen dengan [component folding](https://github.com/facebook/react/issues/7323) menggunakan [Prepack](https://prepack.io/), dan kami melihat hasil awal yang menjanjikan. Sayangnya, kami menemukan bahwa kelas komponen dapat menyebabkan pola yang tidak sengaja yang menyebabkan optimasi malah menjadi lebih lambat. Kelas membawa masalah pada alat-alat yang ada saat ini. Contohnya, kelas tidak dapat di-*minify* dengan baik, dan mereka membuat *hot reloading* menjadi rumit dan tidak dapat diandalkan. Kami ingin menunjukkan sebuah API yang akan membuat kode untuk tetap dapat dioptimasi dengan baik.
 
 Untuk mengatasi masalah ini, **Hooks membuat Anda mampu untuk menggunakan fitur React tanpa menggunakan kelas.** Konsepnya, React selalu dekat dengan fungsi. *Hooks* merangkul fungsi, tetapi tidak mengorbankan kepraktisan dari React. Hooks memberikan akses ke bagian-bagian penting dan tidak mengharuskan Anda untuk mempelajari teknik memrogram fungsional atau reaktif yang kompleks.
 
@@ -99,7 +99,7 @@ Kami juga mengerti bahwa permintaan untuk menambahkan fungsi dasasr baru ke Reac
 
 **Penting, Hooks bekerja berdampingan dengan kode yang sudah ada sehingga dapat diadopsi secara bertahap.** Tidak ada keharusan untuk cepat-cepat atau berpindah ke *Hooks*. Kami tidak merekomendasikan untuk melakukan "penulisan ulang kode yang besar", terutama untuk yang sudah ada, dengan kelas komponen yang kompleks. Ini membutuhkan sedikit perubahan pemikiran untuk mulai "berpikir dalam *Hooks*". Menurut kami, lebih baik untuk belajar menggunakan *Hooks* pada komponen yang baru dan tidak kritis, dan memastikan bahwa setiap orang dalam tim merasa nyaman untuk menggunakannya. Setelah Anda mencoba menggunakan *Hooks*, mohon bantuannya untuk [mengirimkan umpan balik ke kami](https://github.com/facebook/react/issues/new), positif maupun negatif.
 
-Kami ingin *Hooks* untuk mencakup setiap *use case* yang ada pada kelas, tetapi **kami akan tetap mendukung komponen kelas untuk masa depan yang bisa diduga.** Di Facbook, kami memiliki puluh ribuan komponen yang ditulis menjadi kelas, dan kami tidak memiliki rencana untuk menulis ulang. Sebagai gantinya, kami mulai untuk menggunakan *Hooks* untuk kode baru yang berjalan berdampingan dengan kelas.
+Kami ingin *Hooks* untuk mencakup setiap *use case* yang ada pada kelas, tetapi **kami akan tetap mendukung komponen kelas untuk kedepannya.** Di Facebook, kami memiliki puluhan ribu komponen yang ditulis menjadi kelas, dan kami tidak memiliki rencana untuk menulis ulang. Sebagai gantinya, kami mulai untuk menggunakan *Hooks* untuk kode baru yang berjalan berdampingan dengan kelas.
 
 ## Frequently Asked Questions {#frequently-asked-questions}