🎯 Tujuan

Menguasai dasar JavaScript untuk membuat kode sederhana yang dapat berfungsi di halaman web, seperti perhitungan dasar atau perubahan tampilan secara interaktif.

⏰ Konteks

Panduan ini ditujukan bagi pemula JavaScript yang sudah mengenal sedikit tentang HTML dan CSS.

🪵 Hal yang Diperlukan

1. Code Editor: Visual Studio Code (VSCode)
2. Pemahaman HTML & CSS dasar
3. Browser: Google Chrome
4. File HTML

📋 Langkah-Langkah

1. Kenali Dasar HTML dan Penulisan JavaScript JavaScript dapat ditulis langsung dalam file HTML menggunakan tag <script>. Misalnya:

   <script>
     console.log("Halo, dunia!");
   </script>
   

2. Implementasi JavaScript Dasar, Variabel:

   • Menyimpan nilai seperti angka atau teks untuk digunakan di program. Gunakan let atau const.

     Contoh:

     let nama = "Andi";
     const usia = 30;
     

3. Tipe Data:

   • Gunakan String (teks), Number (angka), Boolean (benar/salah), Array (daftar), atau Object (data kompleks). Contoh:

     let isActive = true;
     let buah = ["Apel", "Jeruk", "Pisang"];
     let orang = { nama: "Andi", umur: 30 };
     

4. Operator:

   • Lakukan perhitungan atau perbandingan dengan operator seperti +, , ==, ===, &&, ||. Contoh:

     let hasil = 5 + 10;  // 15
     

5. Fungsi (Function):

   • Kumpulan kode yang menjalankan tugas tertentu. Contoh:

     function salam(nama) {
       return "Halo " + nama;
     }
     console.log(salam("Diandra"));  // Output: Halo Diandra
     

6. Kontrol Alur:

   • Gunakan if (percabangan), for (perulangan), atau while untuk mengatur alur. Contoh:

     let usia = 18;
     if (usia >= 18) {
       console.log("Anda dewasa.");
     } else {
       console.log("Anda belum dewasa.");
     }
     

7. Praktik Proyek Sederhana, Proyek Mini (Kalkulator Sederhana):

   • Gunakan elemen input HTML untuk memasukkan angka, dan JavaScript untuk menjumlahkan. Tampilkan hasilnya di halaman. Contoh:

     function hitungPenjumlahan(a, b) {
       return a + b;
     }
     

8. Debugging:

   • Gunakan console.log() di Console browser untuk memeriksa data atau mencari kesalahan. Misalnya:

     console.log("Nilai variabel:", variabel);
     

Kesimpulan

1. Pemahaman Dasar: Tutorial ini memberikan pemahaman dasar tentang JavaScript bagi pemula, mengedepankan konsep penting seperti variabel, tipe data, fungsi, dan kontrol alur.