Mengawali Petualangan Koding dengan JavaScript: Siap-Siap Jadi Developer Kece!

Halo, teman-teman! Gimana kabarnya hari ini? Semoga tetap semangat, ya, apalagi kalau kalian lagi siap-siap belajar JavaScript! Nah, di artikel kali ini, kita akan mulai petualangan seru bareng JavaScript, si bahasa pemrograman yang bikin halaman web jadi hidup dan interaktif. Kalau selama ini kalian lihat website yang bisa di-klik, geser, atau beranimasi, itu semua berkat JavaScript.

Kali ini kita bakal bahas pengenalan JavaScript, mulai dari apa itu JavaScript, cara kita bisa menjalankannya di browser, sampai bikin program pertama kita! Tenang aja, teman-teman nggak perlu jadi jago matematika buat bisa mulai. Yuk, langsung aja kita mulai!

Apa Itu JavaScript?

Pertama-tama, JavaScript itu bukan nama baru di dunia pemrograman. Dia udah jadi teman setia para developer web sejak lama. Tapi jangan bingung ya, JavaScript beda sama Java (yang bikin kopi sih). JavaScript adalah bahasa pemrograman yang digunakan untuk menambahkan interaktivitas di website, kayak tombol yang bisa di-klik, form yang bisa diisi, dan masih banyak lagi.

Singkatnya, JavaScript adalah "dalang" di balik layar website. Kalau HTML itu kayak rangka dari sebuah gedung, dan CSS itu cat serta dekorasinya, JavaScript adalah lampu yang bisa nyala-mati otomatis, pintu otomatis, bahkan lift yang bisa naik-turun sesuai perintah!

Menjalankan JavaScript di Browser

Nah, gimana cara kita menjalankan JavaScript? Gampang banget! Kalian nggak perlu install software aneh-aneh. Cukup pakai browser kesayangan kalian, kayak Google Chrome, Firefox, atau yang lainnya.

1. Buka browser – Misal, pakai Google Chrome.
2. Buka DevTools – Caranya, klik kanan di sembarang tempat di halaman web, lalu pilih “Inspect” atau tekan Ctrl+Shift+I di Windows (atau Cmd+Option+I di Mac).
3. Buka Tab Console – Di bagian DevTools, pilih tab “Console”. Nah, di sinilah kita bisa menulis dan menjalankan JavaScript!

Sekarang kita coba ketik ini di Console, ya:

console.log("Hello, teman-teman!");
    

Nanti akan muncul tulisan "Hello, teman-teman!" di Console. Mudah banget, kan?

Mengenal Variabel: Tempat Nyimpen Data

Oke, mari lanjut ke langkah berikutnya. Di JavaScript, kita butuh variabel untuk menyimpan data. Anggap aja variabel ini kayak kotak tempat kita taruh barang. Kita bisa simpan apa aja di dalamnya, entah itu angka, teks, atau nilai-nilai lainnya.

Ada tiga cara kita bisa bikin variabel di JavaScript: pakai var, let, atau const. Gampangnya, var adalah cara lama, let adalah cara baru yang lebih fleksibel, dan const buat variabel yang nggak boleh berubah.

let nama = "Budi";
let umur = 25;

console.log("Nama saya " + nama + " dan saya berumur " + umur + " tahun.");
    

Kalau kalian jalankan kode di atas di Console, nanti akan muncul tulisan: "Nama saya Budi dan saya berumur 25 tahun." Gampang, kan?

Tipe Data: Apa Sih yang Bisa Kita Simpan?

Nah, sekarang kita ngomongin soal tipe data. Di JavaScript, ada beberapa tipe data yang bisa kita gunakan:

• String – Ini tipe data buat teks. Harus diapit pakai tanda kutip, misalnya: "Halo Dunia".
• Number – Buat angka, kayak: 123, 3.14.
• Boolean – Ini tipe data buat nilai benar atau salah: true atau false.

Contohnya, kalau kita bikin variabel kayak tadi, kita punya string buat nama, dan number buat umur.

let nama = "Budi";  // String
let umur = 25;  // Number
let isMahasiswa = true;  // Boolean
    

Operator: Matematika Santai Ala JavaScript

Di JavaScript, kita bisa pakai operator buat mengerjakan perhitungan. Tenang aja, hitungannya santai kok, nggak harus jadi jago matematika. Ada operator penjumlahan (+), pengurangan (-), perkalian (*), dan pembagian (/). Contohnya kayak gini:

let a = 10;
let b = 5;

let hasilPenjumlahan = a + b;
let hasilPengurangan = a - b;

console.log("Hasil Penjumlahan: " + hasilPenjumlahan);  // Output: 15
console.log("Hasil Pengurangan: " + hasilPengurangan);  // Output: 5
    

Program Sederhana: Yuk, Bikin Kalkulator Mini!

Sekarang, kita gabungkan semuanya jadi satu, dan bikin program sederhana. Kita bakal bikin kalkulator mini yang bisa menjumlahkan dua angka. Program ini bisa kita jalankan langsung di browser, tapi kita juga bisa pakai file HTML biar lebih keren.

Buat File index.html

Kita buat file bernama index.html dan tambahkan kode berikut di dalamnya:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Kalkulator Mini</title>
</head>
<body>
    <h1>Kalkulator Mini</h1>

    <label for="angka1">Angka 1: </label>
    <input type="number" id="angka1">

    <label for="angka2">Angka 2: </label>
    <input type="number" id="angka2">

    <button onclick="hitung()">Hitung!</button>

    <p id="hasil">Hasilnya akan muncul di sini.</p>

    <script>
        function hitung() {
            let angka1 = document.getElementById("angka1").value;
            let angka2 = document.getElementById("angka2").value;

            let hasil = parseInt(angka1) + parseInt(angka2);
            document.getElementById("hasil").innerHTML = "Hasil: " + hasil;
        }
    </script>
</body>
</html>
    

Kesimpulan: JavaScript Itu Mudah dan Seru!

Nah, gimana, teman-teman? Sudah mulai paham kan tentang JavaScript? Dari cara menjalankan kode di browser sampai bikin kalkulator mini, kita udah belajar banyak hal. Yang paling penting, JavaScript itu asyik banget dan fleksibel buat bikin halaman web jadi lebih interaktif.

Ingat, JavaScript itu kayak pisau Swiss Army-nya dunia web. Dengan belajar bahasa ini, teman-teman bisa membuat website yang keren, interaktif, dan tentu aja lebih fungsional. Jadi, jangan ragu buat terus eksplorasi, coba hal-hal baru, dan latihan!

Yuk, terus belajar dan bikin kode keren bareng JavaScript! Terima kasih sudah baca sampai sini, teman-teman! Let's code and have fun!

---

List Part Artikel