Skip to content

Commit ab1d594

Browse files
authored
docs: use consistent capitalisation of "JavaScript" (#475)
1 parent 055079b commit ab1d594

File tree

1 file changed

+10
-10
lines changed

1 file changed

+10
-10
lines changed

src/content/learn/your-first-component.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -31,9 +31,9 @@ Di dalam *web*, HTML memungkinkan kita membuat dokumen-dokumen terstruktur yang
3131
</article>
3232
```
3333

34-
*Markup* ini merepresentasikan artikel `<article>`, heading `<h1>` dan daftar isi (yang disingkat) sebagai daftar yang tersusun `<ol>`. *Markup* seperti ini, digabung dengan CSS untuk *style*, dan *Javascript* untuk interaktivitas, berada di belakang setiap *sidebar*, *avatar*, *modal*, *dropdown*—setiap potongan UI yang Anda liat di dalam *web*.
34+
*Markup* ini merepresentasikan artikel `<article>`, heading `<h1>` dan daftar isi (yang disingkat) sebagai daftar yang tersusun `<ol>`. *Markup* seperti ini, digabung dengan CSS untuk *style*, dan JavaScript untuk interaktivitas, berada di belakang setiap *sidebar*, *avatar*, *modal*, *dropdown*—setiap potongan UI yang Anda liat di dalam *web*.
3535

36-
React memungkinkan Anda menggabung *markup*, CSS, dan *Javascript* Anda menjadi "komponen" yang dibuat khusus, **elemen UI yang dapat digunakan kembali untuk aplikasi Anda.** Daftar isi yang Anda lihat di atas dapat diubah menjadi sebuah komponen `<TableOfContents />` yang dapat Anda *render* pada setiap halaman. Dari belakang, itu tetap menggunakan *tag* HTML yang sama seperti `<article>`, `h1`, dll.
36+
React memungkinkan Anda menggabung *markup*, CSS, dan JavaScript Anda menjadi "komponen" yang dibuat khusus, **elemen UI yang dapat digunakan kembali untuk aplikasi Anda.** Daftar isi yang Anda lihat di atas dapat diubah menjadi sebuah komponen `<TableOfContents />` yang dapat Anda *render* pada setiap halaman. Dari belakang, itu tetap menggunakan *tag* HTML yang sama seperti `<article>`, `h1`, dll.
3737

3838
Sama seperti *tag* HTML, Anda dapat menggabung, mengurut, dan menyusun bertingkat komponen untuk mendesain halaman penuh. Misalnya, halaman dokumentasi ini yang Anda baca terbuat oleh komponen-komponen React:
3939

@@ -55,7 +55,7 @@ Seiring berkembangnya proyek Anda, Anda akan memperhatikan bahwa banyak desain A
5555

5656
## Mendefinisikan suatu komponen {/*defining-a-component*/}
5757

58-
Secara tradisional saat menciptakan halaman *web*, para pengembang *web* me-*mark-up* konten mereka kemudian menambahkan interaksi dengan sedikit *Javascript*. Ini bekerja dengan baik ketika interaksi hanya menyenangkan-untuk-dimiliki di dalam *web*. Sekarang ini diharapkan banyak situs dan semua aplikasi. React mengutamakan interaktivitas dengan tetap menggunakan teknologi yang sama: **Sebuah komponen React adalah sebuah fungsi _Javascript_ yang dapat Anda _tambahkan dengan markup_.** Inilah tampilannya (Anda bisa sunting contoh di bawah ini):
58+
Secara tradisional saat menciptakan halaman *web*, para pengembang *web* me-*mark-up* konten mereka kemudian menambahkan interaksi dengan sedikit JavaScript. Ini bekerja dengan baik ketika interaksi hanya menyenangkan-untuk-dimiliki di dalam *web*. Sekarang ini diharapkan banyak situs dan semua aplikasi. React mengutamakan interaktivitas dengan tetap menggunakan teknologi yang sama: **Sebuah komponen React adalah sebuah fungsi _JavaScript_ yang dapat Anda _tambahkan dengan markup_.** Inilah tampilannya (Anda bisa sunting contoh di bawah ini):
5959

6060
<Sandpack>
6161

@@ -80,21 +80,21 @@ Dan ini bagaimana cara membuat sebuah komponen:
8080

8181
### Langkah 1: Eksport komponennya {/*step-1-export-the-component*/}
8282

83-
awalan `export default` adalah sebuah [sintaksis *Javascript* standar](https://developer.mozilla.org/docs/web/javascript/reference/statements/export) (tidak spesifik kepada React). Itu memungkinkan Anda menandai fungsi utama di sebuah file supaya Anda bisa mengimport itu dari *file-file* lain nantinya. (Lebih lanjut tentang mengimport di [Mengimport dan Mengeksport Komponen](/learn/importing-and-exporting-components)!)
83+
awalan `export default` adalah sebuah [sintaksis JavaScript standar](https://developer.mozilla.org/docs/web/javascript/reference/statements/export) (tidak spesifik kepada React). Itu memungkinkan Anda menandai fungsi utama di sebuah file supaya Anda bisa mengimport itu dari *file-file* lain nantinya. (Lebih lanjut tentang mengimport di [Mengimport dan Mengeksport Komponen](/learn/importing-and-exporting-components)!)
8484

8585
### Langkah 2: Definisikan fungsinya {/*step-2-define-the-function*/}
8686

87-
Dengan `function Profile() { }` Anda mendefinisikan fungsi *Javascript* dengan nama `Profile`.
87+
Dengan `function Profile() { }` Anda mendefinisikan fungsi JavaScript dengan nama `Profile`.
8888

8989
<Pitfall>
9090

91-
Komponen React adalah fungsi *Javascript* biasa, tetapi **nama mereka harus dimulai dengan huruf kapital** atau tidak akan berfungsi!
91+
Komponen React adalah fungsi JavaScript biasa, tetapi **nama mereka harus dimulai dengan huruf kapital** atau tidak akan berfungsi!
9292

9393
</Pitfall>
9494

9595
### Langkah 3: Tambahkan *markup* {/*step-3-add-markup*/}
9696

97-
Komponen itu mengembalikan *tag* `<img />` dengan atribut `src` dan `alt`. `<img />` ditulis seperti HTML, tetapi ini sebenarnya merupakan *Javascript* di belakang! Sintaksis ini disebut [JSX](/learn/writing-markup-with-jsx), dan ini memungkinkan Anda untuk *embed* *markup* di dalam *Javascript*.
97+
Komponen itu mengembalikan *tag* `<img />` dengan atribut `src` dan `alt`. `<img />` ditulis seperti HTML, tetapi ini sebenarnya merupakan JavaScript di belakang! Sintaksis ini disebut [JSX](/learn/writing-markup-with-jsx), dan ini memungkinkan Anda untuk *embed* *markup* di dalam JavaScript.
9898

9999
Pernyataan-pernyataan yang dikembalikan bisa ditulis semua pada satu baris, seperti dalam komponen ini.
100100

@@ -172,7 +172,7 @@ Dan `Profile` berisi lebih banyak HTML: `<img />`. Pada akhirnya, inilah yang di
172172

173173
### Menyusun secara bertingkat dan mengorganisir komponen {/*nesting-and-organizing-components*/}
174174

175-
Komponen adalah fungsi *Javascript* biasa, sehingga Anda bisa menjaga beberapa komponen di dalam *file* yang sama. Ini nyaman ketika komponen-komponen relatif kecil atau saling terkait secara erat. Jika *file* ini menjadi ramai, Anda selalu bisa memindahkan `Profile` kepada suatu *file* yang beda. Anda akan belajar bagaimana cara melakukan ini segera di [halaman tentang import.](/learn/importing-and-exporting-components)
175+
Komponen adalah fungsi JavaScript biasa, sehingga Anda bisa menjaga beberapa komponen di dalam *file* yang sama. Ini nyaman ketika komponen-komponen relatif kecil atau saling terkait secara erat. Jika *file* ini menjadi ramai, Anda selalu bisa memindahkan `Profile` kepada suatu *file* yang beda. Anda akan belajar bagaimana cara melakukan ini segera di [halaman tentang import.](/learn/importing-and-exporting-components)
176176

177177
Karena komponen-komponen `Profile` di-*render* di dalam `Gallery`—bahkan beberapa kali!—kita dapat mengatakan bahwa `Gallery` adalah sebuah **komponen induk,** yang me-*render* setiap `Profile` sebagai sebuah "anak". Ini merupakan bagian ajaib dari React: Anda bisa mendefinisikan suatu komponen sekali, kemudian digunakan di banyak tempat dan sebanyak kali yang Anda suka.
178178

@@ -215,7 +215,7 @@ Aplikasi React Anda dimulai dari suatu komponen "*root*". Biasanya, itu dibuat s
215215

216216
Sebagian besar aplikasi React menggunakan komponen sampai ke bawah. Ini berarti Anda tidak akan hanya menggunakan komponen untuk bagian-bagian yang dapat digunakan kembali seperti tombol, tetapi juga bagian-bagian yang lebih besar seperti *sidebar*, daftar, dan juga, halaman lengkap! Komponen adalah sebuah cara yang praktis untuk mengorganisir kode UI dan *markup*, bahkan jika beberapa darinya hanya digunakan sekali.
217217

218-
[*Framework-framework* berbasis React](/learn/start-a-new-react-project) mengambil ini selangkah lebih jauh. Daripada menggunakan sebuah *file* HTML yang kosong dan membiarkan React untuk "mengambil alih" dalam mengelola halamannya dengan *Javascript*, mereka *juga* membuat HTML-nya secara otomatis dari komponen-komponen React Anda. Ini memungkinkan aplikasi Anda menampilkan beberapa konten sebelum kode *Javascript* dimuat.
218+
[*Framework-framework* berbasis React](/learn/start-a-new-react-project) mengambil ini selangkah lebih jauh. Daripada menggunakan sebuah *file* HTML yang kosong dan membiarkan React untuk "mengambil alih" dalam mengelola halamannya dengan JavaScript, mereka *juga* membuat HTML-nya secara otomatis dari komponen-komponen React Anda. Ini memungkinkan aplikasi Anda menampilkan beberapa konten sebelum kode JavaScript dimuat.
219219

220220
Namun, banyak *website* hanya menggunakan React untuk [menambahkan interaktivitas kepada halaman HTML yang sudah ada.](/learn/add-react-to-an-existing-project#using-react-for-a-part-of-your-existing-page) Mereka memiliki banya komponen *root* daripada satu untuk seluruh halaman. Anda dapat menggunakan React sebanyaknya-banyaknya—atau sesedikit mungkin—sesuai dengan yang dibutuhkan.
221221

@@ -227,7 +227,7 @@ Anda baru saja mendapatkan rasa pertama Anda dari React! Mari kita rekap beberap
227227

228228
* React memungkinkan Anda untuk membuat komponen, **elemen UI yang dapat digunakan kembali untuk aplikasi Anda**
229229
* Dalam suatu aplikasi React, setiap bagian dari UI adalah sebuah komponen.
230-
* Komponen React adalah fungsi *Javascript* biasa kecuali:
230+
* Komponen React adalah fungsi JavaScript biasa kecuali:
231231

232232
1. Nama mereka selalu dimulai dengan huruf kapital.
233233
2. Mereka selalu mengembalikan *markup* JSX.

0 commit comments

Comments
 (0)