MR
← Back to portfolio
Badeel - Image 1

Badeel

Project Overview

Badeel is a comprehensive Saudi Arabian employment and labor exchange platform designed specifically for the Kafala (sponsorship) system workforce. Built with a localized Arabic-first approach, the platform serves two primary user types: Kafeels (Employers/Sponsors) and Workers.
Beyond standard job board functionalities—such as job postings, worker searches, and real-time direct messaging—the platform introduces a highly complex, proprietary worker-transfer matching system known as البديل (Al-Badeel).

The "Badeel" Swap Engine

The core technical challenge of the platform is the "Badeel" feature: a multilateral swap system that allows workers to exchange positions across different cities.
  • Direct Matches: 1-to-1 position swaps (e.g., a worker in Jeddah swapping with a worker in Riyadh).
  • Chain Matches: Resolving complex, multi-person directed graph cycles (e.g., A → B, B → C, C → A) to ensure all parties reach their desired locations and professions.
  • The matching engine runs via background jobs utilizing advanced graph traversal (BFS cycle detection/Recursive CTEs).

Key Architectural Features

  • Complex Subscription & Payment Tiers: A multi-tier subscription model (Free, Bronze, Silver, Diamond) that gates premium features like Chain Matching and search priority, integrating with local Saudi payment gateways (Moyasar) for Mada processing.
  • Real-time Communication: In-app messaging and notification delivery powered by Socket.io, with dedicated group chats generated automatically upon successful chain match confirmations.
  • True i18n & RTL Support: Bidirectional UI supporting Arabic (RTL) and English (LTR) using Next.js and Tailwind CSS rtl: variants.
  • Strict Moderation & Security: Robust role-based access control (RBAC) for Super Admins and Moderators, document verification for Kafeels via SMS OTP (Unifonic), and user-driven content flagging queues.

Tech Stack & Skills

Frontend:
  • Next.js (App Router)
  • TypeScript
  • Tailwind CSS
  • shadcn/ui (optimized for RTL)
  • TanStack Query (Server State)
  • Zustand (Client State)
  • next-intl (i18n)
Backend & Architecture:
  • Node.js / NestJS
  • TypeScript
  • PostgreSQL & Prisma ORM (Relational data & recursive graph traversal)
  • Redis / Upstash (Rate limiting & Socket adapter)
  • Socket.io (Real-time features)
  • JWT Authentication
Infrastructure & Integrations:
  • Vercel (Frontend) & Railway (Backend)
  • Supabase (Database Hosting)
  • Cloudinary (Media Storage & Compression)
  • Moyasar (Payment Gateway)
  • Resend (Transactional Email)
  • Unifonic (Saudi SMS OTP)