[{"name":"index.html","content":"<!DOCTYPE html>\n<html>\n<head>\n    <title>Launch Control</title>\n</head>\n<body>\n    <div class=\"panel\">\n        <h1>🚀 MISSILE CONTROL</h1>\n        <p>Status: READY TO FIRE</p>\n\n        <button>TEMBAK ROKET</button>\n    </div>\n</body>\n</html>\n"},{"name":"style.css","content":"body {\n    background-color: #1a1a1a;\n    color: white;\n    font-family: sans-serif;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 100vh;\n}\n.panel {\n    background: #333;\n    padding: 30px;\n    border-radius: 10px;\n    text-align: center;\n    border: 2px solid #555;\n}\nbutton {\n    padding: 15px 30px;\n    font-size: 16px;\n    font-weight: bold;\n    cursor: pointer;\n    border: none;\n    border-radius: 5px;\n\n    /* TUGAS 2: Ubah warna background tombol menjadi merah (red) */\n    background-color: gray;\n    color: white;\n}\nbutton:hover { opacity: 0.8; }\n"},{"name":"script.js","content":"// TUGAS 3: Buat event listener agar tombol berfungsi\n\n// Langkah A: Pilih tombol berdasarkan ID 'tombol-api'\nconst tombol = document.getElementById('tombol-api');\n\n// Langkah B: Tambahkan event onclick\nif (tombol) {\n    tombol.onclick = function() {\n        // Langkah C: Panggil fungsi alert dengan pesan \"ROKET DILUNCURKAN!\"\n\n        // Ketik kodemu di bawah ini:\n\n    };\n}\n"}]

Area Web / html

JS Action: Tombol Alert

ACE EDITOR

Berkas

🌎 Loading... ✕

localhost:8080/index.html

✨ AI MENTOR

Klik tombol di atas untuk cek kodemu.

Target Pembelajaran 3 TUGAS

HTML: Beri id='tombol-api' ke button
CSS: Ubah warna tombol jadi merah
JS: Panggil alert('ROKET DILUNCURKAN!')

Petunjuk:

Sistem peluncuran roket macet! Kita perlu menghubungkan tombol merah ke sistem komputer.

HTML: Berikan identitas id="tombol-api" pada elemen <button>.
CSS: Ubah warna tombol agar terlihat berbahaya (Ganti gray menjadi red).
JS: Lengkapi kode di dalam fungsi onclick. Ketik alert("ROKET DILUNCURKAN!");.

Setelah selesai, klik tombol ▶ RUN PREVIEW, lalu coba klik tombol merah di layar kanan. Jika benar, notifikasi akan muncul!

JS Action: Tombol Alert

Mode Fokus Aktif

✨ AI MENTOR

Target Pembelajaran 3 TUGAS

KONFIGURASI AI