FG88 Academy — Platform Manajemen Akademi Futsal

Diagram arsitektur

Pilih simpul untuk membaca keputusan di baliknya

graph LR A[Orang Tua · Pelatih · Admin] --> B[SvelteKit PWA] B --> C[Elysia API on Cloudflare Workers] C --> D[Neon Postgres via Hyperdrive] C --> E[Penyimpanan foto & file R2] C --> H[Analytics Engine] F[Cron Trigger 17:00 WIB] --> G[Pengingat H-1 via Web Push] I[GitHub Actions CI/CD] --> C I --> D click A call archNote() click B call archNote() click C call archNote() click D call archNote() click E call archNote() click F call archNote() click G call archNote() click H call archNote() click I call archNote()

A Orang Tua · Pelatih · Admin: Orang tua login dengan ID siswa atau NIK anak plus password yang ditetapkan akademi — tidak perlu daftar email untuk pengguna yang tidak akan pernah mengecek email.
B SvelteKit PWA: SPA ini adalah PWA dengan service worker, jadi orang tua bisa menginstalnya di ponsel dan menerima push notification seperti aplikasi native.
C Elysia API on Cloudflare Workers: Satu Worker melayani SPA dan /api/* sekaligus, jadi seluruh produk ter-deploy sebagai satu unit di paket gratis.
D Neon Postgres via Hyperdrive: Migrasi Drizzle diterapkan ke branch dev Neon lebih dulu; migrasi produksi hanya jalan setelah semua cek lolos di CI.
E Penyimpanan foto & file R2: Foto di-resize ke 320px di browser sebelum di-upload dan disimpan di R2. Database hanya menyimpan path file, sehingga egress Neon jauh di bawah batas 5 GB paket gratis.
F Cron Trigger 17:00 WIB: Cron trigger berjalan setiap 5 menit di jendela pukul 17:00 WIB dan mengirim pengingat latihan H-1 lewat Web Push.
G Pengingat H-1 via Web Push: Pengingat sampai ke ponsel orang tua sebagai notifikasi push dari PWA yang terpasang — admin tidak perlu broadcast WhatsApp manual.
H Analytics Engine: Event funnel pendaftaran (klik WhatsApp, submit pendaftaran) masuk ke Analytics Engine, bisa dibaca lewat SQL API tanpa produk analitik terpisah.
I GitHub Actions CI/CD: Setiap push menjalankan test dan typecheck; push ke main juga memigrasi database produksi dan men-deploy Worker.

Platform manajemen untuk FG88, akademi futsal anak di Karawang. Sudah live di produksi di fg88academy.id dengan 211 siswa aktif, dipakai setiap hari oleh pelatih, admin, dan orang tua.

Masalah

Akademi ini berjalan di atas WhatsApp dan kertas. Absensi tercatat di pesan chat, iuran bulanan dilacak manual, dan perkembangan anak selama satu semester hanya ada di kepala pelatih. Setiap bulan orang tua menanyakan hal yang sama: anak saya hadir atau tidak, uang kami dipakai untuk apa, anak saya benar-benar berkembang atau tidak?

Solusi

Saya bangun satu aplikasi dengan tiga jenis login. Orang tua masuk dengan ID siswa atau NIK anak — tanpa email, karena kebanyakan tidak akan pernah memverifikasinya — lalu melihat rapor, riwayat absensi, dan status iuran. Pelatih mencatat absensi per sesi dan mengisi hasil tes fisik dan teknik sekali per semester. Admin mengurus siswa, jadwal, iuran, akun pelatih, dan menyetujui pendaftaran baru yang masuk lewat halaman publik.

Rapor adalah bagian yang benar-benar dibuka orang tua: setiap siswa mendapat kartu pemain ala FIFA dengan rating, dan radar chart membandingkan delapan atribut fisik dan teknik dengan benchmark kelompok usianya. Rapor dibuat per semester, jadi orang tua bisa melihat perkembangan antar periode, dan bisa diunduh sebagai PDF.

Fitur Utama

Rapor semester: kartu pemain, radar chart vs benchmark kelompok usia, ekspor PDF, perbandingan dengan semester sebelumnya
Absensi per sesi latihan, dengan status check-in dan pembayaran per tanggal
Iuran: iuran bulanan, pembayaran per kunjungan, dan biaya pendaftaran sekali bayar dengan QRIS dan upload bukti
Pendaftaran publik dengan persetujuan admin, plus event funnel yang dilacak di Analytics Engine
Pengingat latihan H-1 via Web Push dari cron trigger, plus tombol pengingat WhatsApp per orang tua
PWA: bisa diinstal, berjalan di ponsel yang sudah dipakai orang tua dan pelatih

Keputusan Arsitektur

Satu Cloudflare Worker melayani SPA SvelteKit dan API Elysia sekaligus, jadi deploy jadi satu unit dan paket gratis mencukupi semuanya.
Postgres berjalan di Neon di balik connection pooling Hyperdrive, dengan Drizzle untuk skema dan migrasi.
Foto di-resize ke 320px di browser dan disimpan di R2; database hanya menyimpan path file, karena egress Neon di paket gratis dibatasi 5 GB/bulan.
Password memakai PBKDF2 dengan 50.000 iterasi — Workers membatasi PBKDF2 di 100 ribu, dan 50 ribu menjaga waktu CPU login tetap di bawah batas paket gratis.
Migrasi diterapkan ke branch dev Neon lebih dulu; GitHub Actions menjalankan test dan typecheck di setiap push, dan hanya main yang memicu migrasi produksi dan deploy.

Trade-off

Satu Worker untuk SPA plus API membuat operasional sederhana, tapi setiap perubahan kecil di frontend ikut terkirim bersama API. Untuk produk satu pengembang, itu tukar-menukar yang bagus.
Foto 320px dan penyimpanan path saja menjaga proyek tetap di paket gratis, dengan biaya resolusi gambar — masih bisa diterima untuk foto siswa ala KTP.
Pengingat WhatsApp otomatis butuh gateway berbayar, jadi aplikasi mengirim Web Push untuk pengguna yang menginstalnya dan menyediakan tombol WhatsApp sekali sentuh untuk admin bagi sisanya.

Yang Saya Pelajari

Bagian tersulit bukan stack-nya, melainkan merancang untuk pengguna yang tidak teknis. Pelatih mengisi hasil tes dari ponsel di sela-sela sesi, dan orang tua mungkin membuka aplikasi sebulan sekali. Itu membentuk semuanya: hasil tes yang dikunci per semester alih-alih isian bebas, benchmark per kelompok usia alih-alih angka mentah, dan login yang bekerja dengan ID siswa yang tercetak di kartu anggota.