How to switch between Node.js versions with Homebrew (2021)

Published May 4, 2021; last updated on May 10, 2021
How to switch between Node.js versions with Homebrew (2021)

Homebrew is an awesome tool for installing and managing packages installed on macOS. It is also the best way to install Node.js and, with that, npm. But sometimes you’ll need a different version of Node.js than the latest. In this tutorial I’ll show you how to switch between multiple versions of Node.js on macOS with Homebrew.

First we need to make sure that your environment is ready. If you’ve not already done so,

How to use DBngin & TablePlus for local development

Published April 6, 2021
How to use DBngin & TablePlus for local development

DBngin is very handy and lightweight application to get MySQL, PostgreSQL and Redis databases on your local machine. It features a simple way to spin up one or more databases. The combination with TablePlus – its ‘sister’-software – makes it very easy to view, manage and edit your databases. In this tutorial I’ll show you how to get your first DBngin database up and running and which credentials you need to use to connect to it.

How to allow only positive integers in HTML number input elements

Published March 30, 2021; last updated on April 6, 2021
How to allow only positive integers in HTML number input elements

I recently found myself in the situation where I was using an HTML number input element, but where I wanted to only accept positive numbers. That might seem like an easy task, but it turned out that it was quite complicated and that you needed to sprinkle in a little bit of JavaScript. In this article, I’ll show you how to only allow positive number input.

Let’s start with a simple HTML input element.

How to combine structured data into one script tag

Published March 16, 2021; last updated on April 6, 2021
How to combine structured data into one script tag

Adding structured data to pages on this blog has really helped improve my rankings. But sometimes you want to combine two or more ‘blocks’ of schema markup in the same <script> tag. On this page, I’ll show you how to combine multiple structured data elements into one declaration.

What is the ‘classic’ way to add structured data to a page? A single declaration is added in a <script> tag with a type of ld+json.

Check whether a Gravatar exists for a specific e-mail

Published January 29, 2021
Check whether a Gravatar exists for a specific e-mail

Gravatar is a great tool for getting avatars and profile images associated with a specific e-mailaddress. By default, if somebody has specified an image for their e-mail, that image can easily be retrieved. If the user doesn’t have an e-mail, Gravatar will return a standard image.

But what if you don’t want that default image? Gravatar has no easy option to check whether an image exists. WordPress has a function for this, called has_avatar(),

Automatically add anchor links to Gutenberg headings

Published January 26, 2021; last updated on January 28, 2021
Automatically add anchor links to Gutenberg headings

When you have a blog, you sometimes just want to link to the start of a specific paragraph. Especially with longer articles, I like to break it up in larger chunks. Unfortunately, the Gutenberg editor doesn’t automatically add an id to every heading it generates. You’d have to do this manually. As this is a very laborious task, especially when you publish regularly, I’m happy that there is an automated way of adding this.

Below a small table of contents for this article,

Create a custom cursor with CSS effects in iPadOS style

Published January 15, 2021; last updated on January 28, 2021
Create a custom cursor with CSS effects in iPadOS style

Custom cursors and hover effects have been advancing steadily on the web for the last two years. It makes a website more sophisticated and gives a certain elegance to it. I’ve been playing with custom animated cursors and hover effects and it turns out that it’s really easy to create a custom animated cursor – without much impact on page load and without huge JS libraries.

In this tutorial, I’ll show you how to create a custom animated cursor and implement that on your website.