It's been awhile since I've worked on this website, and it's time it has gotten some love! ❤️
I recently completed a Typescript React course during some bench time I had in my first week back at work this year, and I was eager to put it into action.
My portfolio website seemed like a good choice because I wrote it a loooong time ago, but I didn't quite realise how much work it needed. In fact, the last time I touched this codebase was at least a year ago, when I was playing around with an auth callback page for a WebExtension I was working on. (Still isn't published btw 🙃) - but that's a story/project for another day!
The effort needed was also compounded by the fact that I recently got a new M1 powered laptop from work (Super excited, huge upgrade over my old 2015 MBP). This meant my existing Gatsby v2 codebase wouldn't even build.
Apple Silicon wasn't supported until node 16 so I had some work to do. Fortunately my website is very simple, and the Gatsby team maintain documentation for all past major versions of Gatsby. They even include comprehensive migration guides, e.g. this one for v4 --> v5.
Luckily with the help of the migration guides, it was pretty easy to get onto the latest version of the framework. The only issues I had were with a third party Gatsby plugin that sources my instagram posts on my About page. Following the guides allowed me to quickly bring my dependencies up to date. But there was still more work to be done. There were plenty of warnings and errors around various API changes that I had to resolve one by one until gatsby develop was happy.
Then the work to migrate to Typescript started. Thankfully, there's yet another guide to follow! Per the documentation I started with gatsby-config and gatsby-node. For the most part, this was straight forward. I was really impressed by type generation for graphql queries, so I decided to enable it. It mostly worked out of the box, however I had to use createSchemaCustomization to override the result types to be non-nullable, as I wanted the fields in my blog post frontmatter to be compulsory! Then began the piecemeal migration to typescript for everything else. It feels very satisifying moving to typescript, especially as issues are picked up that I was previously unaware of such as extraneous fields and incorrect usage of certain APIs! I'm now much more confident in how my website is configured 😁
One of the other cool new features with newer versions of Gatsby (>=4.19.0) is their Head API. The Head API makes it really easy to set SEO attributes on a page by page basis, rather than the arbitary nesting of gatsby-helmet/react-helmet components. Gatsby-helmet is actually being deprecated in favour of their new solution which promises smaller bundle sizes and a more react-like feel. While it's not obsolete yet, I'm happy to be ahead of the ball for this change!
I also introduced a new tool I have been enjoying using - ASDF. Basically it lets you install multiple versions of tooling/runtimes and lock specific versions for use on a project by project basis. It's kind of like NVM for node, however the key difference is that it supports plugins for other toolchains. So you can lock in versions for several different build tools using the same CLI tool, such as yarn, nodejs, ruby, python etc - they'll all be neatly bundled up in the same .tool-versions file.
For the foreseeable future, most likely. It does what I need it to do, and does it well. The documentation is well written and easy to follow which certainly helps when you don't work on your website for a few years 😅.
Although I have also enjoyed working with NextJS, and that's probably where I would move to next. If I had to move that is. NextJS has familar features such as static site generation, but it also provides the flexibility to build much more complicated sites and even includes an API layer - super handy for someone like me with not a whole lot of backend experience yet
As my homepage has said for awhile now, I want to set up CI/CD. I've dabbled with it a little bit for work, and while it would be overkill for this website it would be a valuable learning experience.
This year is also gonna be the year I publish some more of my projects. There's such a backlog now, all in various stages of completion. I look forward to shipping some things this year 🚀