Studi kasus · React Native
Business Dashboard
Dashboard mobile untuk pemilik usaha di atas ERP cloud. Penjualan, stok, dan keuangan dalam satu layar, plus approval permintaan kasir langsung dari ponsel.
- Peran
- Mobile Developer
- Platform
- React Native
- Status
- Tersedia di Play Store
- React Native
- TypeScript
- Realm
- Zustand
- D3
- Reanimated
- Firebase
Yang ditangani
Bisnis dalam sekilas
Omzet, jumlah transaksi, rata-rata transaksi, dan customer aktif untuk cabang dan periode apa pun, dengan produk terlaris, piutang, dan stok tepat di bawahnya.
Grafik dari segala sisi
Omzet per bulan dibanding tahun lalu, per cabang, per channel, dan per salesman. Setiap grafik bisa dibuka layar penuh.
Dashboard sesuai keinginan
Geser widget sesuai urutan sendiri, sembunyikan yang tidak perlu, dan filter masing-masing per periode dan cabang.
Approval dari genggaman
Saat kasir butuh izin, pemilik menerima push notification lalu menyetujui atau menolak dengan satu ketukan.
Coba dashboard-nya
Prototype interaktif dari layar aplikasi asli dengan data contoh. Jelajahi widget, lalu setujui permintaan kasir.
Ketuk area yang menyala, seperti prototype Figma.
Di balik layar
- UI
- React Native dengan TypeScript, React Navigation, Reanimated, dan bottom sheet.
- Grafik
- Widget grafik custom dengan D3 dan Victory Native di atas react-native-svg.
- State
- Store Zustand, dengan Realm sebagai cache offline untuk widget, profil, dan approval.
- Jaringan
- Client Axios untuk dua generasi API backend, dengan refresh JWT yang mengantrekan dan mengulang request saat 401.
- Notifikasi
- Firebase Cloud Messaging + Notifee, langsung membuka approval baik saat aplikasi terbuka, di latar, maupun tertutup.
- Kualitas
- Firebase Crashlytics dengan handler error JS global, dan Firebase Analytics.