bdnugget/linuxservice
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Compare commits

base: bdnugget:f4ef9fcbeac04e943862d78f8dc4381de1e4c4d2
Branches Tags
bdnugget:master bdnugget:develop
...
compare: bdnugget:8564125edfe649b628835b59d5b6e6463256fbf8
Branches Tags
bdnugget:develop bdnugget:master

2 Commits
f4ef9fcbea ... 8564125edf

Author SHA1 Message Date
bdnugget
8564125edf About me corrections and CTA button 2025-09-01 13:56:11 +02:00
bdnugget
0e6ddfede4 Add about me section 2025-09-01 13:14:29 +02:00
8 changed files with 200 additions and 9 deletions
Expand all files Collapse all files

BIN
linuxservice Executable file
View File

Binary file not shown.

27
main.go
View File

@ -38,6 +38,9 @@ type PageData struct {
ErrorMessage string
SuccessMessage string
FormData ContactForm
AboutName string
AgeYears int
SonAgeYears int
}
// ContactForm holds form data
@ -311,6 +314,29 @@ func (s *Server) healthHandler(w http.ResponseWriter, r *http.Request) {
w.Write([]byte(`{"status":"healthy","service":"linuxservice"}`))
}
// aboutHandler handles the About Me page
func (s *Server) aboutHandler(w http.ResponseWriter, r *http.Request) {
data := s.createPageData("Over mij - "+s.config.CompanyName, "about")
// Populate dynamic About fields
data.AboutName = "Brendon Bosman"
now := time.Now()
birthYear, birthMonth, birthDay := 1990, time.October, 17
age := now.Year() - birthYear
if now.Month() < birthMonth || (now.Month() == birthMonth && now.Day() < birthDay) {
age--
}
data.AgeYears = age
sonYear, sonMonth, sonDay := 2022, time.March, 11
sonAge := now.Year() - sonYear
if now.Month() < sonMonth || (now.Month() == sonMonth && now.Day() < sonDay) {
sonAge--
}
data.SonAgeYears = sonAge
s.renderTemplate(w, "over-mij.html", data)
}
// setupRoutes configures all HTTP routes
func (s *Server) setupRoutes() {
// Static files
@ -320,6 +346,7 @@ func (s *Server) setupRoutes() {
// Page routes
http.HandleFunc("/", s.homeHandler)
http.HandleFunc("/contact", s.contactHandler)
http.HandleFunc("/over-mij", s.aboutHandler)
http.HandleFunc("/health", s.healthHandler)
}

BIN
static/TuxAinrom.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 MiB

64
static/style.css
View File

@ -197,6 +197,35 @@ p {
gap: 1rem;
}
/* Two-row hero button layout */
.hero-buttons--stack {
display: flex;
flex-direction: column;
align-items: center;
gap: 1rem;
}
.hero-buttons-row {
display: flex;
gap: 1rem;
}
.hero-buttons-row--secondary {
justify-content: center;
}
.hero-buttons-row--primary {
justify-content: center;
}
@media (max-width: 480px) {
.hero-buttons-row {
flex-direction: column;
width: 100%;
max-width: 320px;
}
}
/* Buttons */
.btn {
padding: 12px 24px;
@ -927,6 +956,41 @@ footer {
color: #6b7280;
}
/* About page */
.about {
padding: 5rem 0;
}
.about-grid {
display: grid;
grid-template-columns: 1.5fr 1fr;
gap: 3rem;
align-items: start;
}
.about-text p {
margin: 1rem 0;
line-height: 1.8;
color: #374151;
}
.about-cta {
margin-top: 2rem;
}
.about-photo img {
width: 100%;
height: auto;
border-radius: 12px;
box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}
@media (max-width: 900px) {
.about-grid {
grid-template-columns: 1fr;
}
}
/* Responsive Design */
@media (max-width: 1024px) {
.container {

1
templates/footer.html
View File

@ -21,6 +21,7 @@
<p>Lid van <a href="https://nllgg.nl" target="_blank">Nederlandse Linux Gebruikers Groep</a> (NLLGG.nl)</p>
<p>Actief bij <a href="https://buurtlinux.nl" target="_blank">Buurtlinux.nl</a> initiatief</p>
<p>Wij ondersteunen de <a href="https://endof10.org" target="_blank">End-of-10</a>-beweging voor duurzaam computergebruik.</p>
<p><a href="/over-mij">Over mij</a> · <a href="/contact">Contact</a></p>
</div>
</div>
<div class="footer-bottom">

2
templates/header.html
View File

@ -13,6 +13,7 @@
<a href="/#voordelen">↓ Voordelen</a>
<a href="/#distros">↓ Linux-keuze</a>
<a href="/#diensten">↓ Diensten</a>
<a href="/over-mij"{{if eq .CurrentPage "about"}} class="active"{{end}}>Over mij</a>
<a href="/contact"{{if eq .CurrentPage "contact"}} class="active"{{end}}>Contact</a>
</div>
<button class="mobile-menu-toggle" onclick="toggleMobileMenu()">
@ -23,6 +24,7 @@
<a href="/#voordelen">↓ Voordelen</a>
<a href="/#distros">↓ Linux-keuze</a>
<a href="/#diensten">↓ Diensten</a>
<a href="/over-mij"{{if eq .CurrentPage "about"}} class="active"{{end}}>Over mij</a>
<a href="/contact"{{if eq .CurrentPage "contact"}} class="active"{{end}}>Contact</a>
</div>
</div>

23
templates/index.html
View File

@ -97,10 +97,15 @@
<section id="home" class="hero">
<div class="hero-content">
<h2>Geef uw computer een tweede leven</h2>
<p class="hero-subtitle">Windows 10-ondersteuning eindigt binnenkort? Geen probleem! Ontdek hoe Linux uw hardware nieuw leven kan geven.</p>
<div class="hero-buttons">
<a href="#voordelen" class="btn btn-primary">↓ Meer weten</a>
<a href="/contact" class="btn btn-secondary">Gratis advies</a>
<p class="hero-subtitle">Windows 10-ondersteuning eindigt binnenkort? Ik help u graag overstappen. Ontdek hoe Linux uw hardware nieuw leven kan geven.</p>
<div class="hero-buttons hero-buttons--stack">
<div class="hero-buttons-row hero-buttons-row--secondary">
<a href="/contact" class="btn btn-secondary">Gratis advies</a>
<a href="/over-mij" class="btn btn-secondary">Wie ben ik?</a>
</div>
<div class="hero-buttons-row hero-buttons-row--primary">
<a href="#voordelen" class="btn btn-primary">↓ Meer weten</a>
</div>
</div>
</div>
</section>
@ -186,7 +191,7 @@
<section id="distros" class="distros">
<div class="container">
<h2>Welke Linux past bij u?</h2>
<p class="section-subtitle">Er zijn veel Linux-distributies, elk met hun eigen voordelen. Wij helpen u de perfecte keuze te maken.</p>
<p class="section-subtitle">Er zijn veel Linux-distributies, elk met hun eigen voordelen. Ik help u graag de perfecte keuze te maken.</p>
<div class="distros-grid">
<div class="distro-card">
<div class="distro-header">
@ -309,7 +314,7 @@
<div class="distro-cta">
<h3>Weet u niet welke u moet kiezen?</h3>
<p>Geen probleem! Wij adviseren u graag over de beste distributie voor uw specifieke situatie en behoeften.</p>
<p>Geen probleem! Ik adviseer u graag over de beste distributie voor uw specifieke situatie en behoeften.</p>
<a href="/contact" class="btn btn-primary">Persoonlijk advies</a>
</div>
</div>
@ -317,11 +322,11 @@
<section id="diensten" class="services">
<div class="container">
<h2>Onze diensten</h2>
<h2>Mijn diensten</h2>
<div class="services-grid">
<div class="service-card">
<h3>Gratis advies</h3>
<p>Wij bekijken uw huidige computer en adviseren over de beste Linux distributie voor uw behoeften.</p>
<p>Ik bekijk uw huidige computer en adviseer over de beste Linux distributie voor uw behoeften.</p>
</div>
<div class="service-card">
<h3>Installatieservice</h3>
@ -384,7 +389,7 @@
<section class="cta">
<div class="container">
<h2>Klaar voor de overstap?</h2>
<p>Laat uw computer niet eindigen als e-waste. Geef hem een tweede leven met Linux!</p>
<p>Laat uw computer niet eindigen als e-waste. Geef hem een tweede leven met Linux - ik help u graag.</p>
<a href="/contact" class="btn btn-primary btn-large">Neem contact op</a>
</div>
</section>

92
templates/over-mij.html Normal file
View File

@ -0,0 +1,92 @@
<!DOCTYPE html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{.Title}}</title>
<!-- Basic SEO Meta Tags -->
<meta name="description" content="Over {{.AboutName}} - mijn band met Het Hogeland en waarom ik Linux promoot.">
<meta name="keywords" content="over mij, wie ben ik, Linux, Het Hogeland, Eenrum, Baflo, migratie, privacy, open source">
<meta name="author" content="{{.CompanyName}}">
<meta name="robots" content="index, follow">
<meta name="language" content="nl">
<!-- Open Graph Meta Tags for Social Media -->
<meta property="og:title" content="{{.Title}}">
<meta property="og:description" content="Maak kennis met {{.AboutName}} - Linux-evangelist van Het Hogeland.">
<meta property="og:image" content="https://{{.Domain}}/static/TuxAinrom.webp">
<meta property="og:image:alt" content="{{.AboutName}} - Linux op Het Hogeland">
<meta property="og:url" content="https://{{.Domain}}/over-mij">
<meta property="og:type" content="profile">
<meta property="og:site_name" content="{{.CompanyName}}">
<meta property="og:locale" content="nl_NL">
<!-- Twitter Card Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="{{.Title}}">
<meta name="twitter:description" content="Maak kennis met {{.AboutName}} - Linux-evangelist van Het Hogeland.">
<meta name="twitter:image" content="https://{{.Domain}}/static/TuxAinrom.webp">
<meta name="twitter:image:alt" content="{{.AboutName}} - Linux op Het Hogeland">
<!-- Favicon Links -->
<link rel="icon" type="image/x-icon" href="/static/favicon.ico">
<link rel="icon" type="image/png" sizes="32x32" href="/static/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/static/apple-touch-icon.png">
<link rel="manifest" href="/static/manifest.json">
<!-- Theme Color for Mobile Browsers -->
<meta name="theme-color" content="#059669">
<meta name="msapplication-TileColor" content="#059669">
<!-- Canonical URL -->
<link rel="canonical" href="https://{{.Domain}}/over-mij">
<!-- CSS and Fonts -->
<link rel="stylesheet" href="/static/style.css">
</head>
<body>
{{template "header" .}}
<main>
<section class="contact-hero">
<div class="container">
<h1>Over mij</h1>
<p>Maak kennis met de Linux-evangelist van Het Hogeland.</p>
</div>
</section>
<section class="about">
<div class="container">
<div class="about-grid">
<div class="about-text">
<p>Moi! Ik ben {{.AboutName}} ({{.AgeYears}}). Ik ben opgegroeid in <strong>Baflo</strong> en woon sinds <strong>2023</strong> in <strong>Eenrum</strong>, samen met mijn partner en onze {{.SonAgeYears}}-jarige zoon. Het Hogeland is mijn thuis - en juist hier wil ik mensen helpen om hun computers duurzaam, veilig en prettig te blijven gebruiken met Linux.</p>
<p>Linux gebruik ik al ruim <strong>20 jaar</strong>. Eerst uit nieuwsgierigheid, later uit overtuiging: het is veilig, snel, privacyvriendelijk en geeft je de regie over je eigen computer. In mijn werk heb ik <strong>meer dan 10 jaar</strong> ervaring als <strong>organisch chemicus</strong> en ben ik daarna <strong>softwareontwikkelaar</strong> geworden (nu <strong>5+ jaar</strong>). In beide werelden werkte ik veel met Linux en servers - van dataverwerking tot automatisering en betrouwbare infrastructuur.</p>
<p>Met {{.CompanyName}} wil ik de <strong>Linux-evangelist van Het Hogeland</strong> zijn: iemand die je helpt bij de overstap, de juiste keuzes met je afstemt en ervoor zorgt dat jouw computer weer jaren mee kan. Of je nu wilt migreren van Windows 10, nieuwsgierig bent naar Linux, of gewoon hulp nodig hebt met je systeem - ik sta voor je klaar.</p>
<p>Naast deze service run ik ook <a href="https://chemistry.software" target="_blank" rel="noopener">chemistry.software</a>, waar ik bedrijven help met wetenschappelijke en scheikundige softwareoplossingen. Die ervaring neem ik natuurlijk mee in mijn aanpak: praktisch, zorgvuldig en toekomstbestendig.</p>
<p>Wil je weten wat Linux voor jou kan betekenen of gewoon even sparren? Neem gerust contact op, ik denk graag met je mee.</p>
<div class="about-cta">
<a href="/contact" class="btn btn-primary">Neem contact op</a>
</div>
</div>
<div class="about-photo">
<figure>
<img src="/static/TuxAinrom.webp" alt="Foto van mijzelf">
<figcaption><small>{{.AboutName}}</small></figcaption>
</figure>
</div>
</div>
</div>
</section>
</main>
{{template "footer" .}}
</body>
</html>