Kevin Monteiro

DevOps Engineer

3D render - from unsplash.com
Glenn Carstens-Peters

My Personal Website

26th May 2025

I've always felt that real developers and tech people have to have an online footprint, whether that be a personal website or publicly available code in a remote git repository. So far, in my career as a DevOps Engineer (whatever that means today) with the focus on making sure the work I do for my employer and client is top-notch, I have completely neglected myself. I don't have an online footprint! Believing in the phrase it's never too late, I will create and host one in the coming days. This blog will be focused on following what I have done to get this website up, running, and accessible. If you are reading this right now, it will mean I've kept to my word and this is currently hosted on my website somewhere on the wide web which is a massive milestone for me. Thank you for being here with me at the start of my digital footprint!

To build or not to build

This question is always one of my biggest blockers on the front-end side of the build. I always ask myself, do I design and create my website or do I go with a ready-made template? I've historically always chosen to design and create my websites because I have the skills to do so and would love my website to be unique but I often get blocked on the design. I see myself as creative but indecisive with personal creative tasks and so I tend to start designing a website, essentially get overwhelmed/tired of the design process and become blocked. This made me think that if designing does not fit me at this moment then what are the current best options?

Personal website templates

My thoughts turned to templates. If there are billions of people in this world surely I am not the only person to have gone through this issue. With that in mind, a smart person must have created a template for those of us who can't design our websites and I was right. People/companies had already created these templates and some charged for it whereas others gave it away for free. In my investigation, I came across these 3 options:

Hugo Hugo JS

Hugo is one of the most popular open-source static site generators. With its amazing speed and flexibility, Hugo makes building websites fun again.

Hugo seems to be perfect for what I need, nothing more or less which in my mind is a good and a bad thing. It's good because static sites are generally quite easy to create and using one of their themes would make it even easier by avoiding having to make too many choices. The bad thing, I would likely have to replace it if I ever decided to have dynamic assets on the website.

Webstudio Webstudio

Webstudio is an open-source website builder that empowers creators to build highly maintainable and fast websites using modern web standards.

Webstudio looks very impressive and is a big plus that it is open source and can be self-hosted. The underlying tech behind Webstudio is remix which is a proven JavaScript framework. Seeing as this is a website builder, I would have to host the builder which exports a website that I can then host. I could run the builder locally whenever I want to create a website or make a change to an existing website and only host the outputted website. If further down the line I need to also host the builder, I would have to figure out how to do that myself as it is currently not advised to be hosted in a production setting. Out of the 3 options, the thought of using Webstudio felt like the best option but after further research, its community is growing and not very large yet. This meant there are not currently many templates to use and certainly none that I liked. I would also have to think about a good workflow to get the website hosted from builder to cloud.

Nim: Minimalist portfolio site Nim Template

Nim is a free and open-source personal website template built with Next.js 15, React 19, Tailwind CSS v4, and Motion. Designed for developers, designers, and founders, it combines minimalism with delightful animated components powered by Motion-Primitives.

This option is essentially a next js app deployed in vercel. I like the look of this starter kit as it allows me to get started very quickly with a template. This example has a minimalist design, a front page where I can write a simple about me, and a blog section for this to go into. The front page also has space for all the information you would usually put on your CV. Although some design decisions would need to be made to add these sections, I could do it over time as the website would have been hosted and the main design decisions are already made.

'Installing' nim

After deciding to use Nim, I got busy cloning it and making the updates required to make it mine. This project uses npm and so after cloning I chose to use node version 24.1.0 and then run npm install to install all it's dependencies.

Personalising the website

Now to personalise it to myself. I removed the projects sections and added education and certification sections. I made sure to update the name and role on the header section. The last update needed was the website title and to add a short sentence about myself. I do also need to add a picture of myself and a link to download my cv but that can be done at a later date as it requires more than just front end updates.

Hosting the website

Now that the website is ready to be published, I need somewhere to host it. One of my motives for creating this website is also to showcase my DevOps skills so I plan to use infrastructure as code (IaC) to host this website as cheaply as possible. The website and it's IaC repository live on GitHub.

I plan to use OpenTofu to deploy the website to Vercel. The state for OpenTofu will live in AWS S3. To do this, I first set up the project for OpenTofu using the documentation for vercel. An API token is needed, so I created a Vercel account and retrieved the API key to set it as a GitHub action secret. Using OpenTofu to deploy an app to Vercel is super simple. All that is needed is for a project to be declared with a reference to the framework of the website and where the website repository lives. Vercel then automatically tracks any changes made to the website's main branch and pulls and deploys it to production. Some manual work was required as I wanted to have a custom domain that represented me so I bought kbmm.cloud from hostinger.com. I added an A record and a CNAME record in Hostinger, so that the domain was able to be used on Vercel and then I used OpenTofu to declare the custom domain in Vercel so that it could be used.

At this point, everything was set and all I had to test was whether Vercel correctly deployed the website. This was achievable by doing an empty commit on the website repository and voila, we are live!

Thanks for going on this short adventure with me!