Context
Nomad Arabia is the live-events agency in the group of companies I run technology for: capital-markets forums in Riyadh and Hong Kong, the Tadawul ring-the-bell ceremony, Mercedes-Benz and BMW launches and activations across the GCC, the X-CAT World Series. Its public site was a WordPress theme with a heavy plugin stack, and it had become the odd one out: every other property in the group was on Next.js with a shared deployment and security posture, and the WordPress install was one more thing to patch, back up and defend.
The brief I set myself was strict: move it to the same stack as the rest of the group, keep every URL, and make the result visually indistinguishable from the original. A marketing site for an agency that sells visual experiences cannot come back looking "migrated".
What I built
A faithful reconstruction, not a redesign
The theme's stylesheets are served unchanged from public/assets/css in their original load order, and the asset folders mirror the theme's layout so every relative url(../fonts/...) and url(../images/...) reference resolves without editing a line of CSS. The brand fonts (Muller, Future Flow) were missing from the saved pages, so I recovered them from the live theme. Plain <img> and <video> tags reproduce the original markup exactly rather than routing through next/image.
The animation layer, ported
The original relied on jQuery, slick sliders, GSAP with ScrollSmoother, AOS reveals and a Fancybox gallery. A single SiteScripts component loads those libraries in order and ports the theme's initialisation logic: hero text reveal, sponsor marquees, the event slider, sticky header, scroll-to-top, lightbox and smooth scrolling. Initialisation is idempotent and re-runs on client-side navigation, which is the detail that makes an App Router site with jQuery-era plugins behave.
Twelve event pages from one data module
src/data/events.js holds the portfolio: twelve events with the slugs the WordPress site used, so every existing link, share and search result keeps working. Each renders through a dynamic [slug] route with copy, showcase video and gallery.
Assets brought home, selectively
Images, fonts and theme files were localised into the repository. Videos were first self-hosted, then the large event showcase clips were moved to a CDN and dropped from the repo to keep clones and deploys fast. The homepage hero video was later swapped for a Nomad Hospitality clip as the group's positioning shifted, and the footer gained a Group of Companies section linking the sister brands.
Decisions worth noting
- Fidelity over cleverness. Rewriting the theme in Tailwind would have been more elegant and would have changed the site. Serving the original CSS verbatim was the fastest route to a pixel-faithful result and made the migration reviewable by anyone: open both sites side by side.
- Same URLs, same slugs. Preserving the event slugs cost nothing and protected years of inbound links.
- One stack for the group. After this move every public property in the group runs on Next.js, which means one deployment model, one set of security headers and one place to look when something breaks.
Why it is in the portfolio
It is a small, complete example of the unglamorous CTO work that keeps a group of companies coherent: retiring a platform, preserving everything the business cares about, and doing it quietly. It is presented at its true scale, a marketing-site migration, alongside the platform builds it sits next to in the group.