01 / Overview
Overview
A bilingual, Arabic-first marketing and lead site for Remas Residences — an Egyptian real-estate developer established in 2011 and based in New Borg El Arab, Alexandria. React 18 + TypeScript on Vite 6 and Tailwind 4, with a custom build-time prerenderer that writes real per-locale metadata for every route. The content model refuses to publish an unverified price, delivery date or unit count: commercial fields are optional, every project record starts non-indexable, and promotion is an explicit decision.
02 / The Problem
The Problem
Egyptian real-estate marketing runs on invented numbers — prices that were never approved, delivery dates nobody committed to. The developer wanted a site that sells the company without saying a single thing it cannot back up.
03 / My Contribution
My Contribution
Design + Front-End Architecture
The available record identifies the role above. Team structure, pre-existing work, and individual task ownership are not stored, so no further attribution is claimed.
05 / Key Decisions
Key Decisions
I made honesty a data structure
A rule in a document gets broken by the next person in a hurry. So the type system carries it instead: commercial fields on a project are optional, every record defaults to source-documented and non-indexable, and there are no placeholder zeros or em-dashes sitting there waiting to be published by accident. Promoting a project to a public, indexed page is a deliberate act, not a default.
Arabic is the design, not the mirror
The locale lives in the URL and RTL is structural — logical properties throughout, directional icon swapping, and a hero gradient drawn independently for right-to-left rather than flipped. An Arabic page never even downloads the Latin display fonts. Buyers in Borg El Arab read the site their language was designed for, and the English version is the translation.
Crawlers don't run JavaScript, so I stopped asking them to
A client-side SEO component means every shared link previews the same homepage. The build now emits a static HTML document per locale route with its own title, description, canonical, hreflang, Open Graph and JSON-LD, plus sitemap, robots and llms.txt. One metadata module feeds both the browser and the prerenderer, so the two can never drift apart.
Renders that admit what they are
Photography of the finished compound does not exist yet, so the site ships concept visuals — labelled in both languages as conceptual, and swapped out the moment approved photography arrives. They are served as pre-generated WebP derivatives at six widths through a sizes preset, with the hero preloaded as the LCP candidate; the PNG masters never leave the repository.
The lead ends where the sale already happens
No CRM, no dashboard nobody would open. The consultation form validates in place with aria-invalid and described-by wiring, then hands a structured conversation to WhatsApp — the channel the sales team already lives in. Server-side intake and notification are scoped and waiting on the hosting decision, and the README says so rather than pretending they exist.
08 / Result