Skip to content

README.md

Latest commit

 

History

History
174 lines (136 loc) · 6.55 KB

README.md

File metadata and controls

174 lines (136 loc) · 6.55 KB
Raw

IKHLAS

IKHLAS adalah capstone Sistem Informasi Manajemen Masjid Terintegrasi Berbasis Web dengan Monitoring Keuangan dan Public Information Display.

Aplikasi sengaja dibagi menjadi dua surface utama:

  • Operate UI untuk Admin/Pengurus dan Bendahara. Alur transaksi dibuat mobile-first.
  • Public Display khusus TV masjid. Layout tidak mewarisi density dashboard admin.

Fitur Saat Ini

Keuangan

  • Kas masuk dan kas keluar oleh Ketua/Admin maupun Bendahara.
  • Perubahan yang diajukan Bendahara (buat, edit, hapus, dan penggantian dokumen) masuk jalur review Ketua/Admin sebelum diposting ke saldo, laporan, dan Public Display.
  • Ketua/Admin dapat menyetujui pengajuan atau meminta revisi dengan catatan; Bendahara dapat memperbaiki data/dokumen lalu mengirim ulang.
  • Ketua/Admin dapat membantu pencatatan transaksi langsung saat Bendahara tidak tersedia.
  • Kategori transaksi dinamis yang dikelola Admin.
  • Kas masuk memiliki sumber dana + detail sumber terpisah.
  • Saldo awal dapat dikonfigurasi Admin lengkap dengan tanggal dan catatan.
  • Saldo otomatis dari saldo awal + kas masuk - kas keluar.
  • Pembeda Cash/Kotak Amal dan Transfer.
  • Bukti transaksi dan mutasi rekening.
  • Bukti kas keluar wajib pada UI.
  • File bukti disimpan privat di Google Drive. SQLite hanya menyimpan file ID dan metadata referensi.
  • Riwayat transaksi.
  • Laporan berdasarkan periode.
  • Export transaksi ke CSV.
  • Notifikasi Telegram setelah transaksi tersimpan.
  • Audit trail untuk aktivitas penting.

Operasional Masjid

  • Waktu adzan otomatis dari public prayer-time API menggunakan metode Kementerian Agama RI untuk koordinat RS Elizabeth Situbondo.
  • Cache jadwal salat SQLite + last-known-good fallback ketika API/internet bermasalah.
  • Iqamah dihitung otomatis 8 menit setelah adzan.
  • Dashboard hanya mengelola petugas Jumat (imam, khatib, bilal) untuk Jumat-Jumat mendatang; tanggal yang sudah lewat otomatis tidak tampil di UI.
  • Pengelolaan kegiatan.
  • Konfigurasi identitas masjid dan rekening donasi.
  • Live Masjid melalui YouTube embed.
  • Public Display V2 khusus signage 16:9: fixed 100dvh, tanpa vertical/horizontal scroll.
  • Jam, next prayer, countdown, tanggal Masehi + Hijriah, dan lima waktu salat selalu terlihat pada posisi konsisten.
  • Secondary-content carousel untuk kegiatan, live stream, transparansi keuangan, transaksi terbaru, pengumuman, dan donasi.
  • Recent transaksi publik yang disanitasi; detail sumber, bukti, mutasi, dan user pencatat tidak diekspos.
  • Footer/ticker untuk rotasi ayat/hadits terverifikasi, pengumuman, dan pesan masjid.

Akses & Keamanan

  • Initial setup tanpa password bawaan.
  • Login Ketua/Admin dan Bendahara.
  • Role-based access dengan pemisahan tugas: Ketua/Admin mengelola informasi/config, monitoring, review transaksi, dan dapat membantu mencatat transaksi; Bendahara membuat pengajuan transaksi dan bukti untuk direview sebelum posting.
  • Password di-hash dengan PBKDF2-HMAC-SHA256.
  • Server-side session dengan HttpOnly cookie.
  • Rate limiting sederhana untuk login/setup.
  • Security response headers.
  • Audit log.
  • Upload file dibatasi JPG, PNG, WEBP, PDF dan maksimal 5 MB.

Mobile & Reliability

  • Form transaksi mobile-first.
  • Dashboard responsive.
  • Installable PWA shell.
  • Service worker untuk app shell setelah kunjungan pertama.
  • SQLite WAL mode.
  • Backup SQLite lokal manual dan auto backup harian ke Google Drive dengan retention.

Stack

  • React + Vite
  • React Router
  • Node.js + Express
  • SQLite (better-sqlite3)
  • Zod
  • Multer
  • Google Drive API
  • Telegram Bot API
  • YouTube Embed
  • Lucide React

Menjalankan Project

npm ci
cp .env.example .env
npm run db:init
npm run dev

Akses:

  • Web: http://localhost:5173
  • API health: http://localhost:3001/api/health
  • Public Display: http://localhost:5173/public-display

Public Display ditargetkan untuk layar landscape 16:9 (1366×768 sampai 4K), bukan halaman web yang perlu di-scroll.

Pada instalasi baru, buka Web. Karena belum ada pengguna, IKHLAS akan meminta membuat akun Admin pertama. Tidak ada username/password default yang ditanam di source code.

Google Drive untuk Bukti Transaksi

Bukti transaksi dan mutasi rekening tidak disimpan sebagai blob di SQLite dan tidak disimpan permanen di filesystem server. File diteruskan ke Google Drive menggunakan OAuth 2.0. SQLite hanya menyimpan fileId, nama asli, dan MIME type sebagai referensi.

Setup ringkas:

cp .env.example .env
# isi GOOGLE_DRIVE_CLIENT_ID dan GOOGLE_DRIVE_CLIENT_SECRET
npm run drive:auth -w @ikhlas/api
# salin refresh token yang tampil ke GOOGLE_DRIVE_REFRESH_TOKEN

Jika GOOGLE_DRIVE_FOLDER_ID kosong, IKHLAS otomatis membuat folder IKHLAS - Bukti Transaksi di My Drive akun OAuth. Lihat docs/GOOGLE_DRIVE.md untuk langkah lengkap.

Telegram

Isi pada .env:

TELEGRAM_BOT_TOKEN=...
TELEGRAM_CHAT_ID=...

Jika dua value ini kosong, transaksi tetap tersimpan dan notifikasi Telegram dilewati.

Backup Database

Backup lokal manual:

npm run db:backup

Backup langsung ke Google Drive:

npm run db:backup:drive

Untuk auto backup di VPS/deployment, aktifkan:

GOOGLE_DRIVE_BACKUP_ENABLED=true
GOOGLE_DRIVE_BACKUP_HOUR=2
GOOGLE_DRIVE_BACKUP_MINUTE=0
GOOGLE_DRIVE_BACKUP_TIMEZONE=Asia/Jakarta
GOOGLE_DRIVE_BACKUP_RETENTION=30

Default tersebut berarti satu snapshot konsisten setiap hari pukul 02:00 WIB, dengan 30 backup terakhir dipertahankan. File disimpan private di folder IKHLAS - Backup Database pada Google Drive. Jika server baru hidup setelah jam backup dan snapshot hari itu belum ada, scheduler akan membuat backup yang tertinggal.

Jalankan scheduler hanya pada satu instance API utama agar deployment multi-instance tidak membuat backup ganda. Detail setup dan restore ada di docs/GOOGLE_DRIVE.md.

Struktur Repo

ikhlas-cp/
├── apps/
│   ├── api/
│   │   ├── data/              # SQLite & backups (ignored)
│   │   └── src/
│   └── web/
│       ├── public/            # manifest, service worker, icon
│       └── src/
├── docs/
│   ├── API.md
│   ├── ARCHITECTURE.md
│   ├── GOOGLE_DRIVE.md
│   ├── RESEARCH.md
│   └── SECURITY.md
├── .impeccable/design.json
├── DESIGN.md
└── PRODUCT.md

Catatan Scope

Laporan yang tersedia sekarang adalah laporan kas operasional, bukan implementasi penuh laporan keuangan formal ISAK 35. Implementasi ISAK 35 penuh memerlukan kebijakan akuntansi, klasifikasi aset/liabilitas/aset neto, dan catatan laporan keuangan yang berada di luar scope proposal capstone saat ini.