Dasar PPLGSemester 1Pertemuan 10 · 1 Pertemuan × 5 JP (1 JP = 45 menit)

JavaScript Dasar

Modul ajar pertemuan 10 mata pelajaran Dasar PPLG: javascript dasar.

#javascript#variabel#fungsi#dom

MODUL AJAR — Dasar PPLG

Penyusun(isi nama guru)
JenjangSMK
Sekolah(isi nama sekolah)
Kelas/SemesterX / 1 (Ganjil)
Tahun Pelajaran2025/2026
FaseE
ElemenPemrograman Web Dasar (HTML/CSS/JS)
Kode Tujuan PembelajaranDP-E1.10
Alokasi Waktu5 JP × 45 menit = 225 menit (1 pertemuan)

1. Identitas Modul

KomponenKeterangan
Nama Penyusun(isi nama guru)
Institusi(isi nama sekolah)
Mata PelajaranDasar PPLG (Dasar-dasar Program Keahlian PPLG)
Kelas/SemesterX / 1 (Ganjil)
FaseE
ElemenPemrograman Web Dasar (HTML/CSS/JS)
TopikJavaScript dasar: variabel, tipe data, control flow, event, DOM, debugging
Kode Tujuan PembelajaranDP-E1.10
Tahun Pelajaran2025/2026
Alokasi Waktu5 JP × 45 menit = 225 menit (1 pertemuan)

2. Kompetensi Awal

Peserta didik diharapkan telah memiliki:

  1. Halaman profil.html ber-CSS dari Modul 08 dan 09 sebagai objek yang akan dihidupkan.
  2. Pemahaman struktur dan tampilan web terpisah (HTML = struktur, CSS = tampilan).
  3. Kemampuan logika sederhana (jika-maka) dari kehidupan sehari-hari.
  4. Disiplin dan budaya kerja dari Modul 04 (observasi 04 berlanjut).

3. Dimensi Profil Lulusan

Dimensi yang dikuatkan pada modul ini beserta implementasi konkretnya:

DimensiImplementasi Konkret pada Modul Ini
Penalaran KritisMenalar alur program dan menemukan penyebab error (debugging)
KreativitasMenambahkan interaksi (tombol, pesan) pada halaman profil sendiri
KemandirianMenemukan dan memperbaiki error secara mandiri lewat Console DevTools
KomunikasiMenjelaskan logika kode dan penyebab error kepada rekan (pair debugging)

Observasi budaya kerja (tenggat tugas praktik) tetap dicatat di 04 - Instrumen Observasi Disposisi PPLG.md Bagian A.

4. Sarana dan Prasarana

  1. Lab komputer dengan VS Code, Live Server, dan file profil.html + style.css (hasil Modul 08–09).
  2. Proyektor/LCD untuk demo event dan debugging di DevTools.
  3. Kartu Sintaks JavaScript (Lampiran 5) — print pada kertas tebal, gunting.
  4. LKPD "Menghidupkan Halaman Profil dengan JavaScript" (Lampiran 1) — print sesuai jumlah peserta didik.
  5. Bahan bacaan peserta didik (Lampiran 4) — print sesuai jumlah peserta didik.
  6. Infografis Alur Program & Tips Debugging (Lampiran 6) — tayang atau print A3/A4.
  7. Lembar observasi praktik (Lampiran 2) dan instrumen 04 Bagian A.
  8. Soal kuis formatif dan soal TKA sumatif beserta kunci (Lampiran 9 dan Bagian G.3).
  9. File script.js contoh (untuk demonstrasi) di repositori guru.
  10. Kumpulan 3 kode ber-error untuk tantangan debugging (disediakan guru).

5. Target Peserta Didik

KategoriLayanan
RegulerSeluruh peserta didik kelas X PPLG mengikuti alur utama pembelajaran
Pencapaian tinggiPengayaan: hitungan klik, daftar tugas sederhana, organisasi kode dengan function
Kesulitan belajarPendampingan; latihan console.log berulang; kartu sintaks; membaca pesan error bersama guru

6. Model Pembelajaran

AspekUraian
PendekatanPembelajaran terdiferensiasi (yang cepat mengeksplorasi interaksi tambahan; yang lambat diberi panduan bertahap)
ModelCode-along dipadukan tantangan debugging dan eksplorasi mandiri
MetodeDemonstrasi, praktik langsung, tantangan, pair debugging, refleksi
MediaVS Code + Live Server, DevTools (Console), Kartu Sintaks JavaScript, infografis
Sumber belajarBahan bacaan lampiran, MDN Web Docs, W3Schools, Eloquent JavaScript