Doel

Vooreerst wil ik mijn publieke website een meer professionele look-en-feel geven.

Vervolgens wil ik mijn documentatie beter organiseren en mijn kennis beter beheren.

Ik wil ook beginnen met de aanmaak van een applicatie-development-en-deployment server-omgeving op mijn home-server (“nas-devdepserver” genoemd).
Voorlopig wil ik hierop enkel een Git repository manager voor source code, een build server en een registry voor binaries als centrale tools voorzien.

Resultaat

1 - Upgrade van publieke website naar professionele look-en-feel

Ik begon met de layout van vele bestaande websites op het internet te bekijken en vergelijken.
Ook las ik vele reviews die website-layouts bespreken en vergelijken,
en leerde ik de in gebruik zijnde presentatie-standaarden voor publieke sites op pc en mobile.
De 2 belangrijke eigenschappen voor publieke layouts zijn volgens mij:

makkelijk bruikbare functionaliteit (easy usable)
visuele attractiviteit (beautiful)

Ik opteerde voor een layout zoals die van de VRT NWS 👆 website.
Deze layout heeft een frisse, niet te beladen look en is tevens gemakkelijk te bedienen op desktop en mobile.

Vervolgens zocht ik informatie om deze look-en-feel te implementeren.
Vooral op het vlak van visuele attractiviteit moest ik nog veel bijleren:

een meer gevorderd gebruik van css en tailwind css:
responsive positionering en dimensionering van elementen,
gebruik van absolute, relatieve en flexbox layout,
dynamische styling met calc() in css,
gebruik van clipping, overflow en aspect ratio voor images en videos
het beschikken over royalty-free video’s, foto’s, illustraties en backgrounds:
ik heb nu een lijst van gratis sites die deze bruikbare elementen verzamelen
betere organisatie-mogelijkheden van Hugo layouts en shortcodes
(het onderhoud van mijn site werd hierdoor veel eenvoudiger)

Ten slotte heb ik ook beschikbare services bekeken om het bezoek van websites te kunnen analyseren en opvolgen.
Dikwijls wordt voor “Google Analytics” of “Umami” gekozen als gratis oplossing.
Omdat ik mijn website reeds heb gehost op Cloudflare, koos ik uiteindelijk voor de gratis “Web Analytics” service van Cloudflare.
Na configuratie van deze service kan ik nu volgende metrieken gemakkelijk opvolgen via een dashboard:
historiek van aantal page-views, toestel-os-browser gebruikt door bezoekers, enz.

2 - Vereenvoudig het beheer van kennis en documentatie over HomeLab technologie

Bij het uitvoeren van mijn computer-projecten leerde ik zeer veel bij over computer-technology.
De meeste informatie vond ik door te zoeken via google search en via youtube video’s.
Al de referenties voor de goede informatiebronnen hield ik bij en eigen documentatie maakte ik aan via markdown files.
Doordat de informatie-hoeveelheid erg groot wordt en tevens moeilijk te structureren is in files,
is het onderhouden/uitbreiden ervan en het terugvinden van info erg moeilijk geworden.

Ik zocht daarom een andere aanpak met software ondersteuning om kennis-beheer en documentatie-aanmaak te vereenvoudigen.
Ik bracht daarom alle reeds beschikbare informatie samen in categorieën en dit koste heel veel tijd en inspanning.

Na grondig ondezoek opteerde ik voor de “Obsidian” software (vs Notion, Capacities).
De meest gebruikte standaard-aanpak door onderzoekers is de “Zettelkasten” methode.
Echter developers en devops gebruiken eerder een persoonlijke aanpak met eigen structuur in Obsidian.
Voor mij is dit kennisbeheer volledig nieuw en kies ik om te starten met een eigen aanpak.
Ik maakte daarom 2 Obsidian kennisbanken of “vaults” (afgekort “OV”):

“OV-ComputerTech”:
bevat algemene info over computer-technology die ik kan delen met anderen
“OV-MyHomeLab”:
bevat specifieke info over eigen software, computers en netwerk-configuratie die enkel voor mij toegankelijk is

Om deze Obsidian Vaults overal toegankelijk te maken en ook backups te hebben,
heb ik git repositories van deze vaults gemaakt.
Nieuwe kennis zal voortaan daarom in deze Obsidian vaults bijgehouden worden,
en reeds bestaande informatie zal gradueel ook opgenomen worden in deze vaults.

3 - Vereenvoudig de installatie van server-software

Op mijn NAS/Home-server heb ik in vorige projecten manueel Proxmox als OS geinstalleerd.
Daarna installeerde ik ook de lxc-container “nas-fileserver” en de virtual machine “LinuxMint” op deze “proxmox01” node.
In dit project wil ik verschillende nieuwe lxc-containers (met hierop allerlei software) installeren,
die voor de development en deployment van zelfgemaakte applicaties zullen gebruikt worden:
“home-pvehelper”, “home-utilityserver”, “home-devdepserver”, “home-testappserver” en “home-prodappserver”.
Later zal ik ook de nu bestaande “proxmox01”, “nas-fileserver” en “LinuxMint” reorganiseren, opnieuw installeren en hernoemen
naar “pve”, “home-fileserver” en “demo-LinuxMint”.
Dit is het begin van Platform Engineering die ik in volgende posts verder ga uitwerken.
Zie Architecture of my home server 👆 voor de situatie op het einde van dit project.

Omdat dit erg repetitief werk is, zocht ik een manier om de installatie van software te automatiseren.
Als eerste implementeerde ik een verbeterde LXC Container Template “templ-ubuntu”.
Hiertoe leerde ik eerst de mogelijkheden van “Bash Scripting”.
Ik heb bash-scripts gemaakt om een lxc-container te creëren, te verwijderen en te klonen met behulp van het proxmox “pct”-commando.
Vervolgens diende ik een manier te vinden om gemakkelijker bijkomende software te installeren.
In “templ-ubuntu” installeerde ik software “Curl”, “Docker”, “Stow”, “Git” en “Zsh” via nieuwe bash install-scripts.

??? TODO ???

Via de “templ-ubuntu” template creerde ik de “home-devdepserver” server via de pve-scripts.
Daarna installeerde ik software “Ansible” en “Semaphore” op deze “home-devdepserver”.
Hiertoe leerde ik eerst de syntax en mogelijkheden van “Ansible” en “Semaphore”.

Ten slotte installeerde ik manueel via Proxmox Web interface de “LinuxMint” software op een nieuwe “demo-LinuxMint” VM.

4 - Vereenvoudig het refereren naar services en applicaties op thuisnetwerk

Als eerste wou ik servers in mijn thuisnetwerk een logische hostnaam geven om er gemakkelijk naar te kunnen refereren.
Omdat ik zelf geen eigen DNS-server wou hosten, heb ik hiervoor subdomeinen van mijn geregistreerde publieke domeinnaam gebruikt.
Voor mijn geregistreerde domeinnaam “robertthecoder.org”, koppelde ik subdomeinen als logische hostnaam aan privé-IP-adressen.
Aangezien dit privé-IP-adressen zijn, zijn deze hostnamen enkel toegankelijk binnen mijn lokale netwerk.
Om deze subdomeinen voor privé-IP-adressen gemakkelijk te kunnen onderscheiden van andere subdomeinen,
geef ik ze altijd de prefix “home-”.

Om op een eenvoudige manier toegang te hebben tot al mijn services en applicaties,
maakte ik een eigen homelab dashboard/portal met links er naar toe in groepen ingedeeld.
Voor de implementatie koos ik voor de populaire en gratis “Homarr” software
(vs Homer, Heimdall, Glance, Homepage, Dashy).
Ik gaf deze server ook de DNS-naam “home-utilityserver.robertthecoder.org”.
De “proxmox01” node gaf ik ook een interne DNS-naam “home-pve.robertthecoder.org”.

De meeste services en applicaties vereisen een paswoord om toegang te hebben.
Om deze paswoorden te beheren, gebruikte ik tot nog toe de gratis versie van “Bitwarden” (vs “KeePassXC”).
Ik ga nu echter volledig overstappen naar de gratis community-versie van “Passbolt”.
Passbolt installeerde ik op mijn eigen home-server in mijn thuisnetwerk.

In deze sectie installeerde ik dus software Homarr en Passbolt op “home-utilityserver”.

5 - Server tools voor development en deployment van web apps

Op mijn windows development pc werd ook reeds “Git”, “VSCode” met “Git Graph” en “MSEdit” geïnstalleerd.
Ik installeerde nu bijkomend “Docker”, “Podman” en “Portainer” op mijn windows pc.

In vorige projecten maakte ik reeds gebruik van de publieke github.com site.
Voor de development en deployment van eigen applicaties wil gebruik maken van git repository manager.
Omdat ik deze git repository manager zelf wil hosten op mijn eigen home server,
vergeleek ik hiervoor populaire softwares: “GitLab - Community Edition” en “Gitea - Free Edition”.

Ik leerde eerst de gitlab-basis op de publieke gitlab.com site.
Ik leerde hier niet enkel de basis Git-commando’s, maar ook de bijkomende Gitlab functionaliteit.
Een eenvoudige HelloWorld-applicatie werd aangemaakt en opgeslagen, gebruikmakend van een Gitlab CI pipeline.
Via Docker werd voor deze voorbeeld-applicatie een container image aangemaakt,
die dan werd opgeslagen in de Gitlab Container Registry.

Omdat deze GitLab software veel resources vergt en voor mij te uitgebreide functionaliteit bevat,
koos ik uiteindelijk voor de “Gitea” software.
Gitea is een lightweight GitHub alternatief, speciaal gemaakt voor self-hosting en bevat:

“Gitea” (vs “GitLab”, “GitHub”) als repository voor source code
“Gitea Actions” (“GitHub Actions” alternatief, vs “Gitlab CI & Runners”, “Jenkins”) als build server
“Gitea Package Registry” (vs “Gitlab Registry”, “Nexus”) als registry voor binaries en oci images

Ik installeerde nu hier bijkomend de laatste free versie van Gitea.
Op de lokale Gitea-server heb ik eerst één groep “robertthecoder” (mijn “bedrijf”) op rootniveau aangemaakt.
In deze hoofdgroep heb ik drie subgroepen aangemaakt: “app”, “util” en “example”.
Projecten zullen voortaan altijd in een van deze subgroepen aangemaakt worden.

In deze sectie installeerde ik dus software Gitea naast Ansible en Semaphore op “home-devdepserver”.
Ik gaf deze server ook de interne DNS-naam “home-devdepserver.robertthecoder.org”.

6 - Installatie JetKVM

De IP based KVM van JetKVM werd pas geleverd (zie blog-post van 01-10-2025).
Deze KVM werd gekoppeld aan mijn home-server en uitgetest.
Deze JetKVM ga ik later gebruiken om de bestaande “proxmox01” en “nas-fileserver” volledig opnieuw te installeren als “pve” en “home-fileserver” via script files.