Skip to main content

Saheb App Design System

Screenshot 2026-01-01 at 14.04.11.png

1. Purpose of This Documentation

This presentation explains the design and technical decisions behind our application features.

a. We will be covering:

1. Technology Stack

    • Backend framework

    • Web frontend framework

    • Mobile frontend framework

    • Database technology (PostgreSQL, MySQL, etc.etc.)

    • UI libraries

    • Supporting libraries and tools (state management, datafetching, utilities)utilities)

2. Application Architecture & Project Structure

    • Technical decisions

    • Backend folder structure

    • Frontend folder structure

    • Design patterns and development strategies

3. Localization & Language Support

    • Multi-language database translation strategy

    • RTL (Right-to-Left) support on web and mobile

    • Hijri calendar localization

4. Core Domain Logic

    • Qibla calculation logic

    • Prayer time calculation methods

    • Hijri time caulculation methods

5. Media Management

    • Audio resource handling (Sermon / موعظة)موعظة)

    • Video hosting and streaming strategy

6. Notifications & Communication

    • Timezone-aware push notification system

    • Email notification architecture

    • Notification reliability and crash handling

    • Scheduling notificaiton with cron

8. Application Standards

    • Request logging

    • User event and activity tracking

    • Error and crash reporting

    • API versioning

b. How Each Section Is Documented

For every section in this documentation, we consistently answer the following questions:

  • What solution did we choose?

  • Why did we choose this solution?

  • What are the pros and cons of this solution?

  • What alternative approaches were considered?

1. Technology Stack

a. Backend Framework

What solution did we choose?

    We chose NestJS as the backend framework.

    Why did we choose this solution?

    • Provides a structured and opinionated architecture

    • Built with TypeScript by default

    • Supports modular development and scalability

    • Fits well for APIs serving web and mobile apps

    Pros

    • Clear module-based architecture

    • Strong TypeScript support

    • Built-in dependency injection

    • Easy integration with databases, authentication, and queues

    Cons

    • Steeper learning curve compared to minimal frameworks

    • Slightly more boilerplate

    Alternative Approaches

    • Express.js

    • Fastify

    • Laravel (PHP)

    • Django (Python)

    Back to top