Debuggen als een Developer: verdrijf deze 8 veelvoorkomende spoken uit je code

Het is een stormachtige nacht op IJburg. De golven van het IJ beuken tegen de kade en bliksemschichten flitsen door de lucht. Aan de rand van de woeste rivier, hoog in een kantoorgebouw, flikkert een kaars. Onder het warme licht werkt Developer Ha aan het belangrijkste project van Bikkelhart. Zijn vingers razen over het toetsenbord. Zonder een slag te missen, schrijft Ha de laatste regel code. 

Maar recht boven de Entertoets, nét als hij zijn werk wil afronden, verstijft Ha’s hand. Een ijskoude rilling loopt over zijn rug. Met een grote zwaai vliegt de deur van het kantoor open. Een windvlaag woedt door de ruimte en blaast zijn kaars uit. En dan, midden in het duister, ziet hij het. In de schaduw van zijn code spookt een angstaanjagende bug! Ha zet zijn tanden op elkaar. De moedige Developer duikt opnieuw in de code en is vastbesloten om zijn digitale spook te verdrijven. Maar hoe? 

1. De Dode Link: lege 404-pagina’s

Hallo, is daar iemand?! Als je op een niet-werkende link van een website klikt, kom je meestal op een 404-pagina terecht. Vanuit hier kun je vaak terug naar de homepagina of iets anders zoeken. Maar als deze pagina niet goed werkt en je niet naar andere delen van de website kunt gaan, zit je muurvast. 

Ha’s oplossing:
Zorg ervoor dat je website op alle pagina’s een menu en een footer heeft, zodat de gebruiker altijd verder kunnen navigeren. Of ga voor een creatieve manier van debugging, bijvoorbeeld door een rij van vergelijkbare artikelen op de pagina te plaatsen.

2. Het Poltergeist-formulier: functionele bugs in formulieren

Dit is een vervelende bug waarbij webformulieren hun eigen leven lijken te leiden. Ze verzenden gegevens zonder waarschuwing, veranderen van volgorde en laten de gebruiker in verwarring achter. Een beetje zoals als een poltergeist, dus.

Ha’s oplossing:

Om losgeslagen formulieren te voorkomen, kun je strikte validatiecontroles implementeren en deze regelmatig testen. 

3. Het Behekst Design: slecht of geen responsive design

Deze onheilspellende ‘bug’ terroriseert responsive designs, waardoor de lay-out zich onvoorspelbaar gedraagt op verschillende schermgroottes en apparaten.

Ha’s oplossing:
Check tijdens het bouwen van je website regelmatig of alles er goed uitziet op verschillende apparaten. Ook is het handig om te testen in verschillende webbrowsers zoals Chrome, Safari en Firefox. 

Tip: bouw de website eerst voor mobiele apparaten en werk dan naar de grotere schermen toe. Dit dwingt je om gelijk al na te denken over de meest essentiële functies en informatie die je wil laten zien. Zo maak je de ervaring (zelfs op grote schermen) beter en voorkom je een hoop debugging in de toekomst. 

4. De Hongerige Data-vampier: data loss

Als jij je bestanden niet veilig bewaart, kan er zomaar iemand anders bij. En vanaf het moment dat diegene daar zijn tanden inzet, is de kans groot dat je je bestanden nooit meer terugziet. In plaats van debuggen, kun je het dus maar beter helemaal voorkomen. 

Ha’s oplossing:
Gebruik een versiebeheersysteem zoals Git (git-scm.com) en maak regelmatig een back-up van je bestanden om te voorkomen dat je gevoelige gegevens of werk verliest.

5. De Griezelige Platenspeler: infinite loop

Je kent het vast wel uit horrorfilms: midden in de nacht start de platenspeler plots met draaien en blijft de muziek hangen, waardoor dezelfde griezelige klanken keer op keer worden afgespeeld. Dit lijkt op de infinite loop-bug in computers, waarbij een actie steeds herhaald wordt zonder te stoppen.

Ha’s oplossing:
Stel de voorwaarden voor herhalingen in de code op de juiste manier in, zodat ze niet oneindig blijven doorgaan.

6. Het Z-index Spook: CSS stijlbug

Door de z-index CSS stijlbug ontstaat er een verwarrende situatie, waarin elementen op een webpagina niet op de verwachte manier gestapeld worden. Alsof er een spook aan het werk is geweest…

Ha’s oplossing:
Zorg ervoor dat je CSS goed in elkaar zit en dat de z-index waarden zo zijn ingesteld dat de elementen netjes gestapeld worden en niet door elkaar heen gaan.

7. De Verloren Zielen: oude cache

Deze bug zorgt ervoor dat oude versies van bestanden achterblijven in de browsercache en op het beeldscherm verschijnen als verloren zielen uit het verleden. Dit kan ervoor zorgen dat de gebruiker verouderde content krijgt te zien of weergaveproblemen krijgt.

Ha’s oplossing:
Controleer je website op verloren zielen door de website in incognitomodus te bekijken. Als je ziet dat afbeeldingen daar anders zijn, kun je debuggen door handmatig de cache van je webbrowser te wissen. 

8. Het Verboden Snoep: NaN (Not-a-Number) type bug

Kom jij regelmatig bugs in je code tegen, of heb je hulp nodig bij het programmeren? We helpen je graag verder! Stuur Ha een berichtje en hij komt angstaanjagend snel bij je terug. 🎃