Quentin Hunckler's adventure journal
A self-hosted adventure journal for an outdoor athlete: a content-managed personal site with a block-based landing builder, a custom CMS back-office, and a Cloudflare R2 media library, built to replace social networks.
Next.js 16
TypeScript
CMS
Web Design
Context. A personal site for Quentin Hunckler, an outdoor and endurance athlete and photographer (treks, marathons, climbing). It is his own carnet d'aventures to share his trips off the social networks. I handled both design and development, end to end.
#What I built
- A block-based landing-page builder, the main piece. The homepage renders an ordered list of configurable blocks from the database through a clean registry. There are 10 block types (hero, about, featured, feed, gallery, rich text, image and text, quote, video, CTA), each with a Zod schema and defaults. Each block says what data it needs, so the page only loads what it actually shows. Quentin reorders and toggles blocks himself, drag and drop.
- A custom headless CMS with JWT-cookie admin auth, CRUD for stories and a field feed, and a shared block editor.
- A Cloudflare R2 media library, with a nice touch: a storage gauge that tracks usage against the free tier and warns before it fills up.
- A distinctive "Carnet d'expédition" look: dark mode only, topographic contour lines in the background, bold type.
#My role
Solo, end to end. Full-stack engineering (architecture, custom CMS, auth, DB schema, R2, server actions) plus the product and visual design.
#Stack
Next.js 16 (App Router, Turbopack), React 19, TypeScript, Tailwind v4, shadcn/ui, Turso (libSQL), Cloudflare R2, jose and bcrypt auth, Zod, Vercel.