My journey of building a new website while exploring exciting technologies

After being stuck with my old (very ugly and empty) personal website, and having a bit of spare time left, I thought, "Let's build a personal website where I can be proud of." This was a perfect opportunity to explore some new technologies I'd tried a few times but never really used in production. I want to share why I chose certain technologies and what my challenges were along the way.

Choosing the Right Technologies

Ultimately, I already knew which technologies I wanted to use. I had already used all of them in the past in a few small testing projects but never used them in a production setting in a clean canvas.

I wanted to try Tailwind CSS in production because I saw it becoming better and better. Also, seeing things like Tailwind Typography really intrigued me. This was a great chance to see whether it was something for me.

I decided to incorporate GSAP and Barba JS to create page transition and initial page load animations, something I normally only get to see on award-winning sites. I had all the time in the world to experiment with animations and ended up with the current transitions, keeping it clean after page load.

Implementing a dark mode switch was another interesting challenge. Although not quite as challenging, I absolutely love the effect.

Planning and Design

I started with creating the global sitemap of my site, thinking about what I wanted to add in terms of content. My initial idea was to create a one-pager, but after having one-pagers as a personal website for ages, I decided to go for something else.

The goal of my homepage is to be as simple as possible; it should, in a few words, describe who I am and what I do. More information can be found further on in my website. This is something I had doubts about in terms of user experience, but I liked the look of it, which mattered to me the most.

The "Simple" theme is continued throughout the whole site because I absolutely hate unnecessary complexity; in my opinion, that ruins the user experience.

Development Journey

The development was quite straightforward in the beginning. I decided I wanted to use Laravel as the base of my project. I would normally go for something like WordPress, but in this case, I wanted 100% control over the output on my site.

I started implementing my ideas from the last stage to the frontend with Tailwind CSS. Even though it was a bit of getting used to, I absolutely loved it. The simplicity it gives is amazing, and it really forces you to keep your templates clean and well-structured.

I used Tailwind Typography to style my typography, which took care of the hardest styling of the site, especially because I didn't have a design to copy from.

Using Barba JS was something I looked forward to, especially because I wanted to create the GSAP animations.

Something I always wanted to try was creating a static blog based on markdown, without using any database. It took some research, but it was actually quite simple and makes my site lightning-fast because I make zero queries to the database.

Overcoming Challenges

My biggest issue was creating the time to focus on it. The project was kind of built over months, trying some things, and just not going through. My new venture, Orange Bits, took priority, but I should have finished this sooner because it was in the back of my head for a long time.

Technically, I didn't have any major issues, only a few struggles while trying something new, for example, building my blog based on markdown files without a database to handle it all.

Testing and Optimization:

Because I took simplicity as a theme, I didn't have as many things to test. It also helped with the performance of the site, which is really good. I did almost forget to add a bit of styling to my 404 page, though.

Launch and Beyond

January 10, 2024, marks the day of me launching my new site, something I am very proud of, to say the least. Even though I am a developer, not a designer, I am really proud of how my site turned out. Maybe it helped that I built dozens of websites that were properly designed over the past few years.