Dirasah
Academic Platform
TECHNOLOGY STACK
Overview
Dirasah is an academic platform designed for Qawmi Madrasah curriculum. It provides comprehensive access to religious texts with Arabic content, translations, detailed analysis, note-taking capabilities, and community discussion features. The platform empowers students and scholars to engage deeply with their studies in a secure, collaborative environment.
Goals
- ◆Create an intuitive interface for navigating complex Arabic texts
- ◆Build a robust note-taking system with verse-level annotations
- ◆Enable community discussions while maintaining a focused learning environment
- ◆Ensure accessibility across devices for students worldwide
Challenges
- ◇Implementing right-to-left (RTL) text support with proper typography
- ◇Building a performant search system for Arabic content
- ◇Managing complex state for reading progress and annotations
- ◇Optimizing load times for large text collections
Implementation
The platform was built using Next.js for server-side rendering and optimal SEO. We implemented a custom RTL layout system and used Prisma ORM with PostgreSQL for efficient data management. The frontend leverages React Query for caching and Tailwind CSS for responsive styling. Special attention was paid to typography, using carefully selected Arabic fonts for readability.
Results