blob logo

jonlinkens.com 2022/23

I created my original portfolio in 2019 so I could have something simple to share to showcase past projects. It was my first real React project, and so I used it for learning. I ended up achieving my goal of creating a simple website which I was able to update without any hardcoding—so why did I move away from this approach?

Optimisation

As stated before, it was my first React project. It functioned correctly, but I didn’t really hae a clue what I was doing. I was very trigger-friendly when it came to hooks and unnecessary state usage. It used a headless CMS to handle all content, which was completely overkill.

In combination with it being overengineered, it became a hassle to maintain. Lengthy build processes and complicated .env files deterred me from making any developmental improvements to what was essentially a blog website. Additionally, using a headless CMS was clearly not necessary, and it was clear I was not taking advantage of even half the features it offered. This had to change, and such reasons present the motivation for this newly written website.

With this iteration, I took what I had learnt from the previous and optimised it—taking all that was good about it and then applying the new things I had learnt in the time since then.

The switch to MDX

To address the problems I was having with using a headless CMS, I decided to store my content in a different way. I had experienced great success using MDX for other projects, and it seemed to be a clear choice considering that there was no longer a need for any sort of backend.

Now project posts are stored with the source code, including metadata thanks to gray-matter.

Improved design

After looking back at the old website, I found that the design didn’t feel as rounded and professional as I once thought it had. This mostly comes down to a change in preference, but I find that alone to be a big enough motivation for change: this website is meant to be a reflection of myself and so should mature as I do.

Animations

The old design was very animation heavy—something I have moved away from. This led to there being accessibility problems as well as many bugs with the site hydrating properly and on time, and so I decided to move away from using animations for the majority of the site content.

However,there are still some animations present in this site, such as the theme toggle, which uses Framer Motion. I experimented with page transitions early on in the development process, but found it to be cumbersome and not a fun user experience for my use case.


Overall, this new look serves as an improvement on a previous iteration, contributing to a more rounded and minimalist experience. I’ve found that sometimes less is more, especially when it comes to implementation.