SETUP: Installatie en Voorbereiding

Deze handleiding legt uit hoe je Hugo en Git installeert, en hoe je de website klaarzet om lokaal mee te werken.

Wat heb je nodig?

Om de website lokaal te kunnen bewerken en testen heb je het volgende nodig:

  1. Hugo - de software die de website genereert
  2. Git - voor versiebeheer en synchronisatie met GitHub
  3. Een teksteditor - om bestanden te bewerken (bijv. Visual Studio Code, Notepad++, of een andere editor)

Installatie voor Windows

1. Hugo installeren

  1. Ga naar de Hugo releases pagina
  2. Download het nieuwste hugo_extended zip-bestand voor Windows (bijvoorbeeld: hugo_extended_0.xxx_windows-amd64.zip)
    • Let op: Kies de extended versie, deze is nodig voor bepaalde functies
  3. Pak het zip-bestand uit en plaats hugo.exe in een map, bijvoorbeeld C:\Hugo\bin\
  4. Voeg deze map toe aan je Windows PATH:
    • Druk op Win + S en zoek naar “omgevingsvariabelen”
    • Klik op “Omgevingsvariabelen bewerken voor uw account”
    • Selecteer Path onder “Gebruikersvariabelen” en klik op “Bewerken”
    • Klik op “Nieuw” en voeg het pad toe: C:\Hugo\bin\
    • Klik op “OK” om alle vensters te sluiten

Controleer de installatie: Open Command Prompt (cmd) of PowerShell en typ:

hugo version

Je zou iets moeten zien zoals: hugo v0.xxx.x-extended windows/amd64

2. Git installeren

  1. Ga naar Git voor Windows
  2. Download en installeer Git
  3. Tijdens de installatie kun je de standaard instellingen gebruiken

Controleer de installatie: Open Command Prompt of PowerShell en typ:

git --version

Je zou iets moeten zien zoals: git version 2.xx.x

3. Teksteditor installeren (optioneel maar aanbevolen)

Download en installeer Visual Studio Code - een gratis en gebruiksvriendelijke editor.

4. Website repository clonen

  1. Maak een map aan waar je de website wilt bewaren, bijvoorbeeld C:\Websites\
  2. Open Command Prompt of PowerShell
  3. Ga naar die map: 
    cd C:\Websites\
  4. Clone de repository: 
    git clone https://github.com/torreirow/stwv-development.git
  5. Ga de map in: 
    cd stwv-development

Je hebt nu alle bestanden lokaal staan en kunt beginnen met bewerken!

Installatie voor Linux

1. Hugo installeren

Voor Ubuntu/Debian:

# Download de nieuwste extended versie
wget https://github.com/gohugoio/hugo/releases/download/v0.xxx.x/hugo_extended_0.xxx.x_linux-amd64.deb

# Installeer het pakket
sudo dpkg -i hugo_extended_0.xxx.x_linux-amd64.deb

Voor andere Linux distributies: Je kunt Hugo ook handmatig installeren:

# Download de binary
wget https://github.com/gohugoio/hugo/releases/download/v0.xxx.x/hugo_extended_0.xxx.x_linux-amd64.tar.gz

# Pak uit
tar -xzf hugo_extended_0.xxx.x_linux-amd64.tar.gz

# Verplaats naar /usr/local/bin
sudo mv hugo /usr/local/bin/

# Geef uitvoerrechten
sudo chmod +x /usr/local/bin/hugo

Controleer de installatie:

hugo version

Je zou iets moeten zien zoals: hugo v0.xxx.x-extended linux/amd64

2. Git installeren

Voor Ubuntu/Debian:

sudo apt update
sudo apt install git

Voor Fedora/RHEL/CentOS:

sudo dnf install git

Controleer de installatie:

git --version

3. Teksteditor installeren (optioneel maar aanbevolen)

Visual Studio Code: Download van code.visualstudio.com of installeer via package manager:

# Voor Ubuntu/Debian
sudo snap install code --classic

4. Website repository clonen

  1. Maak een map aan voor je projecten: 
    mkdir -p ~/websites
cd ~/websites
  2. Clone de repository: 
    git clone https://github.com/torreirow/stwv-development.git
  3. Ga de map in: 
    cd stwv-development

Je hebt nu alle bestanden lokaal staan en kunt beginnen met bewerken!

De website lokaal testen

Na de installatie kun je de website lokaal bekijken:

  1. Open een terminal/command prompt
  2. Ga naar de website map: 
    cd pad/naar/stwv-development
  3. Start de Hugo development server: 
    hugo server
  4. Open je browser en ga naar: http://localhost:1313

De website wordt nu automatisch ververst als je bestanden bewerkt!

Om te stoppen: Druk op Ctrl + C in de terminal

Veelgestelde vragen

Ik krijg een foutmelding dat Hugo niet gevonden kan worden

  • Controleer of Hugo correct geïnstalleerd is met hugo version
  • Windows: Controleer of het pad correct is toegevoegd aan de PATH variabele
  • Linux: Controleer of Hugo in /usr/local/bin/ staat en uitvoerbaar is

Ik zie geen wijzigingen als ik de website lokaal bekijk

  • Zorg dat hugo server actief is in je terminal
  • Ververs de browser met Ctrl + F5 (hard refresh)
  • Check of je het juiste bestand hebt aangepast

Hoe werk ik samen met anderen aan de website?

Zie de README.md voor informatie over werken met Git en het bijwerken van content.

Volgende stappen

Nu je alles geïnstalleerd hebt, kun je verder met de handleidingen voor het beheren van content: