frankmeeuwsen/workshopclaudecode
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
workshopclaudecode/LOGBOEK.md
Frank Meeuwsen ca631ce80b chore: availableSpots naar 2 + gitignore opschonen 
- availableSpots van 3 naar 2
- .claude/, .firecrawl/, .playwright-mcp/ toegevoegd aan gitignore
- content bestanden, rekenmodel en skills-export uitgesloten van tracking

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-01 10:34:05 +01:00

8.2 KiB
Raw Blame History

Project Logboek - Claude Code Workshop Sales Page

2025-01-29 - Sessie 1: Initiële setup en content aanpassingen (~25m)

Wat is gebouwd

  • Hero sectie uitgebreid met twee-kolommen layout (tekst links, afbeelding placeholder rechts)
  • Workshop details (datum, tijd, locatie) prominent gemaakt met grote iconen en labels
  • Testimonials sectie verplaatst naar boven "Wat je meeneemt naar huis"
  • React Router toegevoegd voor pagina navigatie
  • Privacy pagina aangemaakt (/privacy) met standaard tekst
  • Algemene Voorwaarden pagina aangemaakt (/voorwaarden) met standaard tekst
  • Footer bijgewerkt met werkende links naar juridische pagina's

Content aanpassingen

  • Lunch tekst: "Wonders of Work heeft een heerlijke lunch voor ons klaarstaan..."
  • Kleuren omgewisseld: "Wat je nodig hebt" = groen (teal), "Wat je niet nodig hebt" = rood (coral)
  • Social links toegevoegd: LinkedIn (linkedin.com/in/frankmeeuwsen), Website (frankmeeuwsen.com)
  • Prijs: €449 excl. BTW (was incl. BTW)
  • Verwijderd uit inbegrepen: werkboek en community access
  • "Vol is vol" tekst verwijderd
  • FAQ "geld terug" vraag verwijderd
  • Footer: "Claude Code Hands-on Sessie" + email contact + LinkedIn
  • Contact: alleen email (frank@frankmeeuwsen.com) en LinkedIn, geen telefoon

Technische beslissingen

  • React Router DOM toegevoegd voor multi-page support
  • Aparte pages folder aangemaakt voor Privacy en Terms componenten
  • Link componenten gebruikt voor interne navigatie (SEO-vriendelijk)

Volgende sessie

  • Echte afbeelding toevoegen in Hero placeholder
  • Bio tekst invullen in Trainer sectie
  • Privacy en Voorwaarden teksten finaliseren
  • Testimonials content toevoegen (echte quotes)
  • Inschrijfformulier/betaallink toevoegen

2026-02-10 - Sessie 2: Content sync, juridische pagina's en cookiebanner

Wat is gebouwd

  • Content gesynchroniseerd van workshop-sales-page.md naar alle JSX componenten
  • Prijs aangepast: €449 → €399 excl. BTW (in Pricing, StickyBar, Terms)
  • Max deelnemers aangepast: 7 → 8
  • Echte testimonial toegevoegd (Floor van Riet)
  • Privacybeleid volledig uitgeschreven (AVG-compliant, met Umami analytics en Google Fonts vermelding)
  • Algemene Voorwaarden volledig uitgeschreven (14 artikelen, herroepingsrecht-uitzondering, getrapt annuleringsbeleid)
  • CookieBanner component gebouwd met localStorage persistentie
  • FAQ uitgebreid met annuleringsvraag (consistent met getrapt beleid)
  • KvK-nummer (98386247) en vestigingsplaats (Utrecht) ingevuld in Privacy en Terms

Technische beslissingen

  • CookieBanner gebruikt localStorage om "Begrepen" keuze te onthouden
  • Herroepingsrecht expliciet uitgesloten (art. 6:230p lid 1 sub l BW) - workshops met vaste datum
  • Bewaartermijn factuurgegevens: 7 jaar (fiscale bewaarplicht)

2026-02-10 - Sessie 3: Hero titel en workshop foto

Wat is gebouwd

  • Nieuwe hero headline: "Bouw zelf wat je nu huurt - met Claude Code" (business-gericht)
  • Headline hiërarchie aangepast: nieuwe titel als h1, "Van dit moet ik uitzoeken naar dit werkt gewoon" als subheadline
  • Trainer sectie: placeholder SVG vervangen door echte foto + 4 bio-alinea's
  • Workshop foto geüpdatet (frank-workshop-claude-code.jpg)

Technische beslissingen

  • Hero twee-kolommen layout: tekst links, foto rechts (verborgen op mobile)
  • CSS filters op foto: brightness(1.12) contrast(1.05) saturate(0.95)
  • Workshop details (datum/tijd/locatie) compact weergegeven met iconen

Volgende sessie

  • Inschrijfformulier/betaallink toevoegen
  • Deploy naar productie
  • SEO meta tags toevoegen (Open Graph, Twitter Cards)
  • Formulier validatie en betalingsflow

2026-02-10 - Sessie 4: Mollie betaalflow, SEO en deploy

Wat is gebouwd

  • Mollie Payment Links aangemaakt (test + live) voor workshop betaling
  • Tally formulier geintegreerd voor e-mailverzameling voor inschrijving
  • Inschrijfpagina (/inschrijven) met embedded Tally formulier
  • Bedankt-pagina (/bedankt) voor na succesvolle betaling
  • Payment config bestand (src/config/payment.js) voor centrale URL configuratie
  • CTA-knoppen (Pricing, FinalCTA, StickyBar) gelinkt naar inschrijfpagina via React Router Link
  • Hero CTA scrollt nog steeds naar pricing sectie
  • OpenGraph en Twitter Card meta tags in index.html
  • OG-afbeelding (1200x630) gemaakt in Canva met site-kleuren en headline
  • SVG favicon (coral CC icoon)
  • Umami analytics script toegevoegd (zelfde ID als frankmeeuwsen.com)
  • Canonical URL ingesteld
  • Base path config (/workshopclaudecode/) alleen voor production builds
  • .htaccess voor SPA-routing in submap
  • Deploy script (deploy.sh) voor build + upload naar Coolify Docker container
  • Site live gedeployd op https://frankmeeuwsen.com/workshopclaudecode/

Technische beslissingen

  • Tally als tussenstap voor e-mailverzameling (geen backend nodig, AVG-compliant, gratis)
  • Betaalflow: CTA -> /inschrijven (Tally embed) -> Mollie betaalpagina -> /bedankt
  • Vite base path conditioneel: / voor dev, /workshopclaudecode/ voor build
  • React Router basename via import.meta.env.BASE_URL (werkt automatisch in beide modes)
  • Hero afbeelding pad via import.meta.env.BASE_URL voor correcte submap-verwijzing
  • Deploy via rsync + docker cp naar WordPress container op Coolify

Volgende sessie

  • Testimonials toevoegen zodra beschikbaar
  • Structured data (JSON-LD Event schema) toevoegen
  • Eerste testbetaling via live link verifiëren

2026-02-23 - Sessie 6: Wachtlijst flow en sold-out logica (duur: onbekend)

Wat is gebouwd

  • availableSpots bijgewerkt van 7 naar 3 (5 stoelen verkocht)
  • Centrale workshop config aangemaakt: src/config/workshop.js met totalSpots, availableSpots en isSoldOut
  • "Nog X plekken beschikbaar" toegevoegd aan StickyBar (desktop + mobile) en FinalCTA
  • Wachtlijst flow gebouwd: WaitlistSignup.jsx + WaitlistThankYou.jsx
  • Tally wachtlijst formulier ID kdyPJZ gekoppeld (https://tally.so/r/kdyPJZ)
  • Twee nieuwe routes: /wachtlijst-inschrijven en /wachtlijst-bedankt
  • Conditionale CTA's in Hero, FinalCTA, StickyBar en Pricing: schakelen automatisch om bij isSoldOut: true
  • Testimonial Jefta Bade foto toegevoegd
  • Alles gecommit en live gezet op https://frankmeeuwsen.com/workshopclaudecode/

Technische beslissingen

  • Centrale config in src/config/workshop.js zodat sold-out status op één plek te beheren is
  • isSoldOut als boolean: bij true verdwijnen inschrijf-CTA's en verschijnt wachtlijst-flow overal
  • Wachtlijst via Tally embed (zelfde patroon als inschrijfformulier)

Volgende sessie

  • Aanbeveling 1: Opening herwerken met sterkere pain point hook
  • Aanbeveling 2: Specifieke tools/voorbeelden toevoegen aan Benefits sectie
  • Aanbeveling 3: Flow optimaliseren (PainPoints -> Testimonials -> Benefits)
  • Aanbeveling 4: CTA buttons verfijnen (consistente button-teksten)
  • Aanbeveling 5: Pre-workshop checklist toevoegen

2026-02-12 - Sessie 5: Concurrentieanalyse en annuleringsbeleid (20 min)

Wat is gebouwd

  • Concurrentieanalyse AI Automation Society salespagina vergeleken met onze workshop pagina
  • Rapport met 6 concrete aanbevelingen (content/analyse-ai-automation-society.md)
  • Annuleringsbeleid zichtbaar gemaakt in Pricing sectie met shield-icoon en compacte tekst
  • Todo-lijst aangemaakt (todos.md) met 5 openstaande optimalisaties
  • Firecrawl CLI geïnstalleerd en geauthenticeerd voor web scraping

Content aanpassingen

  • Pricing component: annuleringsbeleid direct onder CTA-button getoond
  • Visueel: shield-check icoon (teal) + grijze tekst met link naar voorwaarden
  • Tekst: "Tot 2 weken voor start: volledige restitutie. Bekijk annuleringsbeleid"

Analyse inzichten

  • AI Automation Society gebruikt testimonials met concrete resultaten (€220k+ ROI)
  • Hun flow: probleem-stelling -> live demo -> testimonials -> programma -> CTA
  • Onze sterktes: duidelijke timing/locatie, concrete leerdoelen, kleinschalig karakter
  • Verbeterpunten: meer concrete voorbeelden, sterker pain point, social proof met resultaten

Volgende sessie

  • Aanbeveling 1: Opening herwerken met sterkere pain point hook
  • Aanbeveling 2: Specifieke tools/voorbeelden toevoegen aan Benefits sectie
  • Aanbeveling 3: Flow optimaliseren (PainPoints -> Testimonials -> Benefits)
  • Aanbeveling 4: CTA buttons verfijnen (consistente button-teksten)
  • Aanbeveling 5: Pre-workshop checklist toevoegen