Static site generators¶

Enkele voorbeelden zijn:

Installatie Pelican¶

Maak een nieuwe map voor je blog (b.v. gipsite) en maak hierin een map met naam ‘src’.

Open een Opdrachtprompt in deze map (gipsite).

Maak hierin een virtual environment met naam ‘venv’.

Activeer je virtual environment en installeer pelican.

Installeer ook ‘Markdown’ via pip.

Ga via Opdrachtprompt naar de “src” map, en voer hier het commando “pelican-quickstart” uit.

Beantwoord alle vragen. Pelican maakt nu een aantal bestanden voor je aan.

Maak in de map ‘content’ een bestand aan met naam “2021-09-27.md”.

Open dit bestand in VSCode. Je kan op de Opdrachtprompt “code .” typen om automatisch de map in VSCode te openen.

Plak onderstaande code in je nieuw aangemaakte bestand “2021-09-27.md”:

Title: Mijn eerste post
Date: 2021-09-27 12:00
Category: GIP

Dit is mijn eerste post op mijn blog.

Voer in dezelfde Opdrachtprompt het volgende commando uit:

pelican content

Pelican maakt nu HTML bestanden aan die je kan uploaden naar een webserver.

Om je site lokaal op je computer te kunnen bekijken voor je onderstaand commando uit:

pelican --listen

Een alternatief hierop is via het volgende commando:

python3 -m http.server

Pelican (en vele andere static site generators) gebruiken het Markdown formaat.

Op onderstaande site vind je een tutorial over Markdown: https://www.markdowntutorial.com/

Je kan je site momenteel enkel op je eigen computer bekijken. De term ‘deployment’ slaat op het beschikbaar maken van je site op het Internet.

Een van de voordelen van ‘static site generators’ is dat je deze makkelijk, goedkoop kan hosten.

Je Internet provider biedt typisch webruimte aan als onderdeel van je Internetcontract.
Surge.ch biedt gratis hosting aan voor statische sites.
Netlify biedt gratis hosting aan.
Amazon Webservices biedt goedkope (niet gratis) hosting aan via S3.
GitHub biedt ook de mogelijkheid om sites gratis te hosten.

Maak een nieuwe repository aan met naam username.github.io.

Clone je website met b.v. VSCode.

Voeg een bestand toe met naam index.html

Commit het bestand en push de changes naar GitHub.

Bezoek je nieuwe website op: https://username.github.io

Verplaatst de .git map nu naar je Pelican output map.

Ga in de Pelican output map en voer volgende commando’s uit:

git add .
git commit -a -m "Update"
git push