Reference Guides - hn Reader

Short, focused guides on a bunch of things I’ve learned or care about.

My guides, code snippets, and more are free and open to everyone thanks to the generous support of my Go Make Things members.

ADHD & Masking - Don’t hide yourself from others.
ADHD Accommodations - Tailoring your work and life to your ADHD.
ADHD Medication - What ADHD meds do, what they don’t, and how to get them.
ADHD Traits - ADHD has a range of traits that vary from person-to-person.
AI - …is fucking awful.
APIs & Fetch - How to call APIs and remote files with JavaScript.
ARIA - How to provide information that HTML alone does not.
Accessible Components - How to build interactive components that work for everyone.
Accessible Images - How to write good descriptive text for your images.
Accessible Labels - The text that screen readers read aloud for an element or piece of content.
Accessible SVGs - How to ensure your SVGs work for everyone.
Advanced Attribute Selectors - How to select multiple attributes, partial matches, and more.
Advanced CSS Selectors - How to use pseudo-classes target elements by state.
An intro to TTRPGs - The basics of how TTRPGs like D&D work.
Anarchy - Rules, not rulers.
Anti-Work - The rejection of an obsession with work as a harmful colonial, patriarchal, and capitalist construct.
Array Methods - How to test and transform array data.
Array Sort - How to sort and reorder the items in an array.
Array Splice - Delete, replace, and add items to an array at specific indexes.
Array to HTML - How to convert an array of items to HTML elements.
Async & Await - A more modern way to write and handle asychronous JavaScript.
AuDHD - A dual ADHD/Autism diagnosis (and how they interact).
Authentication - How to login in and verify users in your web app.
Automating SSG Deployment - How to automatically build and deploy an updated version of your site whenever you push code to git.
Avoid Lines at Disney - How to spend less time waiting and more time having fun.
Background SVGs - How to display and style SVGs are background images.
Bash Scripts - How to create and run multi-step bash scripts in Terminal.
Biome - My preferred JavaScript, CSS, and HTML linter and formatter.
Buttons State - How to communicate button state to screen readers.
CSS Grid - How to build modern grid-based layouts with CSS.
CSS-Only Components - …are often not accessible.
Class Pattern - Object-oriented programming for JavaScript.
Coffee Chats - A way to network without networking.
Combining CSS Selectors - How to use :is() and :where() to combine selectors.
Cookies (JavaScript) - Store small amounts of data for a fixed amount of time.
Cookies (PHP) - Store small amounts of data for a fixed amount of time.
Copying Arrays - How to create a copy of an array in JavaScript.
Copying Objects - How to create a copy of an object in JavaScript.
Covid-Cautious Disney - How to visit Disney World while keeping yourself safe.
Creating a Course - How to create a course from start-to-finish.
Creating a Podcast - How to create, host, and publish a podcast.
Creating a TTRPG Character - How to create a fun character for your TTRPG games.
Cron Jobs - How to run server scripts at specific times and intervals.
Cross-Site Scripting (XSS) - How to protect yourself from cross-site scripting attacks.
Custom Events - How to emit custom events on DOM elements.
DOM Injection Methods - How to move elements around the DOM.
DOM Traversal Properties - How to climb up and down the DOM.
Dark Mode - How to create light and dark modes with the light-dark() function.
Date-Based Snippets - How to show snippets of text only on certain dates in Hugo.
Dates & Times - How to work with dates and time in JavaScript.
Debouncing - Improve the performance of functions triggered by high-volume user interactions.
Default Function Parameters - Define default values for function parameters.
Destructuring - How to define variables from array or object items.
Details & Summary - An HTML-only browser native disclosure component.
Dialog Modals - An HTML-only browser native modal component.
Digital Gardening - A retro-modern approach to building personal websites.
Dining at Disney - Where and what to eat at Disney World.
Dirt in the Cog - Tangible things you can do to fight systems of oppression.
Disney Hotels - Where should you stay at Disney World?
Disney Parks - The different parks, how to move around them, and what to wear.
Ditching Cable - How to ditch cable for streaming services.
DocBlock - How to document JS, PHP, and more.
Druidry - Nature spirituality.
Dungeon Crawler Carl - A book series about surviving late stage capitalism and reclaiming your humanity.
ES Modules - How to modularlize, import, and export JavaScript files.
ESbuild - My CSS and JavaScript build tool of choice (when I need one).
Early Return Pattern - A more readable alternative to nested if…else statements.
Element Attributes & Properties - How to get and set attributes and properties on HTML elements.
Element Classes - How to get and set classes on DOM elements.
Element Dimensions - Get the size and dimensions of elements in the DOM.
Element Styles - How to get and set styles on DOM elements.
Event Listeners - How to listen for events in the DOM.
Finding Jobs - How to find open roles to apply to.
Flexbox - How to create flexible layouts that adjust to your content with CSS.
Focusable Elements - What focus is, and how to manage it with JavaScript.
Font Loading Performance - How to improve the performance of your web fonts.
FormData - How to get, set, and update form data.
Forms & Fields - How to work with forms in HTML.
Function Hoisting - What hoisting is, and how it affects functions.
Function Parameter Destructuring - A more flexible way to accept many function arguments in JavaScript.
Function Styles - Three different ways to write functions (and how they differ).
Getting Around Disney - How to get to the parks and move between them.
Getting Shit Done - A productivity system for people with ADHD.
Getting an ADHD diagnosis - How to get one, and whether or not you even need one.
Good Comments - How to document JS, PHP, and more.
Grass - Why you should have less of it, how to care for it, and native alternatives.
HTML Roles - How to communicate the intent or purpose of the element.
HTML State - How to provide info about the current status of an element.
HTTP - The protocol that powers the world wide web.
HUG CSS - My approach to modern CSS architecture.
Heat Pumps - The modern way to heat and cool a home.
Hiding HTML Elements - Different ways to hide elements in your HTML.
High-Contrast Mode - How to author your CSS for high-contrast mode.
History - How to get, set, and update the browser URL.
How to run a TTRPG - Trips and tricks for running a TTRPG.
Immutability - Arrays, objects, and assigned-by-reference in JavaScript.
IndexedDB - Database storage built into the browser.
Inline Lists - How to create unstyled and inline lists with Flexbox.
Installing Hugo on Linux - How to install specific versions of Hugo on Ubuntu and ServerPilot without them automatically updating.
IntersectionObserver - Detect when an element enters or leaves the viewport.
Interviews - How to nail the job interview process.
Intl - A suite of APIs for internationalizing content.
Intl.DateTimeFormat - Format Date objects into a variety of string outputs.
Intl.ListFormat - Format a list of items into a language-specific string.
Intl.NumberFormat - Format numbers into a variety of outputs.
Intl.RelativeTimeFormat - Format numbers into relative time.
JSON - How to convert JSON to strings and strings to JSON.
Kipo and the Age of Wonderbeasts - A TV show about hope, healing, and restorative justice.
Labels & Descriptions - How to associate content with labels and descriptions.
Layouts - How to build a variety of common layouts with CSS.
Leaves - How to get rid of them, and why you shouldn’t until the spring.
Linting Code - How to identify typos, syntax errors, and anti-patterns in your code.
Local Servers - How to run a small server locally on your computer for development.
Looping - How to loop over collections in JavaScript.
Math Methods - How to round numbers and do math with JavaScript.
Merge Arrays - How to merge two or more arrays in JavaScript.
Merge Objects - How to merge two or more objects in JavaScript.
Migrating from WordPress - How to migrate your WordPress website to a static site generator.
Monk & Robot - A book series about burnout, community, meaning, and finding your place in the world.
MutationObserver - Detect changes to an element or its decendents.
Mutual Aid - Neighbors helping neighbors.
Native Yards - How to create a beautiful, low-maintenance yard that attracts lots of pollinators and other wildlife.
Nullish Coalescing Operator - How to assign a fallback values for variables.
Number Methods - How to format, convert, and modify numbers.
OCD - Obsessive-compulsive disorder is more than just repetitive touch.
Object Methods - How to get and delete keys, values, or both from plain objects.
Object Shorthands - A simpler way to define properties and functions in an object.
Obsidian - A cross-platform digital notebook powered by markdown files.
Optional Chaining - How to chain object and array properties only if they’re not undefined or null.
PHP Islands - How to generate dynamic real-time content on the server using mostly pre-rendered PHP files.
Pantheism - A godless reverance for the cosmos.
Planning a Disney Trip - Tips and tricks to make your first Disney trip a great one!
Playwright - My preferred JavaScript testing library.
Prefers Reduce Motion - How to detect and respond to user animation preferences.
Promises - How to work with asynchronous code in JavaScript.
Proxies - How to detect interactions with an array or object.
RSS Syndication - An easy way to publish your content in lots of places.
ResizeObserver - Detect when an element’s size changes.
Rest Parameters - Create an array containing multiple function arguments.
Resumes - How to write a kick-ass resume.
Rewilding - How to transform your lawn back into a nature paradise.
SVGs & Event Listeners - How to detect clicks on elements that have SVGs and other nested elements inside them.
Salary - How to get paid well for your work.
Scheduling Posts - How to schedule a post to go live in the future with Hugo static site generator.
Scope - The context in which JavaScript functions and variables can be accessed.
Screen Readers & Keyboards - How to navigate the web without a mouse or screen.
Self-Hosting Fonts - How to self-host your own Google web fonts.
Service Workers - How to build faster and more resilient websites.
Shuffling Arrays - How to shuffle an array with JavaScript.
Signal Messenger - An encrypted non-profit messaging service.
Solarpunk - The optimistic counterpart to dystopian cyberpunk.
Spread Syntax - How to expand array or object properties into their own values.
Static Site Generators - How to build fast, resilient websites with markdown files and pre-rendered HTML.
Status Messages & Toasts - Accessible notifications about state changes.
String Methods - How to test and modify strings.
Synthetic Events - How to simulate native events on DOM elements.
TDD - How and why to implement test-driven development.
TTRPG Systems - The different types of rules and mechanics games use.
Taoism - The Chinese philosophy of The Way.
Template Literals - How to add variables to strings and create multi-line strings.
Terminal Cheat Sheet - How to do basic stuff in the command line.
Ternary Operator - A shorthand if...else clause for defining variables.
Testing JavaScript - How and why to write automated tests for your JavaScript.
The Surveillance Economy - You’re constantly being monitored online (and off).
Timestamp Math - How to calculate and modify timestamp values.
Tree Watering Device - How to build a simple tool that automatically waters your Christmas tree.
Truthy & Falsy - Values that evaluate as true or false.
Typescript - How to use Typescript with JS instead of actually using Typescript.
URL - How to get, set, and manipulate URL strings.
URLSearchParams - How to create query string parameters.
VPN (Virtual Private Network) - Obscure your web traffic from ISPs and governments.
Variables (JavaScript) - How to define variables in JavaScript with const and let.
Visually Hidden - Hide content in the UI but keep it accessible to screen readers.
Web Components - How to create custom HTML elements with built-in attributes and interactivity.
Web-Safe Fonts - How to put together fast, beautiful system font stacks.
What is ADHD? - Attention Deficit Hyperactivity Disorder doesn’t describe what ADHD really is.
Work with your brain - Thriving with ADHD means working with your brain instead of fighting it.
localStorage & sessionStorage - Store data locally in the browser.