A&D Voyage — Northern Morocco Tour Operator Platform

The problem

A&D Voyage is a Northern Morocco tour operator specializing in authentic regional circuits through Tangier, Chefchaouen, Tetouan, Akchour, and Al Hoceima. Their audience spans three distinct linguistic groups: domestic Moroccan travelers who read Arabic, French-speaking Moroccan diaspora and Francophone visitors, and international English-speaking travelers. Most off-the-shelf agency themes either butcher Arabic typography and bidirectional RTL layout, or rely on dozens of heavy third-party plugins that drag down mobile performance in areas with spotty cellular reception.

My role

I served as the sole developer and UI designer for the project, creating the bespoke brand design system ("Rif & Strait Field Atelier"), architecting a custom server-side static prerendering engine, implementing the trilingual content and RTL layouts, and building an automated build-time SEO verification test suite.

What I built

Lightweight React 19 & Tailwind CSS v4 architecture: Avoided third-party UI component and icon library bloat by handcrafting accessible, reusable UI primitives (Button, SectionHeading, Chip, FaqAccordion, ItineraryAccordion, inline SVG icons). The codebase maintains an ultra-lean bundle footprint (under 600 KB total initial JavaScript budget).
Custom SSR static prerendering pipeline: Built an in-house static generator using react-dom/server's renderToString (entry-server.tsx) that compiles every route across all three locales into static HTML files at build time (scripts/prerender.tsx), injecting route-specific canonical tags, hreflang alternates (ar, fr, en, and x-default), and Schema.org JSON-LD before deployment to Vercel.
Automated build-time SEO verification gate: Created scripts/verify-seo-build.ts to re-parse generated static output as a hard build gate. It validates single H1 and canonical presence, tests for complete hreflang parity, asserts zero fake review schema, verifies image alt attributes, and guarantees no broken internal links exist before deployment.
Native bidirectional RTL/LTR internationalization: Implemented a zero-dependency typed i18n dictionary system with full right-to-left layout flipping (dir="rtl") powered by Tailwind v4 CSS logical properties (ms/me, ps/pe, start/end), pairing Noto Kufi Arabic typography for Arabic with Fraunces and Plus Jakarta Sans for Latin scripts.
Interactive departures calendar & pricing matrix: Built a structured tour departure calendar and multi-tier pricing calculator supporting seasonal date variants, per-person rates, and group travel options.
Direct reservation funnel: Designed a streamlined inquiry flow connecting Formspree form submission with an immediate prefilled WhatsApp conversation handoff.

Results

Because I do not have direct access to A&D Voyage's private Google Analytics or booking records, no unverified traffic or reservation figures are claimed here.

Owner TODO: if A&D Voyage provides confirmed monthly booking numbers, inquiries generated via WhatsApp, or Search Console performance metrics, those verified figures will replace this note.