I built my first personal website more than 20 years ago. (Unfortunately, I haven’t kept count of how many of them I’ve already created until now.) This time, I’d like to document the process. Even though the result in the browser looks nice, clean and somehow simple, there’s quite a bit of work going on behind the scenes when creating such a website.
- current version
#4 Refactoring, part 1
These are my favorite updates on a website speaking from a developer’s perspective. The ones nobody notices. Usually, these are also the updates that often take longer than expected, and as such they are also my least favorite updates to communicate to clients (“Why do I have to pay for this, it looks exactly like before?”) 🙈.
After being in a hurry by the end of the year 2025, I needed to clean up the hardcoded mess I created when introducing thoughts.
I learned
- how to set up and work with content collections in Astro to create an overview page and detail pages
- how to use MDX files for the content and pass custom components to MDX content to be able to add extra HTML attributes to external links
This worked so well that I also removed all the hardcoded parts of the changelog page and now use content collections there as well. Additionally, I refactored some of my existing components, removed now unused code, and introduced CSS custom properties for spacing values.
So, even on a small website there are already a lot of reasons to refactor code and prepare the codebase for future updates.
- Go back in time 🚀
#3 Add thoughts
I decided to add a small blog to my website. A collection of thoughts about the ups and downs in life. All my technical and web development related blog posts will continue to be published on scale.at. For everything else I want to write about every now and then, there’s a new space here on this website.
- Go back in time 🚀
#2 Add changelog
To document all the changes step by step, I decided to create a dedicated changelog page where I share the most important and interesting updates to this site. I plan to describe what I did and also share inspiration and resources used.
For this step I had to add a navigation to the site and a new subpage, called Changelog. I also plan to keep all previous versions of the site. To achieve this, I set up branch deploys on Netlify. Every website version that made its way to production in the past will live in its own GitHub branch from now on. The individual deploys are linked in each changelog entry. Let’s see how this is going to work for future updates.
- Go back in time 🚀
#1 Initial commit
Starting off from a blank canvas is not easy because everything is possible and only the sky is the limit. I knew that I wanted my website to be somehow minimalistic, so I found some inspiration on Dead Simple Sites and had a look at other developer portfolio sites that were suggested to me on Bluesky.
I looked for color inspiration on coolors and fell in love with the font Sentient as suggested by Oliver Schöndorfer on Pimp my Type. For a fluid typescale, Utopia is my place to go.
The hardest part was writing the first lines of text. What should this website be about? But there’s still time to figure this out…
When I was happy with the landingpage, I set up a GitHub action to deploy the site (which is built with Astro, by the way) to Netlify.
Tadaaa… 🎉 here we are!