Domusa Teknik 40 MLK
Nine summits, 65 kilometres and 4,000 metres of climbing in the Urola valley, in a single day. The race website sent 1.35 MB of HTML before loading a single photo and kept its information in PDFs. JZ Forge audited it, proposed a three-phase plan and brought a working prototype to the meeting. Today it is the race website, admin panel included.
- Client project
- 2026
- Web
- Role: everything
- Status: live at domusateknik40mlk.com
The Domusa Teknik 40 MLK is a mountain race organised by Lagun Onak MB from Azpeitia: the 40 MLK, 65 kilometres long, and the 15 MLK, 26 kilometres, over the summits of Azpeitia, Errezil, Bidania-Goiatz and Beizama. The sixth edition starts on 8 May 2027, with places for 550 runners on the long course and 400 on the short one.
Its website is WordPress with the Avada theme, two page builders at once (Elementor and Fusion Builder), WPML and an Instagram plugin. It works, but the organisers maintain it by hand, the key information lives in PDFs and the results are spread across four different places.
The home page sends 1.35 MB of HTML before any image, because the theme inlines all its CSS on every page. Out on the mountain, with poor coverage, is exactly when a runner needs the technical sheet. And that sheet, with aid stations, climbs and cut-off times, lived in tables and PDFs that force you to zoom on a phone.
There are broken links, paths with a wrong prefix, and the spectator guide only exists in Basque. The race date is edited by hand in several places and no longer matches between the home page and the technical sheets. The organisers needed to publish news, sponsors and alerts without depending on anyone, and without losing what they edit in WordPress today.
A new site with colours taken from the gradient of the logo and a condensed, sporty typeface: a home page with a countdown to the start, a page for each race with the elevation profile, the aid stations and their cut-off times, results by edition, gallery, sponsors by tier, news and contact. Each race page adds a course map over the IGN aerial imagery that you can fly over end to end. Basque as the main language, Spanish and English, each with its own URLs.
The organisers edit everything at /admin, a panel built with Payload inside the same app: news with drafts, scheduled publishing and version history, races, sponsors reordered by dragging, gallery, edition details, contact form messages and users. Every field has its version in each language on the same screen, with a live preview. An urgent alert shows on every page with one click.
Everything. The audit of the current site, the proposal document with 25 improvements in three phases, the design from the logo, the migration of texts, technical sheets, news and photos, the Next.js app, the admin panel, the infrastructure on Vercel with Turso and Vercel Blob, the presentation to the organisers and the launch.
Key decisions, and why:
- The panel lives inside the site. Payload runs in the same Next.js app, so there is no separate CMS to host, pay for or update. The site reads content through a single layer that returns the same types that used to come from static files, and the components barely changed when the panel was connected.
- Static, regenerated on save. Every public page is prerendered at build time. When the panel saves, a hook regenerates the affected pages and the sitemap, so visitors see the change within seconds without the site hitting a database on every visit.
- The data draws the sheet. The elevation profile is SVG generated from the official GPX and the aid stations of the technical sheet, with no chart library and no client JavaScript. Cut-off times are orange, the only colour outside the brand blue, because that is the information nobody can miss.
- SQLite locally, Turso in production. In development the database is a file and photos go to a folder. On Vercel the disk is ephemeral, so data goes to Turso, hosted SQLite with the same adapter, and photos to Vercel Blob with the project OIDC token, with no keys to store.
- An initial load that loses nothing. The content migrated from the current site is loaded into the panel by a migration that runs only once on deploy. The first time it ran without Vercel Blob connected, and the photos were written to the ephemeral disk of the build: the records were left pointing at files that did not exist. A second migration uploads them again onto the same records, without breaking the gallery, news or races that use them.
- An honest profile, first without the GPX. While there was no official track, the profile was built from the official altitudes of aid stations and summits, interpolating the kilometre of each summit between checkpoints. With the GPX, the profile and the map come from the track, altitudes from the IGN 5 m digital terrain model, and the summits keep their official altitude. The site explains it under the chart.
- Content never depends on JavaScript. Entrance animations use CSS scroll timelines inside an @supports block, and text always starts visible. Only the mobile menu, the countdown and the map are client components: if any JavaScript fails, the whole site still reads, and reduced motion is respected.
The site is live at domusateknik40mlk.com, in Basque, Spanish and English: both races with their technical sheet, profile and course map, results for every edition since 2022 searchable by name, bib or town, the spectator guide in all three languages, gallery, sponsors, news and contact. The home page goes from 1.35 MB of HTML to under 200 KB.
The proposal was presented to the organisers in October 2026 and the site went live that same month, with the old URLs leading to the new ones. Since then the organisers publish news, alerts and sponsors from the panel, on the way to the sixth edition on 8 May 2027.
- Bring something that works. A prototype with real content convinces more than any mockup. The organisers do not have to imagine the panel: they log in, change a text and see it on the site.
- Measure before you judge. Saying a site is slow moves nobody; 1.35 MB of HTML before the first photo does. The diagnosis was written with numbers and without criticising the work already done.
- One fact, one place. The race date did not match between the home page and the sheets because it was edited by hand in several places. In the panel it is written once and feeds the countdown, the sheets and the share images.