ZakatFlow — Kalkulator Zakat Digital Pribadi

Assalamu'alaikum, teman-teman! 👋

Kali ini mau berbagi cerita tentang proses membangun ZakatFlow — sebuah aplikasi kalkulator dan pencatatan zakat pribadi yang bisa diakses lewat browser. Datanya tersimpan rapi di Google Sheets, dan aplikasinya sudah bisa jalan di server sendiri. Seru banget prosesnya, dan semoga bisa jadi inspirasi buat teman-teman yang pengen bikin sesuatu yang bermanfaat dari dunia teknologi.

Kenapa Bikin Aplikasi Zakat?

Jujur, ide ini muncul dari kebutuhan pribadi. Setiap tahun menjelang Ramadan, pasti ada momen di mana kita perlu menghitung zakat — entah itu zakat fitrah, zakat penghasilan, atau zakat harta lainnya. Biasanya sih ngitung manual atau pakai kalkulator online yang tampilannya kurang sreg di hati.

Dari situ muncul pertanyaan: "Gimana kalau bikin sendiri aja? Sekalian belajar teknologi baru?"

Dan lahirlah ZakatFlow — aplikasi yang bukan cuma bisa ngitung zakat, tapi juga nyimpen riwayat pembayaran, lengkap dengan halaman ringkasan yang tampilannya keren banget pakai desain kaca transparan (Glassmorphism). 🕌✨

Teknologi yang Dipakai

Buat yang penasaran, ini teknologi di balik ZakatFlow dan kenapa dipilih:

• SvelteKit — Ini semacam "kerangka kerja" buat bikin aplikasi web. Dipilih karena ringan dan responsif, jadi aplikasinya terasa cepat waktu dipakai.
• Tailwind CSS + Glassmorphism — Buat bikin tampilan yang modern dengan efek kaca transparan, latar belakang yang blur, dan garis pinggir yang halus. Hasilnya? Tampilannya mewah walaupun ini project pribadi.
• Google Sheets — Ini yang menarik. Daripada pakai penyimpanan data yang ribet setup-nya, kenapa nggak pakai Google Sheets aja? Gratis, mudah di-share, dan datanya bisa langsung dilihat di spreadsheet kayak biasa.
• Docker + Kubernetes — Biar aplikasinya nggak cuma jalan di laptop sendiri, aplikasinya "dibungkus" pakai Docker (semacam kontainer virtual) dan dijalankan di server lokal pakai Kubernetes (sistem yang ngatur supaya aplikasi tetap jalan stabil).

Fitur yang Dibangun

Aplikasi ini punya 7 kalkulator zakat yang sesuai kaidah syariah:

1. Zakat Fitrah — Tinggal masukin jumlah anggota keluarga, otomatis dihitung berdasarkan harga beras.
2. Zakat Emas & Perak — Masukin berat emas atau perak yang dimiliki, nanti dicek apakah sudah wajib zakat atau belum.
3. Zakat Penghasilan — Buat teman-teman yang kerja kantoran atau freelance, tinggal masukin gaji bulanan.
4. Zakat Perdagangan — Buat yang punya usaha, tinggal masukin modal, uang kas, piutang, dan hutang.
5. Zakat Pertanian — Buat petani, tinggal pilih metode pengairan (irigasi atau tadah hujan) dan masukin hasil panen.
6. Zakat Peternakan — Untuk yang punya hewan ternak seperti sapi, kambing, dan unta.
7. Zakat Perikanan — Buat yang punya usaha perikanan, dihitung dari pendapatan bersih.

Selain kalkulator, ada juga fitur pendukung yang nggak kalah penting:

• Halaman Ringkasan yang menampilkan total zakat yang sudah dan belum dibayar dalam satu pandangan.
• Riwayat pembayaran yang bisa difilter berdasarkan jenis zakat, status bayar, dan bisa dicari pakai kata kunci.
• Daftar harga referensi emas, perak, dan beras yang bisa diperbarui sendiri.
• Tombol ubah status untuk menandai mana yang sudah dibayar dan mana yang belum.

Proses Pembuatan: Dari Nol Sampai Jadi

Tahap 1 — Bikin Tampilan

Tahap pertama fokus ke pembuatan tampilan aplikasi. Ini tahap yang paling seru karena bisa langsung ngeliat hasilnya terbentuk pelan-pelan. Desain yang dipilih namanya Glassmorphism — intinya bikin efek kayak kaca transparan, di mana latar belakangnya terlihat blur di balik kartu-kartu informasi. Simpel tapi hasilnya elegan banget.

Yang bikin puas itu waktu berhasil bikin efek cahaya hijau emerald yang menyebar di latar belakang. Kesan "islami" dan modernnya langsung terasa, padahal secara teknis cuma beberapa baris kode aja.

Tahap 2 — Sambungkan ke Google Sheets

Ini bagian yang paling menantang. Aplikasinya perlu bisa nyimpen dan baca data dari Google Sheets secara otomatis, tanpa perlu kita buka spreadsheet-nya manual. Jadi setiap kali ngitung zakat dan mau simpan hasilnya, data langsung masuk ke spreadsheet.

Yang menarik, pakai Google Sheets sebagai penyimpanan data itu ternyata cukup mumpuni buat aplikasi pribadi. Nggak perlu ribet setup penyimpanan data yang kompleks, cukup bikin spreadsheet baru dan sambungkan ke aplikasi.

Tahap 3 — Bungkus Jadi Kontainer

Setelah aplikasinya jalan di laptop sendiri, saatnya "dibungkus" supaya bisa dipindahkan ke server mana aja tanpa ribet. Prosesnya dua tahap: tahap pertama bikin aplikasinya, tahap kedua ambil hasil jadinya aja. Hasilnya? Ukuran bungkusannya cuma di bawah 200MB — ringan dan efisien.

Tahap 4 — Jalankan di Server

Nah, ini bagian yang bikin deg-degan. Aplikasinya dijalankan di server lokal yang bisa mengatur beban kerja secara otomatis. Kalau lagi banyak yang akses, server otomatis nambah kapasitas. Kalau sepi, kapasitasnya dikurangin biar hemat sumber daya. Aksesnya tinggal buka browser dan ketik alamatnya.

Rasanya puas banget waktu pertama kali buka browser dan aplikasinya muncul berjalan lancar di server. 🎉

Pelajaran yang Didapat

Sepanjang proses bikin ZakatFlow, ada beberapa pelajaran berharga yang bisa diambil:

1. Google Sheets cukup mumpuni buat penyimpanan data skala pribadi. Nggak perlu ribet pakai sistem penyimpanan data yang berat kalau kebutuhannya masih sederhana. Tapi perlu diingat juga, kalau datanya mulai banyak banget, mending pindah ke sistem yang lebih kuat.

2. Desain kaca transparan itu gampang dibuat, tapi susah dijaga konsistensinya. Kuncinya ada di keseimbangan antara tingkat transparansi dan kejelasan teks. Terlalu transparan bikin tulisan susah dibaca, terlalu solid malah kehilangan efek kacanya.

3. "Membungkus" aplikasi itu penting banget. Dengan membungkus aplikasi jadi satu paket yang siap jalan, ukurannya bisa diperkecil dan dipindahkan ke server mana aja tanpa masalah. Ini bikin proses perpindahan dari laptop ke server jadi jauh lebih gampang.

4. Menjalankan aplikasi di server itu kelihatan ribet di awal, tapi begitu paham polanya, jadi terasa mudah. Yang penting pahami dulu konsep dasarnya: aplikasi butuh tempat jalan, butuh cara diakses dari luar, dan butuh pengaturan keamanan. Sisanya tinggal tambahin sesuai kebutuhan.

5. Pengecekan data masukan itu nggak boleh diremehkan. Terutama buat kalkulator yang berhubungan sama kewajiban agama. Kalau angkanya salah, bisa berpengaruh ke jumlah zakat yang wajib dibayarkan. Makanya, setiap angka yang dimasukkan dicek dengan ketat supaya hasilnya akurat.

6. Bikin sesuatu yang bermanfaat itu motivasinya beda. Dibanding bikin project yang cuma buat latihan, kalau projectnya punya nilai manfaat langsung, semangat ngerjakannya jauh lebih tinggi.

Kesimpulan

ZakatFlow membuktikan bahwa bikin aplikasi yang lengkap dan siap pakai itu nggak harus rumit. Dengan kombinasi alat yang tepat — SvelteKit buat tampilan yang cepat dan responsif, Google Sheets buat nyimpen data dengan cara yang simpel, dan server yang bisa mengatur beban kerja secara otomatis — sebuah aplikasi pribadi bisa punya kualitas yang setara dengan aplikasi profesional.

Yang paling penting, project ini jadi bukti bahwa kemampuan teknis kita bisa dimanfaatkan untuk hal-hal yang bermanfaat. Menghitung zakat itu kewajiban, dan kalau kita bisa bikin alat yang mempermudah prosesnya, kenapa nggak?

Buat teman-teman yang tertarik melihat kode sumbernya atau mau ikut berkontribusi, silakan kunjungi halaman GitHub-nya:

🔗 Repository: https://github.com/stayrelevantid/zakatflow

Semoga bermanfaat dan bisa jadi inspirasi buat project selanjutnya. Wassalamu'alaikum! 🤲