Welcome to Version 4! 🎉

Hello! 👋

Things look very different here.

What’s new? Everything.

Introducing NextJS

I’m no longer using the Gatsby framework. This website is now built using NextJS. I’ve been using Gatsby for nearly four years but I’ve heard a lot about NextJS and it’s one of the most admired frameworks according to the 2023 Stackoverflow survey.

NextJS is a React framework that has great features out of the box such as:

• built-in optimisations
• CSS support
• Route handlers

I’m not alone in using NextJS. Here are a few companies that have used NextJS:

• Twitch
• Netflix jobs
• Notion
• Target
• Nike
• TED
• Marvel

I’ve had a good experience with NextJS so far. It has an excellent tutorial and great documentation. Definitely give it a look if you’re looking to build a web application.

Introducing Vercel

Also after using Netlify after four years, I’m changing to Vercel for building and publishing this website. Since NextJS is built by Vercel, it made sense to use their platform for building.

Plus, since I’m using NextJS on Vercel, I get access to the following features…

Speed Insights

Performance is important, and I want to get a better understanding of how this website is performing and Vercel offers speed insights. Now I can get a better view of what the real experience is like for users.

Vercel Web Analytics

I’m curious to see how many people view my site, where users are from and what they use to view this site. Thankfully, Vercel have a great set of web analytics available.

Plus, it’s privacy friendly! This uses a generated hash for visitors and means visitors can't be tracked between different days or different websites.

Static Site Generation

Prerender, automatically cache and distribute generated NextJS pages to every Edge Network region hosted by Vercel.

And more!

But why?

My original website has gotten really big. The number of packages I had on it was tremendous, and I’m having to install legacy dependencies for packages to get the application running now. It’s become a bit of a mess!

So, I decided to start again.

The main objectives of this redesign are:

• A website that has good performance
• A bigger focus on readability (because this is a blog)
• Less animations (as this did impact performance slightly and probably didn’t bring that much value)

What’s new?

First, a whole new colour scheme. This site now uses three colours; white, black and blue.

The mobile view has also been modified slightly, I think it’s now slightly better.

Next a new and more consistent font choice. This will use a set of fonts that look similar to ‘San Francisco’ by Apple and has multiple fall backs in case one font isn’t available. These fonts should improve the reading experience of blog posts.

Let’s talk about the blog page, as that’s had a lot of changes. Here’s what’s changed:

• Removed image at the top of the page, it was taking up a lot of space (along with the name)
• The way the posts were being displayed got a bit messy, so this has been redone.
• Added a signature at the end of each post with links.
• And finally, something that I’ve been wanting for a very long time, pagination! I originally started this on my Gatsby blog, but I never got it working. Got it working on NextJS relatively quickly. I’m very excited to get this feature working!

Previous features such as a RSS feed is here as well.

Imported content

All posts (yes, all 97 posts) have been imported from my previous site to this site. Hooray for no missing content!

Start your blog, today!

As always, I keep the code to my blog free and open for anyone to use. Feel free to fork the repo, deploy to Vercel (or somewhere else like Netlify) and start your own blog! Here’s a link to the GitHub repo for my new blog.

I plan on making a more suitable template to make it easier to get up and running if you want to make your own blog.

The previous version of my blog (that was built with Gatsby) is still available, the README will be updated to state that it’s no longer being used.

Get in touch and let me know what you think.