information overload

by sebastian de deyne

Leading slashes in .gitignore

21 Nov 2022

This is a friendly reminder to keep leading slashes in mind in .gitignore files.

The other day, I pulled down a project and couldn’t get the CSS to build because files were missing. It turned out another developer created a new resources/css/vendor directory to override styles for third-party components. A fine name, but vendor was ignored so they were quietly missing from the repository. We updated .gitignore to use /vendor instead and all was well.

# Ignores all vendor files
vendor

# Only ignores vendor at the project root
/vendor

Information Overload newsletter

I occasionally send out a dispatch with personal stories, things I'm working on, and interesting links I come across.

Only for occasional updates. No tracking.

Good Ideas

9 Nov 2022 via blog.nateliason.com

Nat Eliason on ideas and fermented jalapeños:

Good ideas require boredom. If you constantly ingest new information, the existing information can never be digested.

Coming up with ideas is a passive undertaking, not an active one. You can’t summon good ideas like a genie. They sneak up on you when your mind has enough space to wander.

Local or session storage?

28 Oct 2022

Local storage tends to be the obvious place to persist data locally in a web application. We tend to grab straight for localStorage, but it’s not the only tool in our workbox. Another option is sessionStorage. Let’s review their similarities and differences, and determine when to use which.

Read more

CSS states with attribute selectors

27 Oct 2022 via elisehe.in

Elise Hein compiled a few arguments in favor of using CSS attribute selectors more often. Two examples stood our for me.

Consider existing attributes. Whenever we add state we should take a step back and consider if we can leverage a standard. I often add an .is-active class to links in navbars. However, there’s an ARIA attribute for that. In addition to using a standard, our site becomes more accessible.

a[aria-current="page"] { }

Make invalid states impossible with data attributes. In HTML, we could accidentally end up with a card that .is-small.is-large. Using a data attribute enforces a single value for the attribute.

.card.is-small { }
.card.is-large { }

// vs

.card[data-size="small"] { }
.card[data-size="large"] { }

Read the full post on Elise Hein’s blog.

2022 redesign

24 Oct 2022

This blog’s design has remained roughly the same the past two years. I tweaked the style a lot, but changes were incremental and stay true to the neutral black and white style. Codebases rot over time, and small changes slowly but surely introduce technical debt. I started cleaning house, and before I knew it I was embarked in a full redesign.

Read more

Granular interfaces

5 Sep 2022

A few weeks ago a spec change for an application we’re working on forced us to refactor part of the codebase. It was food for thought about the flexibility granular interfaces provide, and choosing the right abstraction at the right time. This is a short writeup on the thought process we went through as we updated our logic to support a new feature now and allow more options in the future.

Read more

Non-reactive data in Alpine.js

1 Jun 2022

Sometimes you want to store data in your Alpine component without wrapping it in a JavaScript proxy (which is how Alpine keeps everything reactive).

For example, third party libraries might have issues when wrapped in a proxy. Chart.js is one of those. If you store a Chart.js instance in Alpine data, the chart will error.

Read more