Skip to content

Commit b239ae1

Browse files
authored
docs: changes merender to me-*render* (#503)
1 parent cdeed81 commit b239ae1

File tree

8 files changed

+50
-50
lines changed

8 files changed

+50
-50
lines changed

src/content/learn/describing-the-ui.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -314,7 +314,7 @@ Baca **[Mengoper Props ke sebuah Komponen](/learn/passing-props-to-a-component)*
314314

315315
</LearnMore>
316316

317-
## Merender Secara Kondisional {/*conditional-rendering*/}
317+
## Me-render Secara Kondisional {/*conditional-rendering*/}
318318

319319
Komponen Anda seringkali perlu menampilkan hal-hal yang berbeda tergantung pada kondisi yang berbeda. Di React, Anda dapat me-*render* JSX secara kondisional menggunakan sintaks JavaScript seperti `if` *statements*, `&&`, dan `?:` operator.
320320

@@ -358,11 +358,11 @@ export default function PackingList() {
358358

359359
<LearnMore path="/learn/conditional-rendering">
360360

361-
Baca **[Merender Secara Kondisional](/learn/conditional-rendering)** untuk mempelajari cara merender konten secara kondisional.
361+
Baca **[Me-*render* Secara Kondisional](/learn/conditional-rendering)** untuk mempelajari cara me-*render* konten secara kondisional.
362362

363363
</LearnMore>
364364

365-
## Merender List {/*rendering-lists*/}
365+
## Me-render List {/*rendering-lists*/}
366366

367367
Anda akan sering ingin menampilkan beberapa komponen serupa dari koleksi data. Anda dapat menggunakan `filter()` dan `map()` dari JavaScript dengan React untuk menyaring dan mentransformasikan senarai data Anda menjadi senarai komponen.
368368

@@ -458,7 +458,7 @@ h2 { font-size: 20px; }
458458

459459
<LearnMore path="/learn/rendering-lists">
460460

461-
Baca **[Merender List](/learn/rendering-lists)** untuk mempelajari cara me-*render* daftar komponen dan cara memilih `key`.
461+
Baca **[Me-*render* List](/learn/rendering-lists)** untuk mempelajari cara me-*render* daftar komponen dan cara memilih `key`.
462462

463463
</LearnMore>
464464

src/content/learn/importing-and-exporting-components.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ Keajaiban komponen terletak pada kemampuannya yang dapat digunakan kembali: Anda
2020

2121
## File komponen root {/*the-root-component-file*/}
2222

23-
Pada [Komponen Pertama Anda](/learn/your-first-component), Anda membuat komponen `Profile` dan komponen `Gallery` yang merender:
23+
Pada [Komponen Pertama Anda](/learn/your-first-component), Anda membuat komponen `Profile` dan komponen `Gallery` yang me-*render*:
2424

2525
<Sandpack>
2626

@@ -252,7 +252,7 @@ Pada halaman ini Anda belajar:
252252

253253
Saat ini, `Gallery.js` mengekspor kedua `Profile` dan `Gallery`, yang mana sedikit membingungkan.
254254

255-
Pindahkan komponen `Profile` pada miliknya sendiri `Profile.js`, dan ubah komponen `App` untuk merender kedua `<Profile />` dan `<Gallery />` satu setelah lainnya.
255+
Pindahkan komponen `Profile` pada miliknya sendiri `Profile.js`, dan ubah komponen `App` untuk me-*render* kedua `<Profile />` dan `<Gallery />` satu setelah lainnya.
256256

257257
Anda mungkin menggukanan salah satu dari **default** atau **named** eskpor untuk `Profile`, tetapi pastikan bahwa Anda menggunakan sintaksis impor pada kedua `App.js` dan `Gallery.js`. Anda dapat merujuk pada table dari bagian **deep dive** di atas:
258258

src/content/learn/tutorial-tic-tac-toe.md

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -303,7 +303,7 @@ Sekarang mari kita lihat file-file dalam kode awal.
303303

304304
#### `App.js` {/*appjs*/}
305305

306-
Kode dalam `App.js` membuat sebuah _komponen_. Dalam React, komponen adalah bagian dari kode yang dapat digunakan kembali yang merepresentasikan bagian dari antarmuka pengguna. Komponen digunakan untuk merender, mengelola, dan memperbarui elemen UI dalam aplikasi Anda. Mari kita lihat komponen ini baris demi baris untuk melihat apa yang terjadi:
306+
Kode dalam `App.js` membuat sebuah _komponen_. Dalam React, komponen adalah bagian dari kode yang dapat digunakan kembali yang merepresentasikan bagian dari antarmuka pengguna. Komponen digunakan untuk me-*render*, mengelola, dan memperbarui elemen UI dalam aplikasi Anda. Mari kita lihat komponen ini baris demi baris untuk melihat apa yang terjadi:
307307

308308
```js {1}
309309
export default function Square() {
@@ -524,7 +524,7 @@ export default function Board() {
524524
}
525525
```
526526

527-
Kemudian Anda akan memperbarui komponen Board untuk merender komponen `Square` tersebut dengan menggunakan sintaksis JSX:
527+
Kemudian Anda akan memperbarui komponen Board untuk me-*render* komponen `Square` tersebut dengan menggunakan sintaksis JSX:
528528

529529
```js {5-19}
530530
// ...
@@ -581,7 +581,7 @@ Ups, ini bukan yang Anda inginkan:
581581

582582
![papan berisikan value](../images/tutorial/board-filled-with-value.png)
583583

584-
Anda ingin merender variabel JavaScript yang disebut `value` dari komponen Anda, bukan kata "value". Untuk "melarikan diri ke dalam JavaScript" dari JSX, Anda memerlukan kurung kurawal. Tambahkan tanda kurung kurawal di sekitar `nilai` di JSX seperti ini:
584+
Anda ingin me-*render* variabel JavaScript yang disebut `value` dari komponen Anda, bukan kata "value". Untuk "melarikan diri ke dalam JavaScript" dari JSX, Anda memerlukan kurung kurawal. Tambahkan tanda kurung kurawal di sekitar `nilai` di JSX seperti ini:
585585

586586
```js {2}
587587
function Square({ value }) {
@@ -797,7 +797,7 @@ function Square() {
797797
}
798798
```
799799
800-
Dengan memanggil fungsi `set` ini dari handler `onClick`, Anda memberi tahu React untuk merender ulang `Square` setiap kali `<button>` diklik. Setelah pembaruan, nilai `Square` akan menjadi `'X'`, sehingga Anda akan melihat "X" pada papan permainan. Klik pada kotak mana pun, dan "X" akan muncul:
800+
Dengan memanggil fungsi `set` ini dari handler `onClick`, Anda memberi tahu React untuk me-*render* ulang `Square` setiap kali `<button>` diklik. Setelah pembaruan, nilai `Square` akan menjadi `'X'`, sehingga Anda akan melihat "X" pada papan permainan. Klik pada kotak mana pun, dan "X" akan muncul:
801801
802802
![menambahkan x ke papan permainan](../images/tutorial/tictac-adding-x-s.gif)
803803
@@ -1357,7 +1357,7 @@ Hasilnya sama, tetapi dengan tidak melakukan mutasi (mengubah data yang mendasar
13571357
13581358
Immutability membuat fitur-fitur yang kompleks menjadi lebih mudah untuk diimplementasikan. Kemudian dalam tutorial ini, Anda akan mengimplementasikan fitur "perjalanan waktu" yang memungkinkan Anda meninjau sejarah game dan "melompat kembali" ke gerakan sebelumnya. Fungsionalitas ini tidak spesifik untuk gim--kemampuan untuk membatalkan dan mengulang tindakan tertentu adalah persyaratan umum untuk aplikasi. Menghindari mutasi data secara langsung memungkinkan Anda menyimpan data versi sebelumnya, dan menggunakannya kembali nanti.
13591359
1360-
Ada juga manfaat lain dari immutability. Secara default, semua komponen anak di-*render* ulang secara otomatis ketika state komponen induk berubah. Hal ini termasuk komponen anak yang tidak terpengaruh oleh perubahan tersebut. Meskipun perenderan ulang tidak dengan sendirinya terlihat oleh pengguna (Anda tidak boleh secara aktif mencoba menghindarinya!), Anda mungkin ingin melewatkan perenderan ulang bagian dari pohon komponen yang jelas tidak terpengaruh oleh perubahan tersebut karena alasan kinerja. Immutability membuatnya sangat murah bagi komponen untuk membandingkan apakah datanya telah berubah atau tidak. Anda dapat mempelajari lebih lanjut tentang bagaimana React memilih kapan harus merender ulang sebuah komponen di [referensi API `memo`](/reference/react/memo).
1360+
Ada juga manfaat lain dari immutability. Secara default, semua komponen anak di-*render* ulang secara otomatis ketika state komponen induk berubah. Hal ini termasuk komponen anak yang tidak terpengaruh oleh perubahan tersebut. Meskipun perenderan ulang tidak dengan sendirinya terlihat oleh pengguna (Anda tidak boleh secara aktif mencoba menghindarinya!), Anda mungkin ingin melewatkan perenderan ulang bagian dari pohon komponen yang jelas tidak terpengaruh oleh perubahan tersebut karena alasan kinerja. Immutability membuatnya sangat murah bagi komponen untuk membandingkan apakah datanya telah berubah atau tidak. Anda dapat mempelajari lebih lanjut tentang bagaimana React memilih kapan harus me-*render* ulang sebuah komponen di [referensi API `memo`](/reference/react/memo).
13611361
13621362
### Bergiliran {/*taking-turns*/}
13631363
@@ -1749,9 +1749,9 @@ Anda akan menyimpan senarai `squares` sebelumnya dalam senarai lain yang disebut
17491749
17501750
Sekarang Anda akan menulis komponen tingkat atas baru yang disebut `Game` untuk menampilkan daftar gerakan sebelumnya. Di situlah Anda akan menempatkan state `history` yang berisi riwayat permainan.
17511751
1752-
Menempatkan state `history` ke dalam komponen `Game` akan membuat Anda dapat menghapus state `squares` dari komponen `Board` turunannya. Sama seperti Anda "mengangkat state" dari komponen `Square` ke dalam komponen `Board`, sekarang Anda akan mengangkatnya dari `Board` ke dalam komponen `Game` tingkat atas. Hal ini memberikan komponen `Game` kontrol penuh atas data `Board` dan memungkinkannya menginstruksikan `Board` untuk merender giliran sebelumnya dari `history`.
1752+
Menempatkan state `history` ke dalam komponen `Game` akan membuat Anda dapat menghapus state `squares` dari komponen `Board` turunannya. Sama seperti Anda "mengangkat state" dari komponen `Square` ke dalam komponen `Board`, sekarang Anda akan mengangkatnya dari `Board` ke dalam komponen `Game` tingkat atas. Hal ini memberikan komponen `Game` kontrol penuh atas data `Board` dan memungkinkannya menginstruksikan `Board` untuk me-*render* giliran sebelumnya dari `history`.
17531753
1754-
Pertama, tambahkan komponen `Game` dengan `export default`. Buatlah ia merender komponen `Board` dan beberapa markup:
1754+
Pertama, tambahkan komponen `Game` dengan `export default`. Buatlah ia me-*render* komponen `Board` dan beberapa markup:
17551755
17561756
```js {1,5-16}
17571757
function Board() {
@@ -1785,7 +1785,7 @@ export default function Game() {
17851785
17861786
Perhatikan bagaimana `[Array(9).fill(null)]` adalah sebuah senarai dengan satu item, yang merupakan senarai dari 9 buah `null`.
17871787
1788-
Untuk merender kotak untuk pergerakan saat ini, Anda perlu membaca senarai kotak terakhir dari `history`. Anda tidak membutuhkan `useState` untuk ini - Anda sudah memiliki informasi yang cukup untuk menghitungnya selama render:
1788+
Untuk me-*render* kotak untuk pergerakan saat ini, Anda perlu membaca senarai kotak terakhir dari `history`. Anda tidak membutuhkan `useState` untuk ini - Anda sudah memiliki informasi yang cukup untuk menghitungnya selama render:
17891789
17901790
```js {4}
17911791
export default function Game() {
@@ -2021,7 +2021,7 @@ body {
20212021
20222022
Karena Anda merekam riwayat permainan *tic-tac-toe* ini, Anda sekarang dapat menampilkan daftar gerakan sebelumnya kepada pemain.
20232023
2024-
Elemen React seperti `<button>` adalah objek JavaScript biasa; Anda dapat mengopernya di dalam aplikasi Anda. Untuk merender beberapa item di React, Anda dapat menggunakan senarai elemen-elemen React.
2024+
Elemen React seperti `<button>` adalah objek JavaScript biasa; Anda dapat mengopernya di dalam aplikasi Anda. Untuk me-*render* beberapa item di React, Anda dapat menggunakan senarai elemen-elemen React.
20252025
20262026
Anda telah memiliki sebuah senarai `history` yang merupakan sejarah gerakan dalam state, jadi sekarang Anda perlu mengubahnya menjadi sebuah array elemen React. Dalam JavaScript, untuk mengubah satu senarai menjadi senarai lainnya, Anda dapat menggunakan metode [array `map`:](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
20272027
@@ -2249,7 +2249,7 @@ Untuk saat ini, Anda akan melihat daftar gerakan yang terjadi di dalam game dan
22492249
22502250
### Memilih key {/*picking-a-key*/}
22512251
2252-
Ketika Anda merender sebuah list, React menyimpan beberapa informasi tentang setiap item list yang di-render. Ketika Anda memperbarui list, React perlu menentukan apa yang telah berubah. Anda bisa saja menambahkan, menghapus, mengatur ulang, atau memperbarui item pada list.
2252+
Ketika Anda me-*render* sebuah list, React menyimpan beberapa informasi tentang setiap item list yang di-render. Ketika Anda memperbarui list, React perlu menentukan apa yang telah berubah. Anda bisa saja menambahkan, menghapus, mengatur ulang, atau memperbarui item pada list.
22532253
22542254
Bayangkan pergantian dari
22552255
@@ -2509,7 +2509,7 @@ function handlePlay(nextSquares) {
25092509
}
25102510
```
25112511
2512-
Terakhir, Anda akan memodifikasi komponen `Game` untuk merender gerakan yang sedang dipilih, alih-alih selalu merender gerakan terakhir:
2512+
Terakhir, Anda akan memodifikasi komponen `Game` untuk me-*render* gerakan yang sedang dipilih, alih-alih selalu me-*render* gerakan terakhir:
25132513
25142514
```js {5}
25152515
export default function Game() {

src/content/reference/react/createContext.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,7 @@ function App() {
150150
}
151151
```
152152

153-
Sekarang komponen `Page` dan semua komponen didalamnya, tidak peduli seberapa dalam, akan "melihat" nilai konteks yang diberikan. Jika nilai konteks yang diberikan berubah, React akan merender ulang komponen yang membaca konteks tersebut.
153+
Sekarang komponen `Page` dan semua komponen didalamnya, tidak peduli seberapa dalam, akan "melihat" nilai konteks yang diberikan. Jika nilai konteks yang diberikan berubah, React akan me-*render* ulang komponen yang membaca konteks tersebut.
154154

155155
[Baca lebih lanjut tentang membaca dan memberikan konteks dan lihat contohnya.](/reference/react/useContext)
156156

0 commit comments

Comments
 (0)