Fresh Reads

Shell function to show line in file with context Today I wrote a shell function to display lines in a file, with optionally some surrounding lines for context. This can come in handy when looking at output like stack traces including files and line numbers and you want to see…

Beyond Git aliases: git clone + cd When a Git alias doesn't provide enough scripting powers, here's a clean way to go beyond them. This is a little technique I cobbled together trying to clone a GitHub repo and cd into the created directory in a single go, but couldn't find an…

Privileged, but not a clown This is a story in 3 parts about OSS and me: how it started, how we got here, and how it's going. Part 1. How it started View Source Soon after the first "View Source" in Internet Explorer 5.0, and copy-pasting a snippet from a <SCRIPT> tag into some…

Subpath imports and TypeScript path aliases are useful and convenient features, especially in large codebases. Both are pretty widely supported across runtimes and bundlers for the web. However, the situation is different in more "vanilla" setups when using the TypeScript…

The State of Benchmarking in Node.js Benchmarking becomes more important as we build more and more applications and tooling for runtimes like Node.js and Bun. This article is about macro and micro benchmarking, and explores options we can use today. The article includes code…

Versioned documentation with Starlight & Vercel Introduction Let's say in our project we're working on a new major version. This may come with new features or even breaking changes. Users that did not upgrade yet reading documentation for the new version might get confused. This…

How to use a compiled bin in a TypeScript monorepo with pnpm Today's scrap has a very long title and is about pnpm workspaces that contain a compiled executable in a TypeScript monorepo. Problem When running pnpm install in a monorepo, the local bin file of a workspace may not…

Using OpenAI with JavaScript When trying to find my way around in the buzzing lands of OpenAI and vector databases, the dots were not always easy to connect. In this guide I'm sharing what I've learned during my journey to make yours even better. You might find a trick or a…

Using Git bisect to divide & conquer When you have a series of commits and want to find where a bug or a change of behavior was introduced, git bisect is your friend. With a command that understands what is "bad" and what is "good", this process can be fully automated. For…

Handling errors in Azure pipelines Put mildly, Azure pipelines don't always behave as expected. Sometimes a pipeline does not fail when it should. This scrap shows a few solutions to make pipelines fail for script and task errors. Contents We're going to look at three cases and…

The value of abstractions In software systems, maintenance quickly becomes harder as more components are added. Given a well-designed system, when a component deteriorates, it should be possible to refactor or replace it without major impact on other component in the system.…

import './styles.css'; To stack elements using CSS, we previously had to turn to absolute positioning and z-index tricks. Yet with CSS Grid, there's a new way to do this. To show what I mean, we're going to build this example component: :::section :::div{.grid} ::div{.back}…

The JavaScript block statement In the first scrap of this blog I'd like to make a case for a great little feature that I rarely see used in the wild. Want to organize your code a little bit better? Have a hard time coming up with another name for the same variable? Want to run…

How to add search to your static site Static websites are popular nowadays. There are many static site generators, but not all have search built-in. Recently I've added a static search option to a few websites, including the one you're reading. In this article I would like to…

Using Nx Affected in Azure Pipelines When trying to combine the concepts of an Affected Nx projects and building and deploying them in Azure Pipelines, there is no plugin or anything readily available to do so. Since it wasn't trivial to find and compose all the bits and pieces…

How to build a great theme toggle switch Today, "dark mode" is everywhere. Personally I love to use it wherever I can. This guide shows how to build your own accessible switch to toggle dark and light mode on your own website, and offer your visitors their preference. This…

Migrate from getInitialProps to getServerSideProps in Next.js Pages in Next.js can use either getInitialProps or getServerSideProps to fetch data. This article will not repeat their documentation, but instead list relevant differences, and shows example code to migrate from one…

Introducing the terminal to developers The article I wish I had read when I had to open the terminal for the first time. Introduction Being a developer can be quite overwhelming these days. Getting familiar with a codebase and the framework(s) and libraries it uses is not the…

Why and how I'm using SVG sprites over fonts for icons In a recent project, I've been doing some research and testing to find the best solution for icons and small images in a web application. The requirements included support for customization of both the background and the…

Managing your dotfiles Once you've started out enjoying dotfiles, you may wonder about the best way to organize and manage them. Do you want to keep it small and simple? Or do you want to manage as many packages, applications and their settings as possible? Or are you an…

Getting started with dotfiles You're the king of your castle! tl/dr; You can set up a new system using dotfiles and an installation script in minutes. It's not hard to create your own repository, and you'll learn a ton along the road. This is truly more about the journey than…

Getting gulpy Advanced tips for using gulp.js After getting excited about gulp.js, at some point you need more than the shiny but basic examples. This post discusses some common pitfalls when using gulp.js, plugins and streams in a more advanced and custom way. Basic tasks In a…

The $ object demystified Wrap Like An Egyptian Let's take a quick look at querySelector-based libraries such as jQuery and Zepto. You're probably familiar with their syntax: var $items = $('.items'); Once you've queried some elements, there's a lot you can do with those…

Bubbling events in detached DOM trees Here's a quick post on the topic. Sometimes we need events to still work in a detached DOM tree. Even though the end-user can't really interact with detached trees, DOM elements in that tree can still listen to other events and react to…