Ikhtisar Chapter 11: JavaScript Preparation

Apa yang Dipelajari?

Cara menyiapkan tools JavaScript modern untuk WordPress theme development menggunakan @wordpress/scripts (build tool resmi WordPress).

Poin Utama

Kenapa Butuh Build Tool?

JavaScript modern perlu di-bundle (gabungkan banyak file jadi satu), di-compile (ubah syntax baru ke format lama agar semua browser paham), dan di-minify (perkecil ukuran file).

Langkah Setup

1. Install Node.js dari nodejs.org (pilih versi LTS)
2. Salin file package.json ke folder theme
3. Jalankan npm install di terminal (di dalam folder theme)
4. Jalankan npm run start untuk mode watch (otomatis rebuild saat file berubah)

Cara Kerja

src/           ← kita edit di sini (source code)
  └── index.js
       ↓ otomatis di-compile
build/         ← WordPress memuat file dari sini (jangan edit!)
  ├── index.js
  └── index.css

Perintah	Fungsi
npm run start	Watch mode — jalan terus, auto-rebuild saat save
npm run build	Build sekali untuk produksi
Ctrl + C	Stop watch mode

Aturan Penting

• Edit file di folder src/ saja
• Jangan edit folder build/ (otomatis di-generate)
• Jangan commit node_modules/ ke Git
• File yang dimuat WordPress (wp_enqueue_script) adalah dari build/, bukan src/

Satu Kalimat

Install Node.js → npm install → npm run start → sekarang JavaScript modern siap dipakai di theme WordPress.