Latihan 1 dari materi hx-swap di HTMX — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Kode awal punya tombol Tambah Item dengan hx-get="/api/new-item" dan hx-target="#item-list", plus <ul id="item-list"> berisi Item awal. Biarkan semuanya, lalu:
hx-swap="beforeend" di tombol yang sama, supaya item baru masuk di akhir daftar dan Item awal tetap ada. Tanpa itu, bawaannya innerHTML mengganti seluruh isi daftar.Yang dicek:
<button> punya hx-swap bernilai persis beforeend.<ul> di halaman.hx-swap dan beforeend di luar komentar.Di pratinjau, klik mengirim GET /api/new-item, yang dijawab 404 karena belum ada contoh balasan. Mau melihat item bertambah? Tambahkan <template id="contoh-balasan"><li>Item baru</li></template>. Template itu gak dinilai.
