JUMTA Export — A Webflow Site Rebuilt in Next.js + Sanity Through the Webflow API

JUMTA Export sources Nigerian agricultural commodities, such as hibiscus, sesame, ginger and frankincense, for buyers in the US, Mexico, Europe and the Gulf. Most buyers first hear about it through direct outreach, so the website is the credibility check a buyer makes after reading an email: who is this, what do they handle, and where does their responsibility end?

I designed and built the original site in Webflow. As the JUMTA Group grew into a family of sites, I rebuilt it in Next.js and Sanity, so it could share one design system and one way of working with its sister sites. The design stayed the same, and the brand was refreshed along the way: the site became "JUMTA Export", with its own green accent and logo, and moved to export.jumta.com.ng.

‍

The Webflow site worked, but building it had shown where a visual builder struggles:

• Content drifted between pages. The same phone link had to be fixed on four pages separately. Section spacing quietly ended up different on different pages (96px on one, 88px on another, against a 100px spec). The homepage's short version of the seven sourcing steps once described different steps from the detailed page.
• The sourcing form needed workarounds. Commodity checkboxes arrived in the notification email as a row of raw true/false values. Pre-selecting a commodity from its own page needed a hand-written script that ran after Webflow's own form code.
• "Related commodities" had no clean fallback when a category had fewer than three items.

The rebuild had to keep the look and every interaction buyers already saw, while making that whole class of bug impossible rather than something to re-check by hand.

‍

Move the content the way a larger client project would

With only six commodities, retyping them into Sanity would have been quicker. I built a real Webflow Data API → Sanity import pipeline instead, as practice for bigger migrations:

• fetch the collections and items from the Webflow API and save them as files;
• download every image and re-upload it to Sanity's asset store, so nothing depends on Webflow's CDN;
• convert the fields to the new content model and import in two passes, so references between items (category, related commodities) resolve correctly;
• run each step as a dry run first, then check every item in Sanity Studio against the live Webflow page.

All six commodities, their three categories and their photos came across this way.

One source for everything shared

• Site Settings in Sanity hold the phone number, email, credentials and founder details once, for every page.
• One Section component owns the spacing scale (80 / 64 / 48px), measured from the Webflow export's CSS, so pages can't drift apart.
• The seven sourcing steps are written once and shown in two lengths (homepage teaser, full Process page).

Rebuild, don't redesign

The goal was design parity: the same layout, type, colours and motion. I ported Webflow's scroll animations to one GSAP engine that reads the same data- attributes the Webflow export used. The hero's dotted world map is the same Lottie animation, now loaded only when it scrolls into view and shown finished, without animating, for visitors who prefer reduced motion.

A sourcing form that does what it says

• Server-side form handling: email through Resend from the site's own subdomain, Cloudflare Turnstile and a honeypot against spam, and a clean "Commodities interested: X, Y" summary instead of raw true/false values.
• Each commodity page's "Request a Quote" opens the form with that commodity already ticked.
• The "What JUMTA handles vs. what you handle" table spells out FOB and CIF responsibilities row by row, and scrolls sideways on phones with a hint so no column gets squeezed.

Ready for search and the team

Per-page titles, descriptions and canonical links, a sitemap that updates when a commodity is added in Sanity, structured data, a share image drawn from code, and a privacy policy that covers the analytics and the cookie banner. A set of owner's guides explains how to edit content, change styles and deploy.

‍

JUMTA Export now runs on the same Next.js and Sanity foundation as the other JUMTA sites and looks the way buyers already knew it, under its new name. The team adds or edits commodities in Sanity, and the homepage, commodity pages and sitemap update by themselves. Related commodities are picked by hand in Sanity, which at six items is simpler and more editorially sound than an automatic rule.

The bugs that kept coming back on Webflow (duplicated contact details, drifting spacing, mismatched process steps, messy form emails) are designed out: each of those things now exists in one place. A speed and accessibility round after launch trimmed the fonts, loaded the spam check only when the form comes into view, delayed HubSpot analytics and its cookie banner until the page has finished loading, and showed the first screen without waiting for the animation code. The homepage went from 2.8 MB to 0.8 MB, lighter than the 1.4 MB Webflow version. Google's PageSpeed Insights now scores it 87 on mobile and 99 on desktop, with 100 for accessibility, best practices and SEO (13–14 October 2026); the Webflow version scored 90–93 for accessibility. The new site has no layout shift, where the Webflow version measured up to 0.04.

The site went live in September 2026, with the sourcing form tested end to end and the domain verified in Google Search Console.

‍