Website Top-Up Game & Digital Voucher Multi-Payment

Website Top-Up Game & Digital Voucher Multi-Payment

Peran / Role

Fullstack Developer

Projek Deskripsi

Platform top-up game otomatis untuk game populer (Mobile Legends, Free Fire, PUBG) dan pembelian voucher digital. Dibuat menggunakan Vue 3 di bagian frontend dan Laravel 12 sebagai REST API backend untuk menangani proses transaksi dan integrasi pembayaran secara real-time.


🎯 Tantangan

  1. Otomatisasi Transaksi: Memastikan pesanan game terproses instan begitu pembayaran selesai diselesaikan pengguna.
  2. Integrasi Multi-Payment: Menghubungkan berbagai jalur pembayaran (Virtual Account, QRIS, E-Wallet) dengan respon webhook yang cepat dan stabil.
  3. Keamanan Data Transaksi: Mencegah adanya pembayaran palsu, callback ilegal, atau order terduplikasi.


🛠️ Solusi & Fitur Teknis

  1. Backend API (Laravel 12): Merancang RESTful API untuk mengelola alur transaksi, pengecekan harga, dan manipulasi data stok voucher.
  2. Frontend SPA (Vue 3): Membangun antarmuka yang ringan dan cepat untuk pemilih nominal top-up, form input ID game, dan halaman cek status transaksi.
  3. Payment Gateway: Integrasi pembayaran otomatis (Midtrans/Duitku) menggunakan webhook callback untuk update status bayar secara real-time.
  4. Integrasi Provider Top-Up: Menghubungkan API dari supplier/provider game untuk fitur cek nickname pemain otomatis dan eksekusi pesanan.
  5. Background Processing (Queue): Memakai fitur Queue Laravel untuk memproses transaksi di latar belakang agar respon API tetap cepat saat traffic tinggi.
  6. Validasi Keamanan: Proteksi signature header pada webhook pembayaran dan idempotency check untuk mencegah transaksi terproses dua kali.
  7. Panel Admin: Dashboard internal untuk melihat riwayat transaksi, laporan saldo, kelola produk, dan penanganan transaksi bermasalah/gagal.


📊 Hasil

  1. Transaksi terproses secara otomatis 24 jam tanpa perlu konfirmasi manual dari admin.
  2. Alur pembayaran dan eksekusi voucher berjalan cepat dengan waktu tunggu rata-rata di bawah 10 detik.
  3. Arsitektur decoupled (Vue + Laravel) memudahkan jika ingin ada penambahan produk game atau provider pembayaran baru.


Skills and deliverables

vuejslaraveldockerintegration apirest api