Masjid Ar Rahmah — Mosque Website & Admin Panel
A bilingual mosque community website with announcements, events, and a password-protected admin panel backed by Supabase — fully self-service content management on a nonprofit budget.
Plate · Masjid Ar Rahmah — Mosque Website & Admin Panel1The Problem
The mosque committee updated weekly schedules through WhatsApp broadcasts and printed notices that quickly went stale — congregants had no single trusted place to check prayer gatherings, events, and announcements, and the committee had no budget for paid tools or maintenance.
2The Solution
Designed and built a calm, editorial-style bilingual site (BM/EN) covering announcements, events, and the mosque story, paired with a password-protected admin panel on Supabase so committee members publish announcements and events themselves — no developer needed after handover.
3The Outcome
The committee now manages all site content themselves through the admin panel, announcements go live in minutes instead of word-of-mouth, and the site runs on Vercel's edge with zero ongoing hosting cost for the mosque.
The Challenge
The mosque committee relied on WhatsApp broadcasts and printed notices. Every schedule change — a talk moved to a different hall, a cancelled kuliah, a last-minute gotong-royong — meant another broadcast that half the congregation never saw. Printed notices went stale within days.
They needed one trusted place where anyone could check what’s happening at the mosque this week. But like most mosques, there was no budget for a subscription website service, no in-house IT person, and no time to learn a complicated CMS. Whatever was built had to be free to run and simple enough for a non-technical committee member to update from a phone.
What We Built
A bilingual (Bahasa Malaysia / English) community site with a calm, editorial design — dark charcoal hero with Arabic calligraphy, serif typography, copper accents, and generous whitespace. It reads like a publication, not a template.
Public pages:
- Home — hero, what the mosque offers (solat berjemaah, kelas Al-Quran, khidmat masyarakat), and the three latest announcements pulled live from the database.
- Pengumuman (Announcements) — the committee’s noticeboard, always current.
- Acara (Events) — upcoming gatherings, classes, and community programmes.
- Tentang & Hubungi (About & Contact) — the mosque’s story and how to reach it.
The admin panel is the real deliverable. Behind a password-protected login at /admin,
committee members can create, edit, and delete announcements and events, upload photos, and see
changes go live immediately. Content lives in Supabase (Postgres) with images in Supabase Storage —
one platform, free tier, zero servers to babysit.
The Stack
Next.js (App Router) with React and Tailwind CSS for the front end. Supabase handles both the database and image storage. Hosting is Vercel’s edge network. Public pages render dynamically so new announcements appear the moment they’re published — no rebuild step between “save” and “live”.
The whole system runs on free tiers by design: the mosque pays nothing monthly, and there are no licenses to renew. It was built, deployed, and handed over complete — including credentials and a walkthrough for the committee.
Results
The committee updates the site themselves — announcements published from a committee member’s phone appear on the homepage instantly. No more chasing WhatsApp broadcasts; the site is the single source of truth.
Hosting cost: RM0/month. Uptime: handled by Vercel’s edge. The mosque got a modern web presence that matches the serenity of the place itself, and the studio got a repeatable blueprint for community and religious organisations that need dignity on a budget.