Wabliefteru: een podcastwebsite met een automatisch blogsysteem

Wabliefteru? is een Nederlandstalige podcast voor intellectueel nieuwsgierige luisteraars. De podcast had meer nodig dan een link naar Spotify of Apple Podcasts: er moest een eigen plek komen waar afleveringen gevonden worden via Google, waar de branding klopt en waar nieuwe content snel gepubliceerd kan worden.

Deze case toont hoe ik de Wabliefteru-website volledig met AI als bouwpartner opzette: van frontend en SEO-structuur tot een Directus CMS en een n8n-automatisering die podcastafleveringen omzet naar blogwaardige content. Niet als theoretisch experiment, maar als werkend systeem dat vandaag nieuwe afleveringen kan verwerken.

Kern van de case: een podcastaflevering wordt content, een transcript wordt een artikel, en een CMS-item wordt automatisch een crawlbare SEO-pagina.

De uitdaging: een podcast heeft een echte website nodig

Een podcast leeft vaak op platformen zoals Spotify, Apple Podcasts of YouTube. Dat is handig voor distributie, maar beperkt voor eigenaarschap. Je bent afhankelijk van externe platformen, je bouwt weinig eigen zoekverkeer op en elke aflevering verdwijnt snel in een lange lijst.

Voor Wabliefteru? waren er drie concrete doelen:

1. Een professionele thuisbasis voor de podcast. De site moest het karakter van de podcast tonen: eigenzinnig, donker academisch, herkenbaar en niet generiek.
2. Een afleveringarchief dat vindbaar is in Google. Elke aflevering moest een eigen SEO-pagina krijgen met titel, samenvatting, artikelcontent, afbeelding, metadata en structured data.
3. Een publicatieproces dat niet elke week handwerk vraagt. Nieuwe afleveringen moesten vanuit bestaande bronnen (RSS, transcriptie, beschrijving en beeldmateriaal) sneller kunnen doorstromen naar de website.

Daarom werd het geen klassieke statische website, maar een contentmachine: een maatwerk website met AI workflow, een CMS, een automatiseringslaag en een SEO-pipeline.

De oplossing in het kort: een AI-gedreven stack

De Wabliefteru-site is gebouwd als een moderne Vite + React + TypeScript website, met Tailwind CSS en shadcn/ui voor de interface. De visuele stijl gebruikt een dark-academia look met burgundy, brass en parchment-tinten, serif typografie en een houten achtergrondtextuur.

Onder de motorkap zitten drie lagen:

• Frontend: Vite, React, TypeScript, Tailwind CSS en shadcn/ui.
• CMS: Directus als headless CMS voor afleveringen, content, afbeeldingen en metadata.
• Automatisering: n8n-flows die afleveringdata, transcriptie, AI-artikels, beelden en publicatiestappen met elkaar verbinden.

Ik zette de website initieel op met AI-tools zoals Lovable en scherpte hem daarna verder aan met AI-ondersteunde ontwikkeling. AI was dus niet alleen een schrijfassistent, maar de primaire bouwpartner voor code, structuur, automatisering en SEO-optimalisatie. De menselijke rol bleef bewust belangrijk: richting geven, keuzes maken, kwaliteit beoordelen en de automatisering begrenzen waar dat nodig is.

Hoe de website technisch gebouwd is

De frontend is een React single-page application, maar met extra SEO-maatregelen zodat de afleveringpagina's niet afhankelijk zijn van JavaScript-rendering alleen. Dat is belangrijk: een podcastwebsite laten bouwen is één ding, maar een podcastwebsite vindbaar maken is iets anders.

De basis bestaat uit:

• Vite + React 18 + TypeScript voor snelle development en performante builds.
• React Router voor routes zoals /, /afleveringen en /afleveringen/:slug.
• Tailwind CSS + shadcn/ui voor een consistente componentenbasis.
• Vercel als hostinglaag, met redirects, rewrites, cache headers en security headers.
• Build-time prerendering voor afleveringpagina's, zodat Google echte HTML, metadata en structured data ziet.

Voor SEO is vooral die laatste stap belangrijk. De site haalt afleveringen uit Directus, maakt per aflevering een slug, en genereert tijdens de build statische HTML voor de afleveringspagina's. Daardoor is elke podcastaflevering niet alleen een React-view, maar ook een concrete pagina met een eigen titel, beschrijving, canonical, Open Graph-data en JSON-LD.

Directus als headless CMS: structuur zonder code

Directus is het CMS achter de Wabliefteru-website. In plaats van content hardcoded in de website te zetten, worden afleveringen beheerd in een aparte collectie: afleveringen.

Die collectie bevat onder andere:

• titel
• afleveringsnummer
• korte omschrijving
• artikelcontent in Markdown
• transcript of bronmateriaal
• auteur
• publicatiedatum
• afbeelding
• Spotify-link of embed-URL
• status, zoals published, draft of archived

Dat maakt de website veel flexibeler. De frontend hoeft niet te weten hoe een aflevering geschreven of voorbereid werd. Ze haalt gewoon de gepubliceerde items uit Directus op en toont ze in het juiste design.

Voor deze case is dat cruciaal: Directus maakt van de site een beheersbaar contentplatform. Nieuwe content hoeft niet via code of deploys te worden ingevoerd. De automatisering kan rechtstreeks items aanmaken of bijwerken in Directus, waarna de website ze oppikt en omzet naar publieke pagina's.

Waarom een Directus CMS hier goed past

Een Directus CMS is interessant wanneer je maatwerk wil combineren met contentbeheer. Je zit niet vast aan een klassieke WordPress-thema-structuur, maar je hebt wel een beheerlaag voor content, afbeeldingen en metadata.

Voor Wabliefteru betekent dat:

• de podcast kan blijven groeien zonder dat elke aflevering handmatig in code moet worden toegevoegd;
• AI-gegenereerde blogcontent kan eerst gestructureerd worden opgeslagen;
• publicatie, SEO en beeldmateriaal op één plek beheerd worden;
• de frontend vrij blijft om exact de juiste merkervaring te bouwen.

Blog en content automatiseren met n8n

De meest interessante laag is de n8n-automatisering. Die zet de losse onderdelen van een podcastaflevering om naar bruikbare websitecontent.

De automatische flow leest de podcast-RSS-feed, haalt afleveringinformatie op, gebruikt transcriptie als bronmateriaal, laat een AI-model een Nederlandstalig artikel schrijven en maakt vervolgens een item aan in Directus. Daarna kan er ook een artikelbeeld of thumbnail gekoppeld worden.

De manuele blogposter-flow hieronder toont visueel het stuk van de blogautomatisering: van formulierinput naar RSS, filtering, audiobestand, transcriptie, AI-artikel en Directus-publicatie.

Wat gebeurt er in de blogautomatisering?

In mensentaal ziet het proces er zo uit:

1. Een aflevering wordt geselecteerd. In de manuele flow gebeurt dat via een formulier met onder andere het afleveringsnummer en een image-ID.
2. De RSS-feed wordt gelezen. n8n haalt de Wabliefteru RSS-feed op en filtert de juiste aflevering.
3. Overbodige tekst wordt opgeschoond. Timestamps, bronvermeldingen en andere stukken die niet thuishoren in het artikel worden verwijderd.
4. De aflevering wordt gedownload en getranscribeerd. Het audiobestand wordt gebruikt om een transcriptie te maken of op te halen.
5. AI schrijft het artikel. Een Gemini-model krijgt de afleveringbeschrijving en transcriptie als bronmateriaal en schrijft een Nederlandstalig artikel in Markdown.
6. De output wordt gestructureerd. De AI geeft niet zomaar losse tekst terug, maar een vaste output met artikelcontent en auteur.
7. Directus krijgt een nieuw item. n8n maakt een gepubliceerde aflevering aan met titel, auteur, excerpt, content, datum, Spotify-embed en afleveringsnummer.
8. Afbeelding wordt gekoppeld. Daarna kan een thumbnail of gegenereerd beeld aan het Directus-item gekoppeld worden.
9. Succes of fout wordt gemeld. Telegram-meldingen geven feedback wanneer het artikel is aangemaakt of wanneer er iets foutloopt.

De automatische productieflow gaat nog breder. Die verwerkt ook social visuals, Directus media uploads, Telegram-goedkeuring en Postiz-planning voor social posts. Belangrijk is dat automatisering hier niet betekent dat alles blind live gaat. Er zit bewust controle in het systeem: AI doet het repetitieve werk, de mens behoudt de kwaliteitscontrole.

SEO: van podcastaflevering naar vindbare pagina

Een podcastaflevering is van nature moeilijk te indexeren. Audio is niet genoeg. Google heeft tekst, structuur en context nodig. Daarom werd de Wabliefteru-stack gebouwd rond het idee dat elke aflevering ook een artikel kan worden.

Elke afleveringpagina krijgt:

• een duidelijke titel;
• een slug op basis van de afleveringstitel;
• een excerpt;
• artikelcontent;
• een afbeelding;
• canonical metadata;
• Open Graph-data voor delen op sociale media;
• structured data voor podcastafleveringen en breadcrumbs;
• een plaats in de sitemap en RSS-feed.

Dat maakt het verschil tussen "we hebben een aflevering gepubliceerd" en "we hebben een nieuwe vindbare pagina toegevoegd aan ons domein". Voor long-tail zoekopdrachten rond de besproken onderwerpen is dat veel waardevoller dan alleen een afleveringstitel op een platform.

Resultaat: een website die content blijft produceren

Het resultaat is geen eenmalige website, maar een schaalbaar contentproces.

Wat de Wabliefteru-case oplevert:

• Snellere publicatie: de basis voor een artikel ontstaat automatisch uit bestaande afleveringdata.
• Minder kopieerwerk: RSS, transcriptie, AI-output, CMS en publicatie hangen aan elkaar.
• Betere SEO-basis: elke aflevering krijgt een eigen crawlbare pagina in plaats van alleen een externe platformlink.
• Consistente structuur: alle afleveringen volgen hetzelfde datamodel en dezelfde layout.
• Menselijke controle: automatisering versnelt het proces, maar belangrijke stappen kunnen gecontroleerd worden.
• Herbruikbare architectuur: dezelfde stack kan opnieuw worden ingezet voor andere contentstromen.

Ik vermeld hier bewust geen verzonnen bezoekerscijfers of rankingclaims. De waarde van deze case zit in het aantoonbare systeem: een werkende website met Directus, n8n, AI-contentgeneratie en SEO-ready output.

Waarom dit relevant is voor bedrijven

De Wabliefteru-case gaat over een podcast, maar het patroon is veel breder. Wat hier gebeurt, een bron die automatisch verandert in gestructureerde webcontent, is relevant voor bijna elk bedrijf dat repetitieve content of data verwerkt.

Een aflevering die automatisch een SEO-pagina wordt, is hetzelfde mechanisme als:

• een nieuw product dat automatisch een productpagina krijgt;
• een webinar dat automatisch een samenvatting en landingspagina krijgt;
• een klantcase die vanuit een intakeformulier wordt voorbereid;
• een vacature die automatisch naar website, LinkedIn en nieuwsbrief gaat;
• een event dat automatisch een detailpagina, social post en mailcampagne krijgt;
• een interne kennisbank die automatisch publieke FAQ-artikels kan voorstellen.

Voor bedrijven draait AI automatisering dus niet om "even een chatbot erbij zetten". Het gaat om processen slimmer maken. De vraag is: welke informatie heb je al, en welke output maak je daar telkens opnieuw van?

Veel organisaties verliezen tijd aan kopiëren, herschrijven, formatteren en publiceren. Dat zijn precies de stappen waar AI en automatisering sterk in zijn. De menselijke tijd verschuift dan van repetitief werk naar controle, strategie en inhoudelijke keuzes.

Daarom is een website laten bouwen met AI vooral interessant wanneer de website verbonden wordt met je echte bedrijfsproces. Niet alleen een mooi design, maar een systeem dat content, data en acties samenbrengt.

Voorbeelden buiten podcasts

Voor e-commerce: productdata, leveranciersinformatie en beelden kunnen automatisch worden omgezet naar productpagina's, SEO-teksten en social posts.

Voor dienstverleners: een intake of workshop kan worden vertaald naar een offerteconcept, casepagina of kennisartikel.

Voor events: elke nieuwe sessie kan automatisch een landingspagina, kalenderitem, nieuwsbriefblok en LinkedIn-post krijgen.

Voor B2B-bedrijven: salesgesprekken, demo's en supportvragen kunnen input worden voor FAQ's, handleidingen en SEO-content.

Voor verenigingen en vzw's: nieuws, activiteiten en verslagen kunnen sneller online zonder dat één persoon alles manueel moet herschrijven.

De echte les uit Wabliefteru is breder dan de vraag of AI een podcastsite kan maken: AI kan een contentproces bouwen rond je organisatie.

Hoe zo'n systeem voor jouw bedrijf kan werken

Een vergelijkbaar systeem start niet met de vraag welke tool je wil gebruiken. Het start met de workflow:

1. Welke input komt er vandaag al binnen?
2. Welke output moet daar telkens uit voortkomen?
3. Welke stappen zijn creatief en welke stappen zijn repetitief?
4. Waar moet een mens goedkeuren?
5. Waar moet het eindresultaat gepubliceerd worden?

Daarna pas kies je de stack. In deze case was dat Directus voor contentbeheer, n8n voor automatisering, AI voor tekstgeneratie en React/Vercel voor de website. Voor een ander bedrijf kan dat een andere combinatie zijn, maar het principe blijft hetzelfde: verbind je systemen zodat content niet blijft steken in losse documenten, mails of spreadsheets.

Ook zo'n contentproces voor jouw organisatie?

Stuur me een korte beschrijving van je proces via [email protected]. Ik kijk waar automatisering tijd kan winnen en waar menselijke controle belangrijk blijft.

Korte conclusie

De Wabliefteru-website toont hoe een website laten bouwen met AI meer kan zijn dan snel een mooie frontend maken. Door React, Directus, n8n en AI-contentgeneratie te combineren, wordt de site een systeem dat nieuwe afleveringen omzet naar vindbare content.

De echte waarde zit in de koppeling tussen website, content, data en workflow. Net daarom is deze aanpak ook relevant voor bedrijven die hun eigen contentproces willen versnellen zonder de menselijke kwaliteitscontrole te verliezen.