Notes

A collection of links, thoughts, ideas, images, quotes, and other miscellanea I've collected in my travels across the web and through life.
Code
Here's a cool little web app that will take some JavaScript and turn it into a bookmarklet that you can drag into your…
Code
Accordions Use the <details> element Checkboxes Instead of trying to get the styling right for IE 11, just add custom…
cssweb devhow to
Code
The idea of CSS resets is fascinating to me. There's something about bringing order to a chaotic system that is really…
cssweb dev
Misc
Live shows that I've had the pleasure to see, in chronological order. 2007 The Fray & Mutemath @ Humphrey Coliseum…
Design systems
Trying to answer the question “what is a design system?”
Design systems
Often times, the source of truth in a system lies with the engineers, not the designers. Making sure devs can maintain the system is essential.
Code
Conditional properties Default values If you wanna have values with variants in an object you usually do this, which is…
jsweb dev
Code
Kinda like code-golfing meets Occam's razor — what's the simplest and most naive solution to a given problem?
how to
Code
Environment variables Forms and functions Max Böck uses a Netlify function to post to a static site by creating a new…
Design systems
While most conversations around design systems center on the artifacts and technical problems, I believe that the real success of a system comes down to solving people problems.
Misc
The best way to make interesting work is to become a more interesting person. In this case, interesting means the…
Design systems
The field of design systems has been shaped so heavily by the fact that so many systems are out in the open for all to see. Here are some that have stood out to me over the years.
Code
useReducer You can use useReducer to simulate the old this.setState({}) API of class components. This ideas was…
reactjs
Code
Detecting outside clicks Stolen from this Medium article by Pitipat Srichairat .
reactjsweb dev
Code
I’ve always been terrible at regex (shouldn't have goofed off so much in Formal Languages). Here are some common snippets that come in handy.
Code
I spent a little bit of time diving into Svelte and walking through the official tutorial. Here are some things that stood out to me.
web devjs
Code
Get the clipboard contents as HTML Convert HTML to Markdown with pandoc Get a list of git commits from every repo over…
Code
Details can be used to build accessible dialogs and dropdown menus. In this example I am using the custom elements that…
htmlweb dev
Misc
What are they? Why are they? What makes them so special? That's what I am trying to answer here.