blog-howest/content/project/project-2.md
2025-05-29 19:57:01 +02:00

2.4 KiB
Raw Blame History

title, image, date, description, draft
title image date description draft
Building My Hugo Website on a VPS /images/project/project-2.jpg 2025-05-29 00:00:00 +0000 UTC How I built and deployed my personal blog using Hugo and hosted it on a minimal Alpine Linux VPS. false

I built my personal blog using Hugo and deployed it on a lightweight Alpine Linux VPS. I chose this setup to have full control, keep things simple, and avoid bloated platforms or services. Heres how the process went from site generation to live deployment.


Creating the Hugo Site

On my development machine, I created a new Hugo site:

hugo new site howest-blog

I used the professors-hugo theme and copied its exampleSite content into my project. I customized the layout, structure, and styling by editing content files, SCSS in assets/scss/custom.scss, and partial templates in the theme directory.

All content lives under content/, with separate folders for blog/ and project/, each containing .md files with front matter and Markdown content.


Customization

I edited the config/_default/hugo.toml to configure site parameters like the base URL, theme, language, and menus. SCSS and image assets go in assets/, and are processed by Hugo's pipeline. Static files like favicons are placed in static/.

To preview the site locally:

hugo server

To build the static site:

hugo

This generates everything in the public/ folder.


VPS Deployment

I rented a minimal Alpine Linux VPS and installed only what I needed. After setting up SSH and a basic nginx web server, I copied the public/ folder over using scp:

scp -r public/* user@my-vps:/var/www/html

On the VPS, I installed nginx:

apk add nginx

And configured /etc/nginx/conf.d/default.conf to serve files from /var/www/html. Then I enabled and started nginx:

rc-service nginx start
rc-update add nginx

Now my Hugo site is live and served directly as static files, no backend, no database, just HTML, CSS, and JS.


Why Alpine + Hugo?

Alpine Linux is minimal and fast, perfect for serving static sites with low resource usage. Combined with Hugos speed and flexibility, I get a complete, performant setup that I fully control. Its secure, lightweight, and easy to update, just rebuild and re-upload the public/ folder.


This setup is perfect if you want full control and minimal overhead for a personal blog or portfolio.