Dr Maroc

Project Overview

Dr Maroc modernizes healthcare operations in Morocco by giving doctors, clinic assistants and patients dedicated digital tools instead of paper and phone calls. What began as a single Spring Boot + React application has since grown into a full platform: a Next.js marketing site, three role-scoped Angular portals — admin, provider and patient — sharing a common Nx library layer, a modular Spring Boot backend, and a self-hosted Keycloak service with a custom login theme and email-based two-factor authentication. Doctors manage availability, consultations, structured e-prescriptions and certificates generated from configurable templates; patients book appointments and access their records; clinics operate under subscription plans that gate premium features. The platform is available in French, Arabic and English.

Features

• ✓Role-based portals — dedicated Angular applications for platform admins, providers (doctors and assistants), and patients, sharing a common auth, UI and data-access library layer
• ✓Appointment scheduling — conflict-aware booking engine handling availability, cancellations and rescheduling
• ✓E-prescriptions & certificates — structured medication, analysis and radiography prescriptions, plus certificates generated from configurable templates
• ✓Patient records — digitized, secure medical history with role-based access
• ✓Subscription plans — feature entitlements tied to configurable subscription tiers
• ✓Multi-language — French, Arabic and English across the website and portals
• ✓Self-hosted identity — custom Keycloak login theme with email OTP two-factor authentication

Challenges

• •Splitting a single frontend into three independent, role-scoped portals without duplicating business logic
• •Modeling flexible clinical data — prescriptions, certificates, forms — that varies by specialty and clinic
• •Running a self-hosted identity provider with custom theming and MFA instead of a managed IAM service
• •Deploying several independently versioned repositories to a single VPS reliably

Solution

Restructured the frontend around an Nx monorepo so the admin, provider and patient portals reuse the same auth, UI and data-access libraries instead of three separate codebases. Moved authentication and authorization out of the application layer entirely into a dedicated Keycloak service with a token-driven custom theme and an email OTP second factor. Modeled prescriptions, certificates and clinic forms as configurable templates rather than hardcoded flows, and gated premium functionality through subscription-plan entitlements enforced by the backend. Each repository ships through its own CI/CD pipeline to a shared VPS.

Architecture

A modular Spring Boot backend exposes a REST API secured by OAuth2/OIDC against a self-hosted Keycloak service with a custom login theme and email-based 2FA. Three role-scoped Angular applications (admin, provider, patient) share authentication, UI and data-access libraries through an Nx monorepo, while a separate Next.js site handles marketing and public content in French, Arabic and English. PostgreSQL backs both the platform and identity services; every repository is containerized and deployed independently via GitHub Actions.

Results & Impact

• ✓Live at drmaroc.com, serving real doctors, assistants and patients in Morocco
• ✓Grew from a single app to a multi-repository platform (website, three portals, backend, identity service) without a rewrite
• ✓Self-hosted identity service with custom theming and 2FA, decoupled from the application layer