Hoe werkt mijn Jamstack-website?

Leon van der Grient
23 January 2023

Devtastic bouwt zogenaamde Jamstack-websites. Deze zijn sneller, betrouwbaarder en veiliger dan traditionele WordPress-websites. Maar hoe werkt een website eigenlijk? En hoe verschilt een Jamstack- van een WordPress-website? In dit artikel leg ik het uit

Het begint met HTML

Wanneer je met je browser naar een bepaalde website gaat, krijg je als eerste een HTML-document toegestuurd. In dit document staat de structuur van je website en welke bestanden er nog meer geladen moeten worden: afbeeldingen, video's, JavaScript, lettertypen, etc. Er zijn speciale stijldocumenten (CSS) die het uiterlijk van een website kunnen veranderen. Om interactieve elementen toe te voegen wordt de programmeertaal JavaScript gebruikt. Met HTML, CSS en JavaScript maak je dus een website.

Van statisch naar dynamisch

Vroeger, heel lang geleden, werden websites gebouwd door handmatig de HTML-documenten te schrijven. Een titel van een pagina werd dus bijvoorbeeld zo opgeschreven:

<h1>Contactpagina</h1>

Hoewel dit werkt voor een klein aantal pagina's die bovendien niet vaak veranderen, werd dit al snel ondoenlijk voor de meeste websites. Daarom werden er programmeertalen ontwikkeld die HTML konden genereren op basis van ingevoerde data:

<h1><?php echo $page_title; ?></h1>

De introductie van het CMS

Om het beheer van de data die in de website moest worden gebruikt makkelijker te maken werden Content Management Systemen (CMS) ontwikkeld. Daarmee kon data worden ingevoerd en HTML worden gegenereerd. Het bekendste CMS is WordPress. Deze "traditionele" CMS'en deden eigenlijk twee dingen: ze sloegen data op en ze genereerde HTML.

Taken splitsen: het headless CMS

Het is eigenlijk helemaal niet handig dat een CMS ook HTML genereert. Dat houdt namelijk de ontwikkeling van nieuwe technologieën tegen, wat ook te zien is bij WordPress. Daarom zijn zogenaamde headless CMS'en de laatste jaren in opkomst: dit type CMS houdt zich enkel bezig met data-opslag en genereert geen HTML. Strapi is zo'n headless CMS. De website wordt vervolgens genereerd door een site generator, bijvoorbeeld Next.js.

Voordelen van een Jamstack-website

Een website die gegenereerd wordt door een headless CMS en een site generator wordt wel een Jamstack-website genoemd. De voordelen van zo'n website zijn:

  • Sneller
  • Veiliger
  • Goedkoper
  • Schaalbaar
  • Moderner

Daarom zet Devtastic vol in op Jamstack-websites met Strapi en Next.js.