Lokale webserver opzetten

Ik krijg veel vragen over hoe en waar ik oefen met het maken van websites. Want het is natuurlijk leuk dat je geïnteresseerd bent en beter wilt worden in HTML, CSS en JS, maar waar en hoe moet je je skills verbeteren?

Deze vraag is simpel te beantwoorden: gewoon in je browser met je eigen editor natuurlijk! Een vertrouwde editor(zoals VS Code, Sublime Tekst, Atom etc.) is het fijnst om te gebruiken, aangezien deze lekker flexibel werkt en je deze ook nog eens kunt aanpassen met bepaalde plugins. En het is natuurlijk ook fijn dat je deze website in je browser kunt beschouwen terwijl je weet dat niemand mee kan kijken.

Echter heb je om dit te doen wel een eigen, lokale webserver nodig. Geen zorgen, het is gratis en helemaal niet moeilijk om op te zetten. En als je de webserver eenmaal op je computer hebt staan zul je er lang plezier van hebben.

In deze post wordt beschreven hoe je XAMPP van Apache Friends moet downloaden. Deze software is beschikbaar voor Mac, Windows en Linux.

Om XAMPP te downloaden moet je naar de downloadpagina van deze software. Onder de introductievideo zie je drie iconen staan voor de download van drie verschillende versies van XAMPP, elk uiteraard voor een ander OS. Klik op het icoon dat de versie voor jouw OS representeert.

Open, indien deze is gedownload, het setupprogramma en volg de stappen. Je wordt goed begeleid door het setupproces en je hoeft waarschijnlijk slechts op ‘next’ klikken tot je bij het einde bent van het setupproces.

Als je het setupproces hebt doorlopen kun je het XAMPP Control Panel openen. Hier kun je de webserver starten door op ‘start’ naast de module ‘Apache’ te klikken. Als de achtergrond van de tekst ‘Apache’ groen kleurt runt de webserver naar behoren.

Nu vraag je je misschien af hoe je jouw website nu kunt zien. Zoek op jouw computer naar een map genaamd ‘htdocs’. Zet hierin de bestanden die te maken hebben met jouw project/site(code, afbeeldingen etc.). Ga daarna naar je browser en typ ‘localhost’ in de search bar. Dit representeert namelijk jouw lokale webserver. Vervolgens zou je de inhoud van jouw site moeten zien. Open de htdocs folder in een tekst-editor naar keuze en je kunt beginnen met het schrijven van code.

Ik hoop dat deze blogpost duidelijk genoeg is. Mocht dit niet het geval zijn, dan kun je me bereiken via Twitter, e-mail(nick@jorcademy.nl), of je kunt de vraag kwijt in de comments van deze post.

Hieronder is een video te vinden die gemaakt is door Bitnami en de installatie misschien nog net iets duidelijker maakt.

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *