The package
Every trip on hujjaaj.com starts as a card like this: the dates, who operates it and the lowest price, over a photograph of the Haram.
Hujjaaj
Crafting memorable and devout Umrah experiences.
- Role
- Brand, Experience design, Web engineering
- Built with
- Nuxt 3, Vue, Supabase, C# API (2019)
- Years
- 2019–2025
- Live
- hujjaaj.com ↗
Pilgrimage travel is full of details that matter: which flight, which hotel, how far from the Haram, how many to a room, what a child costs. Hujjaaj makes those details legible before someone commits to the most important trip of their life.
It started in 2019 as a static site with a C# API behind it, and was rebuilt in 2023 as a Nuxt 3 app on Supabase. In 2026 the same problem came back as Motamer, a concierge that lets you build the whole trip yourself. The package, flights and quote below come from the 2023 rebuild; Motamer follows them.
The flights
Each leg of a package gets one card: carrier, route and date up front, the full routing a tap away. The original assumed one stop; this port takes any number, with layovers and journey times worked out across time zones.
The quote
Pick travellers and the room plan packs itself: quads first, then a triple or double for the remainder. Or choose each room yourself and watch the summary reprice live, with child fares, infant and bed-sharing supplements, and the deposit due today.
Sequel, 2026
Motamer
Build your Umrah trip, and we'll find you the best real price.
Motamer revisits the Hujjaaj problem from the traveller's side. Instead of choosing from fixed packages, a pilgrim assembles the trip: how the nights split between Makkah and Madinah, flights into Jeddah and home from Madinah, and a hotel in each city. Then they review it and send it to a person who books it.
That last step is deliberate. Selling flights to UK consumers without an ATOL licence is a criminal offence, so the product takes no payment: the conversion is a lead, and people do the booking behind the scenes. The code is built to match, with ports and adapters so mock flights and curated hotels can be swapped for live suppliers without touching the interface.
- Built with
- Next.js 16, React 19, TypeScript, Supabase, Cloudflare
- Live
- motamer.com ↗
Split the nights
A package decided how the nights were split. Here one handle does it: the two stays always add up to the whole trip, each city keeps at least one night, and flying into Madinah swaps their order.
Build the whole trip
The builder itself, its React components ported nearly verbatim. After the split come a flight, a hotel in each city sorted by distance to the Haram, and a review that goes to a person, not a checkout. The flights and hotels here come from its mock and curated adapters.
The code
262 commits, made on 97 separate days, in 7 repositories.
- HujjaajWeb171
- hujjaaj-nuxt59
- HujjaajAPI12
And 4 smaller repositories, with 20 commits between them.