Pengantar: Setup Resmi WordPress Block Development

Gambaran Umum

Chapter ini membahas cara modern dan resmi WordPress untuk mengembangkan custom blocks menggunakan block.json dan render.php. Pendekatan ini jauh lebih bersih dan sederhana dibanding cara manual yang dipakai di Chapter 27 (JSXBlock, PlaceholderBlock class).

Mengapa Kita Belajar Cara Manual Dulu?

Ada 3 alasan historis mengapa di chapter sebelumnya kita membuat setup manual:

1. block.json Belum Ada (Sebelum 2021)

• block.json sebagai cara resmi mendaftarkan block baru diluncurkan pertengahan 2021
• Sebelumnya, developer harus menemukan sendiri cara mengatur file, folder, enqueue CSS/JS
• Setiap developer punya "boilerplate" sendiri-sendiri

2. @wordpress/scripts Belum Mendukung Multiple Blocks

• Dulu, package npm @wordpress/scripts tidak bisa otomatis mendeteksi banyak block dari subfolder
• Sekarang: package ini sudah otomatis mendeteksi semua subfolder di src/ yang punya block.json
• Sangat mudah setup banyak block type dalam satu theme/plugin

3. Interactivity API Belum Ada (Sebelum April 2024)

• Sebelum April 2024, jika ingin JavaScript front-end mengakses atribut block instance, harus manual
• Harus kreatif untuk "menjembatani" antara PHP, HTML, dan JavaScript
• Sekarang: WordPress Interactivity API menangani semua ini secara standar

Apa yang Akan Dipelajari di Chapter Ini

Topik	Keterangan
block.json	File metadata resmi untuk mendaftarkan block
render.php	File PHP terpisah untuk rendering front-end
@wordpress/scripts auto-detection	Otomatis mendeteksi block dari subfolder src/
register_block_type_from_metadata()	Satu baris PHP untuk mendaftarkan block
API Version 3	Versi terbaru dengan useBlockProps wrapper
Workflow cleanup	Package.json tasks yang bersih

Keuntungan Pendekatan Modern

❌ Cara Lama (Chapter 27):
   - PHP Class manual (JSXBlock, PlaceholderBlock)
   - Entry point manual di package.json
   - wp_register_script + register_block_type manual
   - wp_localize_script untuk setiap block

✅ Cara Baru (Chapter 28):
   - block.json = semua metadata di satu file
   - render.php = PHP rendering terpisah & bersih
   - Auto-detection subfolder oleh @wordpress/scripts
   - register_block_type_from_metadata() = 1 baris PHP

Catatan Penting

Sebagai developer profesional, kamu pasti akan menemukan proyek yang masih menggunakan cara lama. Oleh karena itu penting untuk memahami kedua pendekatan. Tapi untuk proyek baru, selalu gunakan cara modern yang dijelaskan di chapter ini.