← Back to Blog
Case Study

Le National
Montreux

A full-stack luxury apartment booking site built from scratch — real-time availability via iCal, Stripe checkout, multi-step guest check-in with PDF invoice generation, deployed globally on Cloudflare Pages.

Le National Montreux luxury apartment website homepage
98
Lighthouse Score
<30s
Deploy Time
100%
Custom Code
0
Page Builders

The Brief

Le National Montreux is a luxury apartment in the heart of Montreux, Switzerland — a few minutes from the lake, the jazz festival, and the Freddie Mercury statue. The client needed a site that matched the quality of the property itself: elegant, fast, and fully functional for direct bookings.

The requirements were clear: no off-the-shelf booking platforms, no commission fees to third parties, and a guest experience that felt as refined as the apartment. Everything had to be custom-built and owned outright.

"We needed something that looked as good as the property — not a generic Airbnb clone. The site had to handle real bookings, real payments, and real guests from day one."

What Was Built

The entire site is hand-coded HTML, CSS, and JavaScript — no frameworks, no CMS, no page builders. Every interaction was purpose-built for this property.

📅
Live Availability Calendar
Real-time blocked dates parsed from iCal format. No double bookings, no manual updates.
💳
Stripe Checkout
Server-side payment sessions via Cloudflare Workers. Guests pay directly — zero commission to platforms.
📋
Multi-step Check-in Form
Progress-tracked guest registration with jsPDF invoice generation — no backend database required.
🖼️
Full-screen Hero Slideshow
Fade-transitioning AVIF image carousel with overlay gradient — loads fast, looks premium.
🌍
Global Edge Deploy
Cloudflare Pages — live within 30 seconds of a git push, served from the nearest edge node.
📱
Mobile-first Design
Clamp() fluid typography, responsive layout — flawless on every screen size.

Tech Stack

HTML / CSS / JS Cloudflare Pages Cloudflare Workers Stripe Checkout API iCal Parsing jsPDF GitHub CI/CD AVIF Images

The Availability System

One of the trickiest parts was the availability calendar. The client manages bookings across multiple platforms (direct, Airbnb, etc.) and needed the site to reflect real blocked dates automatically — without any manual admin work.

The solution: a Cloudflare Worker that fetches and parses an iCal feed on demand. Blocked date ranges are extracted from DTSTART/DTEND fields, normalised to ISO format, and returned to the front end as a sorted array. The calendar UI highlights unavailable dates in real time — no database, no cron jobs, no third-party booking widget.

Stripe Integration

Payments go through a server-side Cloudflare Worker endpoint that creates Stripe Checkout sessions with dynamic pricing and redirect URLs. The client keeps 100% of the booking value — no platform fees, no commission cuts.

CORS is locked to the exact domain whitelist. The Stripe secret key lives in Cloudflare environment secrets — never in source code, never in version control.

Performance

With 43 AVIF images and a full-screen slideshow, performance could easily have been a problem. It wasn't. The result: 98/100 Lighthouse performance score — achieved through lazy loading, next-gen image formats, and zero render-blocking resources.

Cloudflare's global edge network handles the rest — TTFB under 100ms from anywhere in Europe, HTTP/2, and automatic HTTPS with HSTS.

The Result

A luxury booking site that looks the part, works reliably, and costs the client nothing in ongoing platform fees. Direct bookings mean higher margins. A custom check-in flow means fewer back-and-forth emails. And a 98 Lighthouse score means guests on slow mobile connections still get a fast, smooth experience.

Live site: lenationalmontreux.ch — hand-coded, Cloudflare-deployed, Stripe-powered.

Need a site like this?

Every site I build is custom-coded — no drag-and-drop, no page builders. Fast by default, deployed globally.

Start a project →