FERA Training Club

Context

A hybrid functional training centre in Palma de Mallorca, certified as an official HYROX venue. It was opening in July and needed the site ready for founding-member pre-sales, converting from day one.

Mallorca is a three-language market: Spanish, English and Catalan. That wasn’t an optional extra, it was a starting condition.

Approach

• Pure static Astro. No client-side framework island: what reaches the browser is HTML, CSS and a little of our own JS. For a site whose job is to explain the method and drive people to a form, shipping React adds nothing.
• Custom i18n with localised routes for Spanish, English and Catalan, plus a multilingual sitemap. Each language gets its own URL, not a query parameter or a client-side switch.
• Zod 4 validating the form with the same schema that documents the fields. Validation errors are defined once.
• Pre-sale block immediately after the hero — during opening, the conversion was signing founding members, so the form came before any other section rather than on a separate page.
• Native Astro View Transitions between pages. App-like continuity without a client router or the weight it brings.
• Self-hosted typefaces (Hanken Grotesk and Space Mono) as woff2, served from the site’s own domain.

What I built

• Static Astro architecture with TypeScript in strict mode
• Three-language i18n system with localised routes and sitemap
• Design system in Tailwind 4 tokens, built on brand orange over dark grounds
• Class booking and pre-sale forms with Zod validation
• Method, classes, plans, HYROX and shop pages

Outcome

Live on its own domain since opening day. With no CMS and no database, the site has no attack surface to maintain: it’s a directory of static files served by the host.

A note on this work

Built at Xpandex, where I run the full cycle: design, development, performance, accessibility, technical SEO and deployment. Venue photography supplied by the client.