I’ve been on a digital journey this week to prepare for updating my personal site. I haven’t truly updated my site’s theme in so many years that it’s broken to use as is.

So, I decided to search for a similar type of theme, which is Roots Sage theme. When I chose it, it was a fascinating alternative to the type of WordPress themes of the late 2010s. The file organization and progressive nature of tooling and packages was quite attractive to developer me. This came as the expense of letting it sit there and technology changing, with multiple upgrades on my personal machines to disrupt the ability to use the same tooling and tech stack.

That leads me to this week’s priority. Knowing how convoluted Webpack is, it’s a complicated bundler. There are so many additional packages that’ll enhance the experience but add additional overhead for upkeep.

Sage also moved on to a new major version and that team refactored the theme enough that it has at least one or two external dependencies from new repositories. I tried to work with this new architecture a couple of years ago or so and it was just too much.

Knowing I didn’t want to continue with a theme using Webpack, I searched for non-Gutenberg centric themes that includes a newer bundler called Vite. Why Vite and not others like Parcel? Honestly, because Vite seems to have better momentum. And I was able to find plenty of themes using it, most of which are not useful to me.

One stands out and I believe it’s going to work. I can’t remember exactly how I found this theme, and it’s buried in a develop branch, but so far this Footmate Pro theme is working pretty well. There are enough similarities between the Sage theme and this theme that I’m intending a 1:1 transition where possible.

I had a couple of days of issues trying to copy some of the old template file code into this new theme, primarily because using a newer version of Laravel meant new functions are sometimes needed for templates. I temporarily stopped and tried working with a different Vite based WordPress theme, but it was just too outdated to work. I returned to this theme, reviewed Sage’s newest version to review newer Laravel code updates, and applied a newer function that finally fixed the issue. So I believe things shouldn’t be as difficult.

One of the amazing things this theme offers with Vite is the ability to do live page reloading using the same local URL, rather than an additional localhost address. This means that saving an HTML, CSS, or JS file with updated code will immediately update your site at https://example.local rather than needing to use http://localhost:3000. This is a long standing pain point we’ve had using reloading tools!

If this truly works out, I’m going to attempt to keep abstracts to a minimum, and continue to include tools for an indieweb presence. PHP and Laravel will provide server side work, but most client-side code will be plain ‘ole HTML, CSS, and JS.

Beyond this, we’ll see where WordPress fits into everything. I’m evaluating other tooling like Astro and 11ty. I’m ready for a future proof technology that won’t pose huge issues if I have to pause for another amount of time.