Writing a custom React hook: Google Places autocomplete

| 3 min read

I built a small React component that uses the Google Places API to autocomplete an address in a project I’m working on, and extracted the predection fetching to a custom useAddressPredictions hook. It’s a nice example of a custom React hook composed of different primisite hooks, so I decided to pen write my thought process while building it.

Read more


This site now supports dark mode

| 1 min read

I prefer to use light interfaces, so I rarely use dark mode in macOS or iOS. I often see people add dark mode to their sites, but never really knew whether visitors actually care. I started a Twitter poll:

Do you consider dark mode on websites / blogs (not apps) useful?

The poll is still open. At the time of writing, 225 people responded, and 47% answered “Yes”. Enough to convince me to add a dark mode to my blog.

Read more


React's versioning policy

React follows semantic versioning, but with a twist. From their versioning policy:

When releasing critical bug fixes, we make a patch release by changing the z number (ex: 15.6.2 to 15.6.3).

When releasing new features or non-critical fixes, we make a minor release by changing the y number (ex: 15.6.2 to 15.7.0).

When releasing breaking changes, we make a major release by changing the x number (ex: 15.6.2 to 16.0.0).

The twist is subtle: non-critical bugfixes are released as minor releases.

I’ve often wondered whether three digits really is necessary for versioning. As a package maintainer, deciding between minor and patch is often a gray area.

Two digits would suffice: breaking changes and non-breaking changes. Feature or bugfix doesn’t really matter from a technical point of view: upgrading can either break things, or can’t.

React reserves the patch number for critical bugfixes, which I believe is a necessary escape hatch in a two digit system. But I like I how they default to simply bumping minor versions.


Live updating Oh Dear! status pages: Livewire edition with Caleb Porzio

Last week I published a post about how I implemented live updates on an Oh Dear! status page.

Caleb Porzio rebuilt the page with Livewire. It’s pretty impressive to see how easy the process is by just adding a few built in Livewire directives.

Watch the short screencast on Caleb’s blog.


Inertia.js and Livewire: a high level comparison

| 7 min read

Both Inertia.js and Livewire have been in the spotlight the past few months. The two libraries often get put next to each other because of their (coincidentally) simultaneous releases.

I’ve seen many people compare the two, or ask if they can be used together. This post showcases their similarities and differences, and should help you understand which problems they each solve best.

Read more


Handling routes in a Laravel and Inertia app

| 2 min read

If you’re building an app with Laravel and Inertia, you don’t have access to Laravel’s helper methods because you’re writing views in JavaScript. This means you lose the ability to generate URLs on the fly with Laravel’s route and action helpers.

This short post outlines two ways to deal with routes in a Laravel and Inertia app.

Read more


Live updating Oh Dear! status pages

| 2 min read

Last week Oh Dear! launched a new status pages feature. I designed them and implemented their frontend. Here’s a live example on status.flareapp.io.

We were originally going to use Vue for the pages, so we could make the entire view reactive so we could easily fetch and update data with AJAX or websockets. I started building the status page view, but quickly became hesitant about the decision to use Vue. It didn’t feel like the right tool for the job.

Read more


How much JavaScript do we really need?

| 3 min read

How much should we invest in JavaScript as developers? I’ve asked myself that question over and over again. Around last year I came to a conclusion: I strongly believe JavaScript is a requirement for excellent user experiences. Not good experiences, excellent experiences.

Read more


Fast software, the best software

In his most recent essay, Craig Mod explores the effect of optimizing software for speed.

Speed and reliability are often intuited hand-in-hand. Speed can be a good proxy for general engineering quality. If an application slows down on simple tasks, then it can mean the engineers aren’t obsessive detail sticklers. Not always, but it can mean disastrous other issues lurk. I want all my craftspeople to stickle.

My newfound love for Hugo echoes this sentiment. It’s not the friendliest tool, but it’s speed and focus on doing one thing right makes it a joy to use.

That said, Sublime Text has – in my experience – only gotten faster. I love software that does this: Software that unbloats over time. This should be the goal of all software. The longer it’s around, the more elegant it should become. Smooth over like a river stone. I have full trust in the engineering of Sublime Text because I’ve used it for over a decade, but also because it always feels like a fast, focused tool (even though it’s actually very complicated) and has only become faster the longer I’ve used it.

Software that unbloats over time. What a beautiful idea.

Another excerpt that just had to be quoted:

Google Maps used to be a fast, focused tool. It’s now quite bovine. If you push the wrong button, it moos. Clunky, you could say. Overly complex. Unnecessarily layered.

Read the full essay on craigmod.com.


Adding webmentions to my blog

| 2 min read

I first noticed webmentions in the wild on Hidde de Vries’ blog about two years ago. Last week it finally happened, I added webmention support to my blog too! Well, partial support at least. I’m now receiving and displaying webmentions. Sending them out is a project for another day.

Read more