2 poin oleh hebu570 2026-03-30 | Belum ada komentar. | Bagikan ke WhatsApp

Halo, saya seorang developer yang bekerja di backend di bidang e-commerce!

Di e-commerce Korea, frontend sering dibangun sebagai skin di platform seperti cafe24, Godomall & Shopby, dan Makeshop. Karena kebanyakan hanya menyediakan static serving, penggunaan framework SPA seperti React sering kali sulit diterapkan di skala perusahaan kecil dan menengah.

Masih banyak juga kasus di mana stack legacy berbasis jQuery atau Handlebars tetap digunakan, dan karena struktur file sama sekali tidak tertata, sering ada puluhan file yang bercampur aduk di satu folder dengan kode yang kusut. Reusabilitas komponen pun sering kali rendah juga.

Karena itu, saya mencoba membuat boilerplate e-commerce yang rapi hanya dengan file HTML/JS/CSS.
Strukturnya dibuat agar Anda cukup menulis dan menempelkan kode terkait API untuk langsung digunakan!

Tech stack

  • HTMX 2.0 — navigasi SPA berbasis fragmen HTML
  • Vite 7 — build tool + server pengembangan HMR
  • TypeScript — bundle independen per komponen
  • Embla Carousel — banner paralaks, carousel produk
  • CSS murni — sistem design token berbasis CSS custom property tanpa Tailwind

Halaman yang sudah diimplementasikan

  • Beranda (carousel banner, kategori, carousel produk, peringkat, ulasan, pengumuman)
  • Daftar produk (sidebar kategori, filter, layout grid)
  • Detail produk (galeri gambar, cascade opsi, pengaturan jumlah, tab, lightbox ulasan)
  • Forum (pengumuman, FAQ, detail postingan)
  • Event (daftar event, countdown timer, detail)
  • Halaman saya (tingkat member, statistik pesanan, kupon/poin)
  • Riwayat pesanan (filter tanggal, daftar kartu pesanan)

Demo & source

Silakan clone dan gunakan secara bebas tanpa lisensi!
Masukan dan ide perbaikan juga sangat saya nantikan!

Belum ada komentar.

Belum ada komentar.