> For the complete documentation index, see [llms.txt](https://trastanechora.gitbook.io/belajar-javascript/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://trastanechora.gitbook.io/belajar-javascript/peralatan-belajar.md).

# Persiapan Belajar

## Peralatan Belajar

### 1. Web Browser / Peramban Web

Kita akan menggunakan *web browser* untuk melakukan pembelajaran JavaScript ini, sangat dianjurkan untuk memakai *web browser* yang memiliki fitur *inspect page*. Beberapa list yang direkomendasikan adalah:

* Google Chrome: <https://www.google.com/chrome/>
* Mozilla Firefox: <https://www.mozilla.org/en-US/firefox/>
* Opera: <https://www.opera.com/download>

{% hint style="info" %}
**Sangat dianjurkan untuk memakai Google Chrome (versi terbaru)**. Karena fitur bawaannya yang sudah sangat mendukung kita untuk belajar dan bekerja. Di sepanjang pembelajaran ini kita akan memakai Google Chrome untuk ilustrasi ataupun demo.
{% endhint %}

### 2. Text Editor / Pengolah Text

Text editor ini boleh apa saja yang penting nyaman, **dianjurkan untuk memakai&#x20;*****code editor*****&#x20;yang memiliki penyorot sintaks&#x20;*****(syntax highlighter)*** untuk dapat membaca kode dengan lebih mudah dan meminimalisir kesalahan. Beberapa list yang direkomendasikan adalah:

* VSCode: <https://code.visualstudio.com/download>
* Atom: <https://atom.io/>
* Sublime: <https://www.sublimetext.com/>
* WebStorm: <https://www.jetbrains.com/webstorm/>

{% hint style="info" %}
**Sangat dianjurkan untuk memakai VSCode (versi terbaru)**. Karena selain tidak berbayar alias gratis, VSCode juga sudah sangat memenuhi standard dan bisa dikustomisasi berdasarkan keinginan kita jika suatu saat dibutuhkan.
{% endhint %}

## Menjalankan Script

Pada pembelajaran JavaScript ini kita akan memakai tag `<script>` yang ada pada file HTML.  Ingat, yang penting dari contoh-contoh yang akan kita bahas hanyalah yang ada di dalam tag `<script></script>` saja ya! Sebagai contoh:

{% tabs %}
{% tab title="coba.html" %}

```markup
<html>
  <body>
    <script>
      console.log('Halo Dunia!');
    </script>
  </body>
</html>
```

{% endtab %}
{% endtabs %}

> ^ Contoh sederhana file HTML dengan JavaScript di dalamnya

Kita tinggal simpan kode di atas dengan nama misalkan **contoh.html** kemudian kita buka file tersebut dengan *web browser* kita.

## Melihat Hasil / Output

**Pada pembelajaran JavaScript ini kita akan menggunakan console pada web browser untuk melihat hasil atau output dari kode yang kita tulis.** Untuk membuka panel console ini, klik kanan pada halaman di Chrome atau tekan F12 lalu akan muncul sebuah panel di sebelah kanan, kemudian pindahkan *inspect* pada tab console.  Seperti pada **contoh.html** di atas, kita akan mendapatkan output seperti berikut:

![Contoh output dari coba.html ketika dijalankan](/files/-MdcrrryQ0YTrMZsvTVd)

Ada beberapa tipe varian output menggunakan console, yang digunakan berdasarkan tujuan atau pembe, 3 yang paling sering digunakan yaitu: log, warn dan error.

{% tabs %}
{% tab title="coba.html" %}

```markup
<html>
  <body>
    <script>
      console.log('Halo Dunia!');
      console.warn('Halo Dunia!');
      console.error('Halo Dunia!');
    </script>
  </body>
</html>
```

{% endtab %}
{% endtabs %}

![Contoh output console.log(), console.warn() dan console.error() secara berurutan](/files/-MdcsI3qNoj_ZE2leRZr)

Selain itu kita juga akan menggunakan **prompt()** untuk melakukan input. Contoh untuk kasus mengambil input nama:

{% tabs %}
{% tab title="coba.html" %}

```markup
<html>
  <body>
    <script>
      prompt('Tuliskan namamu:');
    </script>
  </body>
</html>
```

{% endtab %}
{% endtabs %}

![Output dari contoh kode promt di atas](/files/-MdC_O1xkz9ibp1AT5lG)
