Published by Oscar Öhrn Pagerup
Introduction
EU Opportunities is a free Swedish-language guide to EU-funded programmes for young Europeans aged 18–35. It brings together information about volunteer work, interrail travel, paid internships, and job support in a single structured resource — written clearly and without bureaucracy.
Objective
The European Union funds a wide range of opportunities for young people, but information about them is scattered across dozens of official websites in varying languages and levels of accessibility. The goal of EU Opportunities was to gather all of this into one place — clearly written in Swedish, designed for a young audience, and organised so that a visitor can go from knowing nothing to submitting an application in a single session.
The site covers five languages (Swedish, English, Spanish, Italian, and German) to reflect the range of users who might benefit, while keeping Swedish as the primary editorial language for the core audience.
Tools
- Next.js 15 — App Router with file-based locale routing and static site generation via
generateStaticParams - React 18 — component-based UI with client and server components
- Tailwind CSS — utility-first styling with a custom design system using CSS variables
- Custom fonts — IBM Plex Sans, IBM Plex Serif, and Syne via Next.js font optimisation
- Middleware — locale detection and redirect logic for five supported languages
- JavaScript / JSX — no TypeScript; kept deliberately simple
Challenges
The most persistent challenge was deployment. The site worked flawlessly in local development and local production builds, but the Netlify deployment consistently served unstyled HTML. Diagnosing this required working through several layers: incorrect publish directories, a committed node_modules folder exceeding GitHub’s 100 MB file size limit, a Next.js security vulnerability blocking Netlify’s upload pipeline, and ultimately a conflict between the Next.js runtime and cached redirect responses from earlier failed deploys.
Internationalisation added architectural complexity. The middleware-based locale routing — redirecting root traffic to the correct language prefix — had to be carefully configured to exclude Next.js static asset paths, as overly broad matchers caused CSS requests to be intercepted and redirected rather than served directly.
On the content side, the challenge was editorial: distilling dense official EU programme documentation into language that is genuinely readable for a 20-year-old encountering these opportunities for the first time.
Written by Oscar Öhrn Pagerup
← Back to showcase
