Case study · 02

Dar Al-Ilm

Islamic Learning Platform | Volunteer Project

A volunteer full-stack platform for organizing Islamic audio lessons, PDF books, book-page images, and YouTube lectures across a mobile app and an administrative dashboard.

RoleIndependent Full-Stack Developer

StatusVolunteer project; admin deployed and Android release preparation in progress.

CategoryVolunteer work

01 · Overview

The project

Dar Al-Ilm brings trusted teaching material into a structured, multilingual catalog that stays useful with limited connectivity. It pairs a cross-platform learner experience with tools that make a large media library manageable for content administrators.

02 · Contribution

My role

Developed independently with AI-assisted programming support. I defined the product requirements, system architecture, database relationships, user workflows, implementation decisions, debugging process, and validation.

03 · Product

Key features

Background audio, lock-screen controls, playlists, speed control, and resume position

Offline audio and PDF downloads with cached and bundled catalog fallback

PDF reading and lesson-linked book-page images

English, Amharic, and Arabic interfaces

Bulk media uploads with automatic filename-to-lesson matching

YouTube playlist import with titles, thumbnails, IDs, and durations

Admin tools for courses, books, lessons, series, scholars, and channels

04 · Implementation

Technical architecture

Expo and React Native mobile application

Next.js administrative dashboard on Vercel

Supabase PostgreSQL, Storage, and Authentication

Local seed data, cache, storage, and downloaded media

Technology

React NativeExpoTypeScriptNext.jsReactSupabasePostgreSQLSupabase StorageSupabase AuthYouTube Data APIexpo-audioExpo FileSystemAsyncStorageReact Native WebViewVercelEAS Build

05 · Process

Challenges and decisions

Designed offline-first catalog hydration: bundled data first, cached data next, then live synchronization.

Created filename conventions so leading numbers automatically connect uploaded book-page images to lessons.

Kept YouTube online-only and documented embed-policy limitations instead of implying offline support.

Privacy and project access

Only cleared product screens are shown. Private scholar, stakeholder, and deployment information remains excluded.

Screenshots

Inside the product.

Dar Al-Ilm course detail — Course detail

Dar Al-Ilm download screen — Offline downloads

Next case study

ParkWise — Smart Parking Management System

Interested in the work?

Ask me about this project.

Contact me