Javascript Game #2:
Menyiapkan Perlengkapan Perang: Buku Tulis Ajaib untuk Coding!
😂 Joke pembuka: "Kenapa coding nggak boleh bawa bekal? Soalnya udah ada Java di dalam script!" - Tetot coding 2024
Sebelum Berperang, Siapkan Dulu Perlengkapannya!
Hai petualang cilik! Di episode kemarin kita udah kenalan sama JavaScript si otak game. Nah, sekarang kita mau praktek langsung! Tapi... kamu nggak mungkin perang tanpa pedang kan? Atau main game tanpa controller?
Makanya, kita siapin dulu 3 SENJATA RAHASIA ini. Tenang, gampang kok nyiapinnya!
SENJATA #1: RAJA BROWSER - CHROME (atau teman-temannya)
Browser itu kayak mesin pembaca ajaib! Dia bisa membaca kode yang kita tulis dan mengubahnya menjadi game keren. Bayangin browser itu kayak TV-nya game.
Yang paling disarankan: Google Chrome (soalnya paling canggih urusan game). Tapi kalau punya Firefox, Edge, atau Opera juga boleh kok!
SENJATA #2: BUKU TULIS AJAIB - TEXT EDITOR
Nah kalau browser itu TV-nya, text editor ini adalah pensil dan buku tulis ajaib tempat kita menulis kode. Nggak perlu kertas beneran, cukup ketik di sini!
Rekomendasi: Visual Studio Code (VS Code) - ini yang paling canggih dan gratis! Ikonnya warna biru seperti 🔷.
💡 Tips: Minta tolong kakak/orang tua install VS Code di https://code.visualstudio.com/
Alternatif kalau belum bisa install: pake Notepad (bawaan Windows) atau Notepad++.
SENJATA #3: BUKU TULIS KOSONG - FILE HTML
Ini dia yang paling penting! Kita perlu file kosong tempat menyimpan kode ajaib kita. File ini istimewa karena punya ekstensi .html.
Bikin file HTML itu gampang banget, kayak buat file Word biasa, tapi bedanya kita tulis pake kode.
AYO PRAKTEK! Bikin File HTML Pertama
✨ IKUTIN LANGKAH-LANGKAH INI ✨
Buka Visual Studio Code atau Notepad. Kelihatan blank kan? Itu tandanya siap tempur!
Copy paste kode di bawah ini ke text editor kamu. Jangan takut salah, nanti kita pelajari artinya kok!
<html>
<head>
<title>Game Pertamaku</title>
</head>
<body>
<h1>Halo Dunia! Aku siap bikin game! 🎮</h1>
<script>
alert("Selamat datang di petualangan JavaScript!");
console.log("Ini pesan rahasia buat programmer");
</script>
</body>
</html>
📝 Catatan: Kode ini kayak mantra awal, nanti makin seru!
Klik File → Save As (atau Ctrl+S). Kasih nama bebas, tapi WAJIB diakhiri .html. Contoh:
❌ game_pertamaku.txt (SALAH! Nanti jadi file biasa)
Jangan lupa pilih tempat yang mudah dicari, misalnya di Desktop atau folder Dokumen.
Cari file yang barusan kamu simpan, terus klik 2 kali atau klik kanan → Open with → Chrome.
Nah, liat kan hasilnya? Harusnya muncul popup yang tulisannya "Selamat datang..." dan tulisan "Halo Dunia..." di halaman web.
Eksperimen Pertama: JavaScript Udah Jalan!
Di kode tadi, ada bagian <script> ... </script>. Nah, itu adalah tempat JavaScript bersembunyi! Coba deh ubah-ubah dikit:
// Ganti pesan ini sesuai keinginanmu!
alert("Aku jagoan coding! 🔥");
// Coba tambahin baris ini:
document.write("<h2>Ini tulisanku dari JavaScript!</h2>");
</script>
Simpan lagi (Ctrl+S) dan refresh browser (F5). Lihat perubahannya? Seru kan!
😂 Joke sambil coding: "Kenapa JavaScript selalu semangat? Karena setiap kali dia jalan, selalu console.log bahagia!"
Catatan Penting buat Petualang Cilik:
- 🔸 Jangan takut error! Error itu kayak monster di game - justru seru buat dikalahin!
- 🔸 Kalau nggak muncul apa-apa, cek lagi: udah simpan belum? Udah .html belum? Udah buka di browser belum?
- 🔸 Minta bantuan kakak atau guru kalau mentok. Programmer hebat juga pernah mentok kok!
- 🔸 Coba-coba terus! Makin sering nyoba, makin jago!
MISI BUAT KAMU:
- Buat file HTML baru dengan nama profilku.html
- Tulis kode sederhana yang berisi nama dan umur kamu
- Tambahkan JavaScript yang munculin pesan "Halo, aku [nama kamu]!"
- Kirim screnshotnya ke orang tuamu biar mereka bangga! 🥳
🎉 SELAMAT! 🎉
Sekarang kamu udah punya perlengkapan perang lengkap! Besok kita lanjut ke Javascript Game #3: Jurus #1: Kotak Ajaib Penyelamat - Mengenal Variabel
Siap-siap belajar jurus rahasia yang bikin game makin seru!