Cut the fluff; Astro.Build als framework
Wist je dat een gemiddelde website met een standaard CMS (vb. Wordpress) 500MB tot 1GB diskspace nodig heeft, voor een basis website? Heb je die dan ook echt nodig voor je site? Ik wilde een framework dat van nature schoon en minimaal is. Geen CMS met eindeloze updates, plugins en performance-puzzels, maar een oplossing die vanaf dag 1 efficiëntie vooropstelt.
Astro.build biedt precies dat: een static site builder die HTML, CSS en JavaScript genereert; zonder database en onnodige serverprocessing. Breng je project terug naar een behapbare set-up. Resultaat? Een portfolio van minder dan 4MB (exclusief assets), sub-second laadtijden met minimale carbon footprint.
Unique Selling Point van: Astro.Build
Tip van Tai, stappenplan:
Welke stappen heb ik ondernomen:
- Onderzocht welke framework en tools het beste past bij mijn doel: een lightweight, snel en duurzaam portfolio. Daarnaast gaf het mij veel controle op mijn eigen HTML structuur.
- Ik koos voor een leeg nieuw project met Astro. Maar er bestaan ook starter-templates. In dit geval gebruikte ik TailwindCSS als startpunt (standaard spacings etc.). En heb ik mijn Figma-designs erop gebaseerd met dezelfde spacing en met een eigen thema en design.
- Integreer TailwindCSS in je Astro.Build project voor het gebruik van utility classes en styling, dit zorgt ook voor een consistente design in je project. Maak losse componenten voor consistentie en hergebruik.
- Project lokaal testen en verifiëren. Via Visual Studio Code project inrichten en installeren van de Astro Plugin. En vervolgens mijn eerste projectstructuur met Astro.Build naar GitHub gepushed voor versiebeheer.
- Kies een hosting provider en zet je project live. Ik koos voor een kleine en lightweight VPS met Ubuntu, maar er zijn ook andere opties zoals Netlify of Vercel waarop Astro.Build ook op kan draaien.
- Gebruik gemaakt van Mistral Le Chat voor de verdere inrichting en optimalisatie van het project en VPS, en uiteraard de koppeling met SSL, Domein en VPS. De kennis voor de voorgaande stappen had ik al, maar ook hier voor kun je Le Chat gebruiken om je te helpen met inrichten van je project!
Terug naar overzicht
5 minuten leestijd - 04 maart 2026