Skip to main content
  1. Projects/

Qurban Al-Mustadam

April 2026 — June 2026

A live status board for Qurban (Islamic sacrifice) processing at Masjid Al-Mustadam. Each animal moves through five stages — Persiapan, Disembelih, Pengolahan, Distribusi, Selesai — and families waiting on their share can watch it happen in real time instead of asking.

Features that made it into the field: a per-animal detail page with a stage timeline, weight information and shohibul list; a weighted overall progress summary; filtering by ID, species, status and location; a barcode scanner page for event validation with weekly deduplication; and Web Push notifications when an animal’s status changes.

The design decision I’m happiest with is the one I didn’t make. There is no database. Mosque operators update a Google Sheet — a tool they already know and already trust — and the site reads it through the Sheets API with a service account and ISR. Building a proper admin panel would have been more impressive and materially worse: it would have meant training volunteers on new software during the one week of the year everyone is busiest.

Built with Next.js 16 (App Router, ISR), Tailwind CSS v4, Google Sheets API v4, and web-push.

Live   Source

Related