Mobile top-ups across all 27 EU countries: a 6-language product, payment gateway and ads with an automatic budget ladder

The task

A German telecom operator needed a storefront service: a person enters a number, the system detects the country and operator, shows the amount in their currency and sends them to payment. No accounts, no extra fields. Plus a lawful cookie layer, an Imprint, seven legal documents in six languages and ads ready to roll out to five countries.

The product

Next.js 16 and React 19 with strict TypeScript, Tailwind 4, Radix and Motion. The home page is the product: the “number” step with an IP-based flag, the “operator” step with prefix detection (libphonenumber) and a “looks like Vodafone” hint, the “amount” step, the “payment” step. Ad landings pre-fill country, operator and amount via URL parameters.

Data: 27 countries, 150 operators, 113 logos imported, generated and sanitised by scripts; six non-euro currencies with ECB rates, server-side calculation and rounding up. Six languages, about 200 UI keys and 6,680 lines of legal text.

Payments and security

The payment provider boundary lives in an adapter for its contract, with hand-off to the payment form and a webhook handler. A hard rule: the browser returning from the payment page is not a payment — only the server confirmation is.

Per-request CSP nonce with strict-dynamic, HSTS, X-Frame DENY, Permissions-Policy, rate limit, identical Zod validation on client and server, no PII in logs or analytics — the tracking function rejects PII keys.

Quality

55 Vitest unit tests and 14 Playwright e2e tests (Pixel 7 and desktop): gateway contract, price parity across screens, XML validity of logos, accessibility (16 px text, 44 px targets, focus trap), a ban on the wrong legal entity in copy.

Ads and budget automation

A CSV generator for Google Ads Editor straight from site data: 27 language files, live import for DE, IT, FR, ES, PL — 10 campaigns, 45 ad groups, 383 keywords (cut from 10,426 to those that actually convert), 1,037 negatives, 45 responsive ads, a built-in Google policy validator.

The problem: Google Ads data lags three hours, and the bank blocks the card on sudden spend jumps. The solution — a “×2 ladder at 55% spend” script plus our own server-side click counter: it parses the nginx log, filters AdsBot and reviewers, deduplicates and sends Telegram alerts.