Code Notes

TILs, snippets—my digital code garden

✅Coding standards
javascripttypescriptreactcss
👌Awesome Web Dev resources
🧪Jest
javascriptreacttesting
🎭Playwright
javascripttesting
📖Storybook
testingstorybook
🧪Testing library
testingreactcypress
⚡Vitest
testing
🪝Newer React hooks
reactjavascripttypescript
Async cheatsheet
javascriptcheatsheet
⚛TanStack Query (React Query)
react
⚛React component patterns
reacttypescript
Array methods summarised
javascript
🔁Bash to Fish (and back)
cli
🔁Looping and iterating in JavaScript
javascriptcheatsheetinterview
🔀Reshaping data in JavaScript
javascriptcheatsheetinterview
Technical Job Interview Questions
interviewquestions
🧪Type check helpers
javascripttypescriptcheatsheet
TypeScript
typescript
TypeScript functions
typescriptinterview
TypeScript type guards and narrowing
typescriptinterview
🧺Object.groupBy
javascripttypescript
🪆Recursion
javascripttypescriptreactinterview
🛑AbortController
javascripttypescriptreact
⏳Debounce
javascripttypescriptreact
🐕Fetch
javascript
🚸IntersectionObserver
javascripttypescriptreact
🔎QMD
cliai
Stimulus cheatsheet
javascript
📝TanStack Form
reacttypescript
🗂TanStack Table
reacttypescript
🚦Throttle
javascripttypescriptreact
🔍Regular expressions
javascripttypescriptcheatsheet
🔒Locking scroll
cssjavascript
Text wrapping & word breaking
css
💯Intl.NumberFormat
javascript
🔢Intl.PluralRules
javascript
⏳Intl.RelativeTimeFormat
javascript
🐕Axios
javascript
Big O Notation
computer-science
Native browser loading state
javascript
Check if value is array in JavaScript
javascript
Check if JavaScript object is empty
javascript
🗜Clamp number
javascriptcss
📦Clickable box
javascriptreact
📝Commit message guidelines
git
🦒Contentful migrations
javascript
⚡C++ for TypeScript developers
cpptypescriptcheatsheet
↔️CSS Media Queries
css
💄CSS Object styles
reactcssjavascript
CSS Protips
css
Express middleware testing
javascriptnodetesting
🐠Fish shell
cli
🍿Fullscreen video
javascripttypescript
🐹Golang for TypeScript developers
golangtypescriptcheatsheet
GraphQL
graphql
GSAP
animationreactjavascript
Hexadecimal colour code for transparency
css
🙅‍♀️Ignoring code
csshtmljavascripttypescript
Pluralisation with inflect()
javascript
📱is-mobile check
javascript
🧪Jest global mocks
javascripttesting
🔑Keycode
javascript
🧪Nock
testingjavascript
oEmbed
javascripthtml
📨Postman.io
javascript
Pure ESM packages
javascript
React compound components
reactjavascript
🎣useReducer
react
❌Removing items from arrays
javascript
Save scroll position
javascript
⚡Supabase.js
javascripttypescript
🔦Switch(true)
javascript
URL & URLSearchParams
javascript
Useful JavaScript functions & snippets
javascript
📤Web Share
javascript
🗣Webmentions
javascripthtml
Yalc
javascript
🔢Basic Maths Notation
mathsreference
Supabase
postgresqldatabase
🧮CSS Functions
css
🎨CSS Native Element Theming
css
🪺Native CSS Nesting
css
🍎SwiftUI for TypeScript developers
swiftswiftuitypescriptcheatsheet
♿aria-label notes
a11yhtml
🐻Zustand
react
Git worktrees with Graphite
devai
Graphite CLI
git
Immer
react
JavaScript dates
javascript
🖼Native image lazy loading
html
NATS & JetStream
messagingbackend
Next.js
react
🏎Web performance tips
performancecss
🐘PHP for TypeScript developers
phptypescriptcheatsheet
🐍Python for TypeScript developers
pythontypescriptcheatsheet
⚛React Error Boundary
react
⚛React TypeScript
reacttypescript
🎣React Context
react
🎣useId
react
Redux / Redux Toolkit
react
🦀Rust for TypeScript developers
rusttypescriptcheatsheet
💅Styled Components
reacttypescript
SvelteKit
sveltesveltekit
🎨Theme UI
react
tmux
cli
📑JSDoc
javascript
❌Get last array item
javascript
❌Remove array duplicates with Set
javascript
📝GitHub markdown
Content flow spacing
csshtml
𝌞Flexible content without wrapper divs
csshtml
💽Postgres
sql
Git
cheatsheetgit
📝README.md / markdown snippets
🤖Disallow AI bots
Nested border radius
css
TypeScript JSON type
typescript
⚛React.forwardRef
reacttypescript
🎣useRef
react
📰@font-face
css
🏋️‍♂️font-weight
css
CSS font-stacks
css
⓫Eleventy
11ty
Nunjucks
11ty
🔤Text selection
javascript
Svelte
svelte
AI prompts
ai
📦npm package versions
devops
Idiot-proof Git Rebasing
cheatsheetgit
CSS logical properties and values
css
vh, svh, lvh, and dvh
css
Hyphens and dashes
typography
👓:focus-visible
css
💦Fluid typography
csstypography
🏎️Fastest Google Fonts
htmlcss
✂️VS Code Snippets
vscodereact
🤷‍♂️JS body class
javascript
Disable dark mode for specific Mac apps
Make a directory if none exists
nodecli
🥣Mix blend mode
css
⚛RenderIfRole
react
⚛useToggle React Hook
react
VIM cheatsheet
cheatsheet
Form autofill attributes
html
⚓️Better link underlines
css
👆CSS cursors
css
🍱CSS Grid
css
⚡Deno
deno
GitHub Actions
devops
Shiki Twoslash
🐳Docker
devops
⚛Conditionally render on the client or server
react
Run npm script from another directory
🧪Jest globals
javascriptreacttesting
Changing the default text editor on macOS
📖Mock React Router location inside Storybook stories
storybookreact
TypeScript catch block errors
typescript
Vercel Serverless functions
⚛Formik
reacttypescript
🗣Quotation marks in different countries
css
⚛React Query with GraphQL
reactgraphql
SQL
Custom inclusive/accessible Theme UI Button
reacttypescripta11y
Firebase
servicesapi
Plop
devops
📟Command line tools
cli
Gatsby
reactgraphql
CSS scroll-behavior
css
Check if JavaScript array is empty
javascript
🔗Make a button element look like a link
css
Aspect ratio
css
Scroll-margin-top
css
Git branching strategies
git
🦉The “Lobotomised Owl” Selector
css
♿Showing/hiding content
htmlcss
⭕️CircleCI
devops
iOS Safari bug
css
⚛SSR
react
HTTP Methods
networking
Get selected text
javascript
Apollo GraphQL
graphql
🔘Better mobile form inputs
html
🎣Client-only React
react
Schema.org structured data
Get file size for all files in directory
cli
🥱Async load CSS
css
Rainbow links
css
💄Styling siblings on hover
css
🙅Big list of naughty strings
🔢Fixed-width numbers
css
Handling Long Words and URLs (Forcing Breaks, Hyphenation, Ellipsis, etc)
css
Opengraph metacrap
html
😋Cutting the mustard
javascript
💵Clear DNS cache
🕺Classes
javascript
📜Create local self-signed certificate
🧼Cleanup / optimise computer
🕶CSS Filters
css
👍Favicons
html
🖼Picture element
html
👮‍♂️Node Security
node
Redux concepts
react
Redux Saga
react
CSS environment variables
css
Destructuring
javascript
🛂Crypto
nodejavascript
ES Module import/export syntax
javascript
ES6 templating
javascript
🎬HTML Video
html

Keyboard shortcuts

Tap these keys to navigate to the appropriate page.