Oude websites moderniseren met AI, Coolify en Docker

De afgelopen jaren heb ik aardig wat oude websites en projecten verzameld. Niet één daarvan trok enorme bezoekersaantallen, maar daardoor zijn ze voor mij niet minder waardevol. Sommige projecten vertellen een persoonlijk verhaal, andere bewaren een klein stukje Rotterdamse of Nederlandse cultuur.

Technisch hadden de websites de tand des tijds niet allemaal even goed doorstaan. Daarom besloot ik ze opnieuw online, bruikbaar en vindbaar te maken. In dit artikel laat ik zien hoe ik drie oude websites moderniseerde met AI, Coolify en Docker.

Oude websites moderniseren met Coolify

De directe aanleiding voor het afstoffen van deze projecten was mijn overstap naar Coolify. Daarmee kan ik websites vanuit Git als Docker-container uitrollen, HTTPS-certificaten laten regelen en veel handmatig beheer van Apache- en Nginx-configuraties vermijden.

Omdat ik de websites toch onder handen nam, heb ik ook de paginatitels, samenvattingen en meta descriptions verbeterd. Het resultaat is niet perfect, maar bezoekers kunnen nu beter zien wat een website bevat en zoekmachines krijgen duidelijkere informatie over iedere pagina.

Ten slotte heb ik Matomo toegevoegd. Zo kan ik het bezoek aan de websites meten zonder daarvoor Google Analytics te gebruiken.

Drie websites die een tweede leven kregen

1. Dichter draagt voor

Deze website heeft de tand des tijds verrassend goed doorstaan. Het is een bijzonder project waarin gedichten en beeld bij elkaar worden gebracht. Het kunstproject werd gemaakt door de broers Nasr en mij, en ik ben blij dat het online bewaard is gebleven.

De website was al statisch, waardoor de technische vernieuwing overzichtelijk bleef. Met hulp van AI waren de problemen met oude URL-paden snel gevonden en opgelost. Ook het automatisch afspelen van de Vimeo-video’s kon worden aangepast aan de huidige eisen van browsers en Vimeo. Geluid mag daarbij tegenwoordig meestal niet meer automatisch worden ingeschakeld.

Bekijk Dichter draagt voor.

2. 010bars

010bars is een persoonlijke favoriet. We begonnen de website in 2015 om onze voorliefde voor Rotterdamse bruine kroegen te vieren. Ongeveer een jaar lang bezochten, fotografeerden en beschreven we verschillende cafés. Het resultaat bestaat uit slechte foto’s, obscure teksten en bewust wat vreemd taalgebruik.

Het moderniseren van deze website bleek een stuk lastiger dan verwacht. Algemene opdrachten aan ChatGPT, zoals het maken van een volledige statische kopie, leverden geen bruikbaar eindresultaat op.

Uiteindelijk ben ik opnieuw bij de basis begonnen. In Visual Studio Code bouwde ik met AI-ondersteuning stap voor stap een migratiescript. Daarna heb ik de losse HTML-bestanden omgezet naar een kleine PHP-applicatie. Ik had ook graag het stemmen op cafés hersteld, met de hipster- en tafelkleedjesbeoordeling, maar dat blijft een project voor een volgende ronde.

Bekijk 010bars.

3. Het Padvinderspel

Dit oude Nederlandse kaartspel heeft mijn vriendengroep veel gezellige avonden bezorgd. Tijdens de coronapandemie konden we niet meer bij elkaar komen en bleek er geen online versie te bestaan. Daarom maakte ik zelf een digitale variant, zodat we het spel tijdens een online groepsgesprek konden blijven spelen.

Bij deze applicatie hielp AI vooral bij het vereenvoudigen van de technische architectuur. De oorspronkelijke versie had een afzonderlijke frontend en backend, elk op een eigen domein. Door de onderdelen samen te brengen in een Express.js-applicatie kon de opzet eenvoudiger worden zonder de realtime socketverbindingen te verliezen.

Na het toevoegen van een Dockerfile werkte de applicatie vrijwel direct. Vervolgens heb ik nog een nieuwe voorpagina, een uitleg van de spelregels en een taalwisselaar toegevoegd. Het spel werkt zowel met vrienden als in een singleplayermodus.

Speel Het Padvinderspel.

Wat AI wel en niet oploste

AI bleek vooral nuttig bij kleine, controleerbare taken: een fout in URL-paden opsporen, een migratiescript schrijven, HTML omzetten en een technische architectuur vereenvoudigen. Een volledige oude website met één algemene opdracht laten migreren werkte aanzienlijk minder goed.

De beste resultaten ontstonden door het werk op te delen in overzichtelijke stappen en iedere stap zelf te controleren. AI versnelde het programmeerwerk, maar nam het begrijpen, testen en bijsturen van de applicaties niet over.

Oude projecten blijven waardevol

Deze websites zullen waarschijnlijk nooit enorme aantallen bezoekers trekken. Toch vind ik het waardevol dat ze online blijven. Ze bewaren werk, herinneringen en verhalen die anders langzaam zouden verdwijnen.

Door de websites technisch te vereenvoudigen, zijn ze nu makkelijker te onderhouden en minder afhankelijk van verouderde software. Daarmee kunnen ze hopelijk weer een flink aantal jaren mee. Bekijk ook mijn andere webprojecten en mijn diensten rond software en webontwikkeling.