# Swellbase: Founding Product Engineer Application > **A bespoke, interactive candidate application and proof-of-work built with the WolfPack listing engine for Adam El-Naggar at Swellbase. Demonstrating 1:1 stack alignment (Next.js, TypeScript, Supabase, Stripe, Vercel), 20+ years of hardened software engineering, authentic outdoor industry intuition, and production AI velocity.** - **Live Route**: [`/swellbase`](https://listingslab.com/swellbase) (Local preview: [`http://localhost:3005/swellbase`](http://localhost:3005/swellbase)) - **Monorepo Source**: [`github.com/goldlabelapps/nx`](https://github.com/goldlabelapps/nx) - **Candidate CV**: [`/pdf/Chris_Dorward_CV.pdf`](/pdf/Chris_Dorward_CV.pdf) - **Target Company**: [Swellbase.io](https://swellbase.io) - **Founder Profile**: Adam El-Naggar (`adam@swellbase.io` • Founder, Swellbase & Owner, Blue Coast Surf & Paddle) - **Published Job**: [LinkedIn Job #4483019058](https://www.linkedin.com/jobs/view/4483019058/) --- ## 1. Executive Summary Swellbase is the modern booking and operations platform purpose-built for outdoor activity centres, moving operators away from fragmented, generic booking widgets toward an integrated platform managing bookings, waivers, staff, and equipment. Rather than submitting a static PDF CV into an inbox, this listing is engineered as an interactive, production-grade application inside our enterprise Nx monorepo. It serves two distinct purposes: 1. **Direct Demonstration of Competence & Velocity**: Delivers an immediate, tangible proof of full-stack craft on the exact Swellbase stack (Next.js, TypeScript, Supabase Postgres, Stripe, Vercel) built autonomously with agentic workflows. 2. **Deep Operational & Personal Alignment**: Directly bridges 20+ years of senior software delivery with authentic outdoor industry background (surfing, alpine skiing in Chamonix, lifetime scuba diving and Divemaster qualification), with complete understanding of the operational realities of outdoor tourism businesses. --- ## 2. Target Business, Role & Candidate Context | Property | Details | | :--- | :--- | | **Target Company** | **Swellbase** ([swellbase.io](https://swellbase.io)) | | **Founder & Lead** | **Adam El-Naggar** (`adam@swellbase.io`) • Founder, Swellbase & Operator, Blue Coast Surf & Paddle (Moray Coast, Scotland) | | **Target Role** | **Founding Product Engineer** (First engineering hire, reporting directly to founder) | | **Working Model** | 1 Founder (Sales, Roadmap & Customer Validation) + 1 Engineer (Architecture, UX & Production Build) | | **Compensation** | £50,000 FTE (£40k for 4-day week) + EMI Share Options vesting Day 1 + Revenue-milestone pay rise | | **Location** | UK Remote (Authorised to work in UK • Dual UK & German/EU Citizen • Occasional Scotland visits) | | **Candidate Contact** | **Chris Dorward** • `goldlabel.apps@gmail.com` • `+44 7745 763122` (`07745 763122`) | | **Professional Profiles**| [LinkedIn](https://www.linkedin.com/in/chris-dorward/) • [GitHub: goldlabelapps](https://github.com/goldlabelapps) | --- ## 3. Listing Architecture & Specification Built using the official **Modern Scroll Template** (`src/app/templates/modern-scroll/`) tailored for a high-converting candidate application: ### Visual Design & Brand Tokens - **Theme Palette**: Derived directly from `swellbase.io`: - **Primary Brand Ocean Blue**: `hsl(210, 65%, 52%)` / `#3385D6` (`bg-primary`, selection highlights, accent borders) - **Surface & Backgrounds**: Crisp clean white (`#FFFFFF`) with subtle coastal slate cards (`#F8FAFC`, `#F1F5F9`) - **Typography Slate**: High-contrast `#0A0A0A` headings and `#475569` body text - **Status Accents**: Emerald green (`#10B981`) for live production verification and active operational badges - **Typography**: Clean modern sans-serif headings with monospace badges (`font-mono`) for technical stacks. Animated headings use `CleverText` with `style={{ fontFamily: "inherit" }}`. - **Default Theme**: Light mode by default (`defaultTheme: "light"`), with instant dark mode toggle via `` in the header actions. --- ### Page Sections Breakdown #### 1. Header (`SwellbaseHeader.tsx`) - Fixed sticky navigation with clean brand logo and quick anchor navigation: `#story`, `#experience`, `#products`, `#ai-workflow`, `#why-swellbase`, `#contact`. - **CV Action**: Direct `"CV (PDF)"` link in header action cluster. - **Theme Toggle**: `` situated adjacent to drawer hamburger button. - **Mobile Navigation Drawer**: Universal drawer across all viewports with quick links, CV download, and social share links. - **Isolation**: Zero links back to ListingsLab root except the universal footer copyright. #### 2. Section 1: Hero & Founder Welcome (`SwellbaseHero.tsx`) - **Badge**: `"Founding Product Engineer Application • Swellbase"` - **Animated Headline**: `CleverText` rendering `"Founding Product Engineer"` - **Subheadline**: *"20+ years of software craft meets real outdoor industry intuition."* - **Personal Introduction & Outdoor Roots**: - Highlights real outdoor pedigree: surfing in late teens, living in Chamonix skiing for years, and a lifetime of scuba diving (certified PADI Divemaster). - Explicit empathy for outdoor centre operations, instructor scheduling, customer waivers, tide/weather logistics, and customer expectations. - Software background: university during the dawn of the public internet ("Information Superhighway"), living through every technological era to build deep architectural intuition. - **CTAs**: Primary `"Start Conversation"` (`#contact`) and Secondary `"Download CV (PDF)"` (`/pdf/Chris_Dorward_CV.pdf`). #### 3. Section 2: Technical Stack & Relevant Experience (`SwellbaseExperience.tsx`) - **Stack 1:1 Match**: - **Next.js & React**: Modern App Router, Server Components, high-velocity frontend architecture. - **TypeScript**: 100% strongly typed and rigorously tested codebases (`github.com/goldlabelapps/nx`). - **Supabase (Postgres & Auth)**: Real-world experience architecting multi-tenant Postgres schemas, Row Level Security, and auth pipelines. - **Stripe & Stripe Connect**: Platform payments, deposits, payouts, and automated billing. - **Vercel**: Edge-ready deployments, preview environments, and instant rollouts. - **CV Download Spotlight Card**: Prominent callout to download the official CV with citizenship status noted (UK & German/EU dual citizen, fully authorised to work in the UK without visa requirements). #### 4. Section 3: Built & Shipped Products Showcase (`SwellbaseProducts.tsx`) Verifiable proofs of commercial delivery, independent product ownership, and open-source craft: 1. **Leida** ([`askleida.com`](https://askleida.com)): - *Identical Stack & Dynamic*: Built with Next.js, Supabase, Postgres, and Vercel in a 1-founder + 1-developer dynamic. - *Value Delivered*: In 3 months, took an unviable founder prototype and transformed it into a battle-tested, scalable MVP architected specifically for AI-assisted development. 2. **GpxRoute** ([`gpxroute.pro`](https://gpxroute.pro)): - *Independent Product Ownership*: A personal project born from years of Garmin dive watch GPS tracks. - *Agentic Velocity*: Autonomously architected, built, and shipped via Agentic AI, turning a complex GIS mapping concept into a production reality. 3. **NX°** ([`github.com/goldlabelapps/nx`](https://github.com/goldlabelapps/nx)): - *Open Source Monorepo & AI Guardrails*: The foundational framework powering this application. - *Inspect Real Code*: Gives Adam immediate access to inspect actual production TypeScript code, component hierarchy, schema boundaries, and unit test suites. #### 5. Section 4: Daily AI Practice & Development Workflow (`SwellbaseAiWorkflow.tsx`) - **Thinking in Prompts**: Moving far beyond simple chat code completion into deterministic agent orchestration, strict schemas, and automated verification loops. - **Velocity Without Fragility**: How agentic workflows allow instant context-switching between codebases and reliable extraction/adaptation of features without accumulating technical debt. - **Clean Guardrails**: Why 20+ years of foundational software engineering makes AI tooling exponentially more powerful: knowing what architecture to specify before a single token is generated. #### 6. Section 5: Why Swellbase? (`SwellbaseWhyUs.tsx`) - **The 1 Founder + 1 Engineer Ideal**: Pure execution velocity. No bureaucratic overhead, no middle management, no political bottlenecks. - **Division of Ownership**: Founder owns market vision, sales, and customer relations; Founding Engineer owns architectural integrity, UX finish, and production reliability. - **A Long-Standing Partnership**: Commitment to establishing a stable, enduring technical foundation that scales with revenue milestones and EMI equity alignment. #### 7. Section 6: Schedule an Interview / Frictionless Outreach (`SwellbaseContact.tsx`) - Direct contact hub offering Adam three frictionless ways to connect: 1. **Direct Email Form**: Submits via `/api/notify/send`, dual-routed to `adam@swellbase.io` and `goldlabel.apps@gmail.com` with ListingsLab system backup. 2. **One-Click WhatsApp**: Instant pre-filled chat thread directly to candidate (`+44 7745 763122`). 3. **Direct LinkedIn Connect**: [LinkedIn](https://www.linkedin.com/in/chris-dorward/). - Immediate interview availability (flexible across UK time zones). #### 8. Section 7: Footer (`SwellbaseFooter.tsx`) - Professional links: LinkedIn, GitHub, CV Download. - UK & German (EU) Dual Citizenship notice. - Universal ListingsLab copyright: `© 2026 Listingslab` routing to `/`. --- ## 4. 1:1 Alignment Matrix | Swellbase Requirement | Candidate Experience & Verifiable Proof | | :--- | :--- | | **1. Own the build from brief to production**
*"Scoping them, designing UX and making technical calls without needing to be chased"* | **20+ years of independent delivery**: Shipped dozens of enterprise and startup platforms end-to-end. Proven track record turning one-page briefs into robust, tested user experiences. | | **2. Identical Tech Stack**
*"Next.js, TypeScript, Supabase (Postgres), Stripe Connect, Vercel"* | **Identical stack deployed on Leida**: Shipped [`askleida.com`](https://askleida.com) on the exact same stack. Author of open-source TypeScript packages in enterprise Nx monorepo (`github.com/goldlabelapps/nx`). | | **3. 1 Founder + 1 Dev Experience**
*"First engineer to own the build while I focus on selling"* | **Proven founder partnership on Leida**: Worked directly with a solo founder to harden an unviable prototype into a scalable MVP in 3 months with complete autonomy. | | **4. AI Coding Tools in Daily Practice**
*"Use AI coding tools every day and enjoy experimenting with new ways to ship faster"* | **Agentic AI Native**: Builds with autonomous multi-agent tool loops every day. Maintains custom skills and agents for instant scaffolding, rigorous testing, and verified deployments. | | **5. Outdoor Tourism & Centre Empathy**
*"You surf, climb, paddle, ski or spend weekends outdoors"* | **Authentic Outdoor Life**: Surfed in late teens, lived and skied in Chamonix, lifetime scuba diver and certified PADI Divemaster. Understands centre logistics, kit tracking, waivers, and tide-dependent bookings from the inside out. | | **6. UK Authorised & Remote Setup**
*"UK-based remote, occasional in-person Scotland days"* | **Dual UK & German Citizen**: Permanently based in the UK with full unrestricted right to work. Available for periodic in-person working sessions on the Moray Coast, Scotland. | --- ## 5. Outbound Email & Link Open Notification ### Link Open Notification Tracking ID When the landing page link is sent to Adam, the URL can include a tracking parameter: `https://listingslab.com/swellbase?ref=adam&t=email` When accessed, the page can fire a lightweight notification ping to `/api/notify/send` alerting Chris that Adam has opened the application. ### Invitation Email Draft ```text Subject: Swellbase Founding Product Engineer - Chris Dorward (Proof of Work) Hi Adam, I imagine you've been inundated with applications for the Founding Product Engineer role, so I wanted to stand out with a real, working example rather than a static CV. I built an interactive application for Swellbase here: https://listingslab.com/swellbase?ref=adam It covers everything you asked for: 1. Direct 1:1 match with your stack (Next.js, TypeScript, Supabase Postgres, Stripe, Vercel). 2. Live shipped products (including Leida, which was built with a solo founder on your identical stack). 3. How I use agentic AI day-to-day to ship production code at 5x velocity. 4. Why Swellbase is the exact 1-founder + 1-dev partnership I'm looking for. 5. And why my outdoor background (scuba Divemaster, Chamonix skiing, early surfing) gives me real empathy for what activity centre operators actually need. I'm UK-based, available immediately, and would love to jump on a call whenever suits you. Best regards, Chris Dorward +44 7745 763122 goldlabel.apps@gmail.com https://listingslab.com/swellbase?ref=adam ``` --- ## 6. Verification & Quality Gates ```bash # 1. Run targeted Vitest test suite for Swellbase pnpm test src/app/\(recruitment\)/swellbase/page.test.tsx # 2. Targeted TypeScript check pnpm typecheck ```