Time for a change

New Zealand moved into another lockdown, thanks to the Delta variant of the coronavirus. The past few months were busy building systems related to research, and the lockdown put related user studies on hold. With some spare time back on the calendar, it finally made sense to rebuild the website, something that had been postponed for years.

Since the blog was started five years ago, WordPress has been the platform of choice. It did what it needed to do, but it wasn’t very flexible, and it started to feel a bit outdated. The need for a new solution had been there for a couple of years; the lockdown finally created the space to do it.

A new solution

PhD work involves a lot of software development, so building a custom solution isn’t the hard part. The harder part is maintenance, which tends to be more complex than the initial build. So the approach here was to choose a solution that doesn’t require any server-side code: no server-side bugs, fewer security risks, and less maintenance.

Outside of the MagicMirror project, there wasn’t much prior JavaScript experience. Still, a JavaScript-based framework seemed like the right direction in 2021. A quick search surfaced Vue.js; reading further led to Nuxt and Nuxt Content from the Vue community. The appeal was simple: convert static Markdown files into statically rendered pages and make publishing easier.

Some items on the wish list for the new blog:

• Clean design that looks beautiful on both desktop and mobile.
• The option to switch between light and dark themes.
• A way to organize posts - tags and series
• Fast loading time.
• Clean Typography.
• RSS feed
• Means to check the traffic to site

With Nuxt, Nuxt Content, Tailwind CSS, and Netlify, the work started to check all of those boxes.

Choosing a hosting platform

Keeping up with the cost of "cheap web hosting" can be surprisingly difficult on a student budget. By the end of 2018, the WordPress site was taken down due to those costs and replaced with a simple static site that looked more like a CV. In 2019, Netlify entered the picture, and a blog went live using one of the provided sample templates. Then life got busy, and the site sat untouched for the next couple of years.

Here's the core difference between traditional web hosting and static hosting. Think of a webpage as a block of data. In the conventional approach, a computer is rented, the data is stored on that computer's disk, and a program runs on that computer to serve that data. In Netlify's case, content is distributed so multiple people can access it through the network from their own devices simultaneously.

Shared hosting typically shares CPU, RAM, and disk across customers. In contrast, Netlify primarily serves static assets from a global CDN (a CDN is included even on the free plan, and higher tiers offer more). This model enables free hosting with excellent performance because operational costs are low. Since static hosting is served over a CDN, performance tends to be excellent.

Considering there's no computing time when the browser hits the CDN servers, your site's Time to First Byte will be very short, regardless of the geographic location.

The catch is that server-rendered websites can't be hosted as-is. Frameworks like WordPress don't run directly on Netlify (although a static site that pulls content over the WP REST API can work). If server-side compute or a database is required, Netlify provides options like functions and integrations even on the free plan, but it needs to be built differently than a traditional PHP setup.

Some reasons Netlify is a solid option:

• It's free
• Easy to use
• Deploy in seconds
• Continuous Deployment (CD)
• Branch Deploys
• Free Private Repo Hosting
• Deploy Previews
• Asset Optimization
• Free SSL
• Rewrites and Redirects
• Custom Subdomains
• Free DNS