Snippets about webdev

Trusted certificates for localhost with mkcert

HTTPS on your dev server without the browser warning, in three commands.

Lazy load images without JavaScript

Two attributes and the browser handles it.

Open external links in a new tab the right way

What target="_blank" needs next to it, and whether it needs anything anymore.

Do something when an element scrolls into view

Lazy loading, fade-ins and "read" markers without a scroll listener.

Fetch with a timeout

fetch() waits forever by default. Give up after a few seconds.

Respect prefers-reduced-motion

Some people get dizzy from your fancy animations. The browser tells you who, so listen.

Copy text to the clipboard

The modern clipboard API in three lines, with the gotchas.

Debounce a function in plain JavaScript

Run a function only after the user stopped typing, without pulling in a library for it.

Create timeout in an async function

To throttle the execution of our async function we will create a timeout method.