-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathuses.html
85 lines (79 loc) · 30.2 KB
/
uses.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<!doctype html>
<html lang="en" class="min-h-full">
<head>
<meta charset="utf-8" />
<link rel="icon" href="./favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="./_app/immutable/assets/0.BIJMqV3L.css" rel="stylesheet">
<link href="./_app/immutable/assets/NoteGridStatusFilter.eq4K4R-6.css" rel="stylesheet">
<link href="./_app/immutable/assets/MDSveXNoteLayout.fO7cJVK6.css" rel="stylesheet">
<link href="./_app/immutable/assets/3.DYYv-RaX.css" rel="stylesheet">
<link rel="modulepreload" href="./_app/immutable/entry/start.BYTGewrw.js">
<link rel="modulepreload" href="./_app/immutable/chunks/entry.DT5pBbIT.js">
<link rel="modulepreload" href="./_app/immutable/chunks/scheduler.ewBkyc9q.js">
<link rel="modulepreload" href="./_app/immutable/entry/app.8UFY0431.js">
<link rel="modulepreload" href="./_app/immutable/chunks/preload-helper.C1FmrZbK.js">
<link rel="modulepreload" href="./_app/immutable/chunks/index.DpmaPz1F.js">
<link rel="modulepreload" href="./_app/immutable/nodes/0.ptpxay9R.js">
<link rel="modulepreload" href="./_app/immutable/chunks/each.DRjyAD6E.js">
<link rel="modulepreload" href="./_app/immutable/chunks/NoteGridStatusFilter.svelte_svelte_type_style_lang.ujj1qoQH.js">
<link rel="modulepreload" href="./_app/immutable/nodes/3.V4gQuH1T.js">
<link rel="modulepreload" href="./_app/immutable/chunks/stores.D5VPkREF.js">
<link rel="modulepreload" href="./_app/immutable/chunks/NoteGrid.CfLqeLLg.js"><title>Uses - Allan Deutsch</title><!-- HEAD_svelte-x3qw35_START --><meta name="description" content="The tools, technologies, hardware, and software that I use to do my thing."><meta property="og:title" content="Uses"><meta property="og:type" content="article"><meta property="og:url" content="https://allandeutsch.com/uses"><meta property="og:description" content="The tools, technologies, hardware, and software that I use to do my thing."><meta property="og:locale" content="en_US"><meta property="twitter:card" content="summary"><meta property="twitter:url" content="https://allandeutsch.com"><meta property="twitter:title" content="Uses"><meta property="twitter:description" content="The tools, technologies, hardware, and software that I use to do my thing."><meta property="twitter:site" content="@AllanDeutsch"><meta property="twitter:creator" content="@AllanDeutsch"><link rel="canonical" href="https://allandeutsch.com/uses"><script type="module" src="https://docduck.dev/selection.js" data-svelte-h="svelte-1qfon0b"></script><script data-name="BMC-Widget" data-cfasync="false" src="https://cdnjs.buymeacoffee.com/1.0.0/widget.prod.min.js" data-id="AllanDeutsch" data-description="Support me on Buy me a coffee!" data-message="" data-color="#5F7FFF" data-position="Right" data-x_margin="18" data-y_margin="18" data-svelte-h="svelte-bv2cpr"></script><!-- HEAD_svelte-x3qw35_END --><!-- HEAD_svelte-cpyj77_START --> <meta name="theme-color" content="dark"><!-- HTML_TAG_START --><script nonce="%sveltekit.nonce%">(function setInitialMode(defaultMode, themeColors2) {
const rootEl = document.documentElement;
const mode = localStorage.getItem("mode-watcher-mode") || defaultMode;
const light = mode === "light" || mode === "system" && window.matchMedia("(prefers-color-scheme: light)").matches;
rootEl.classList[light ? "remove" : "add"]("dark");
rootEl.style.colorScheme = light ? "light" : "dark";
if (themeColors2) {
const themeMetaEl = document.querySelector('meta[name="theme-color"]');
if (themeMetaEl) {
themeMetaEl.setAttribute("content", mode === "light" ? themeColors2.light : themeColors2.dark);
}
}
localStorage.setItem("mode-watcher-mode", mode);
})("system", {"dark":"dark","light":"light"});</script><!-- HTML_TAG_END --><!-- HEAD_svelte-cpyj77_END -->
<!-- Global site tag (gtag.js) - Google Analytics -->
<script
async
src="https://www.googletagmanager.com/gtag/js?id=UA-86124920-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'UA-86124920-1');
</script>
</head>
<body
data-sveltekit-preload-data="hover"
data-sveltekit-preload-data="viewport"
class="h-full min-h-[100vh] bg-base-100">
<div style="display: contents"> <div class="h-full min-h-[100dvh]"><div class="toaster svelte-jyff3d" role="alert"> </div> <div class="navbar bg-base-100 print:hidden"><div class="navbar-start"><div class="dropdown"><button tabindex="0" class="btn btn-ghost sm:hidden" data-svelte-h="svelte-o7egld"><svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h8m-8 6h16"></path></svg></button> <ul tabindex="0" class="dropdown-content menu rounded-box menu-sm mt-3 w-52 bg-base-100 p-2 shadow"><li><a href="/">Home</a></li><li><a href="/notes">Notes</a></li><li><a href="/devlog">Devlog</a></li></ul></div> <a class="btn btn-ghost text-xl normal-case" href="/">Allan Deutsch</a></div> <div class="navbar-center hidden sm:flex"><ul class="menu menu-horizontal px-1 text-base"><li><a href="/">Home</a></li><li><a href="/notes">Notes</a></li><li><a href="/devlog">Devlog</a></li></ul></div> <div class="navbar-end"> <div class="h-8" data-svelte-h="svelte-1hosge2"><a href="https://twitter.com/AllanDeutsch" class="group"><svg height="24" width="24" class="mr-1.5 inline fill-base-content transition-colors duration-300 group-hover:fill-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 612 612"><path d="M612 116.258a250.714 250.714 0 01-72.088 19.772c25.929-15.527 45.777-40.155 55.184-69.411-24.322 14.379-51.169 24.82-79.775 30.48-22.907-24.437-55.49-39.658-91.63-39.658-69.334 0-125.551 56.217-125.551 125.513 0 9.828 1.109 19.427 3.251 28.606-104.326-5.24-196.835-55.223-258.75-131.174-10.823 18.51-16.98 40.078-16.98 63.101 0 43.559 22.181 81.993 55.835 104.479a125.556 125.556 0 01-56.867-15.756v1.568c0 60.806 43.291 111.554 100.693 123.104-10.517 2.83-21.607 4.398-33.08 4.398-8.107 0-15.947-.803-23.634-2.333 15.985 49.907 62.336 86.199 117.253 87.194-42.947 33.654-97.099 53.655-155.916 53.655-10.134 0-20.116-.612-29.944-1.721 55.567 35.681 121.536 56.485 192.438 56.485 230.948 0 357.188-191.291 357.188-357.188l-.421-16.253c24.666-17.593 46.005-39.697 62.794-64.861z"></path></svg></a> <a href="https://github.com/masstronaut" class="group"><svg height="24" aria-hidden="true" viewBox="0 0 16 16" version="1.1" width="24" data-view-component="true" class="mr-1.5 inline fill-base-content transition-colors duration-300 group-hover:fill-primary"><path fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"></path></svg></a></div> </div></div> <div class="h-full p-1 sm:p-4"> <docduck-feedback team="TKxfdiO22xOXIrW0c0Pfi"></docduck-feedback> <div class="grid w-full grid-cols-[1fr_min(65ch,100%)_1fr]"><h1 class="col-start-2 col-end-3 text-left text-4xl font-bold" style="view-transition-name: title">Uses</h1></div> <article class="note-container prose mb-8 max-w-full px-2 svelte-hudpsb" style="view-transition-name: article;"><header class="w-full max-w-3xl self-center"><div class="text-md mb-12 mt-4 flex justify-between border-t border-t-neutral border-opacity-20 pt-1 text-base-content"><div><span class="pr-2" data-svelte-h="svelte-114jejz">🌱</span><span class="hidden sm:inline" data-svelte-h="svelte-1psjisz">Planted
</span>January 4, 2025.
<br>Last tended January 16, 2025.</div> <div class="flex flex-col items-end"><div class="note__status seedling svelte-hudpsb">seedling 🌱</div> <div>19 minutes read ⏱</div></div></div></header> <p data-svelte-h="svelte-11rcol8">As someone who is interested by design and technology, I often find it fascinating to learn what other people use to do their thing. Typically I’ve learned about it through visiting their home or office, a youtube video, or a random social media post.</p> <p data-svelte-h="svelte-30lcdp">Recently, I found out via <a href="https://wesbos.com/uses" rel="nofollow">Wes Bos</a> that there’s another way - having a <a href="/uses">uses</a> page! Inspired by that and many others on <a href="https://uses.tech" rel="nofollow">uses.tech</a>, I decided to write my own!</p> <h2 id="computing-environment" data-svelte-h="svelte-12ya5l"><a aria-hidden="true" tabindex="-1" href="#computing-environment"><span class="icon icon-link"></span></a><a href="#computing-environment" aria-hidden="true" tabindex="-1"><span class="icon icon-link"></span></a>Computing environment</h2> <p data-svelte-h="svelte-1v3b1mf">My ideal computing environment works great out of the box with sensible defaults, and provides powerful ways for me to customize it to suit me. In a past life, I really enjoyed Arch linux on a desktop. Unfortunately, the realities of game development (requires Windows) and more recently my preference for a laptop have led me down other paths.</p> <p data-svelte-h="svelte-98lia4">Currently I find Mac works pretty well out of the box and has the best hardware for my needs (good performance, exceptional battery life, clean aesthetic). It’s been a bit of a journey to get the customizations dialed in, but I’m very happy with how things are now.</p> <ul data-svelte-h="svelte-1j1ivt1"><li>My computer is an M1 MacBook Pro. The OG Apple silicon laptop, it’s been working great since day 1. I used to also run a more powerful desktop, but I’m not doing game development these days and the laptop is plenty for web. The battery life is amazing!</li> <li><a href="https://github.com/nikitabobko/AeroSpace" rel="nofollow">Aerospace Window Manager</a> makes it easy for me to manage my windows. It reimplements window management from scratch on Mac to have better hotkey support and instant window switching. I much prefer this setup to the native MacOS solution</li> <li><a href="https://github.com/FelixKratz/SketchyBar" rel="nofollow">Sketchybar</a> is how I know which windows are in which spaces. I wrote a custom config that show my Aerospace workspaces and the windows in each. If you’re interested, it’s in my <a href="https://github.com/Masstronaut/dotfiles/tree/main/sketchybar" rel="nofollow">dotfiles repo</a>. Let me know if you have any questions!</li></ul> <picture data-svelte-h="svelte-1v7qymi"><source media="(prefers-color-scheme: dark)" srcset="https://img.allandeutsch.com/allandeutschcom-note-images/9353046d58688f8c597ebfe37c82010a.png"> <source media="(prefers-color-scheme: light )" srcset="https://img.allandeutsch.com/allandeutschcom-note-images/28667c4ea728c28a073e02d87b78197e.png"> <img alt=""></picture> <ul data-svelte-h="svelte-zrky6o"><li>I use <a href="https://wezfurlong.org/wezterm/" rel="nofollow">WezTerm</a> as my terminal emulator. I’m curious about <a href="https://ghostty.org/" rel="nofollow">Ghostty</a>, but it’s tabs don’t play well with Aerospace and that’s a non-starter for me. I particularly like that WezTerm is configured using lua, as I primarily use it for neovim which is also configured using lua.</li> <li><a href="https://neovim.io/" rel="nofollow">NeoVim</a> is my editor of choice. I love how configurable it is and that it’s done using Lua instead of JSON. I’ve found vim-style bindings make text editing a lot more fun! You can read more about my thoughts about it in my blog post <a href="/notes/use-neovim">I use Neovim btw</a>. My full config is in my <a href="https://github.com/Masstronaut/dotfiles/tree/main/nvim" rel="nofollow">dotfiles repo</a></li> <li>I’ve got some fancy keyboards, but I have come to love the simplicity of just using the one attached to my laptop. I have made some minor tweaks to it using <a href="https://karabiner-elements.pqrs.org/" rel="nofollow">Karabiner Elements</a>. Mostly just changes to shift and caps lock to make them more useful for me. Full details in my <a href="https://github.com/Masstronaut/dotfiles/blob/main/karabiner/karabiner.json" rel="nofollow">dotfiles</a>, though I wouldn’t necessarily recommend using these without some serious consideration.</li> <li><a href="https://obsidian.md" rel="nofollow">Obsidian</a> is where I do all of my writing. It works on a folder full of markdown files which I sync across my devices using Git. I also built a CICD workflow for my notes repo that publishes this site, so whenever I change a public note it goes live immediately and automatically. This setup brings me a lot of joy.</li> <li><a href="https://arc.net/" rel="nofollow">Arc</a> is my portal to the internet. I mostly use it as a chrome wrapper, but I like it more.</li> <li><a href="https://www.raycast.com/" rel="nofollow">Raycast</a> is what I use to launch applications, open files, and solve basic queries like math and unit conversions. It’s fast and works well reliably. Great replacement to the default spotlight search.</li> <li>Across many of the tools I keep open all day, I use the <a href="https://rosepinetheme.com/" rel="nofollow">Rosé pine theme</a>. I find it easy on my eyes, and use both the “Main” (dark) and “Dawn” (light) variants, switched automatically at sunrise and sunset.</li></ul> <h2 id="audio-and-video-equipment" data-svelte-h="svelte-1uev79f"><a aria-hidden="true" tabindex="-1" href="#audio-and-video-equipment"><span class="icon icon-link"></span></a><a href="#audio-and-video-equipment" aria-hidden="true" tabindex="-1"><span class="icon icon-link"></span></a>Audio and video equipment</h2> <p data-svelte-h="svelte-111l5rt">I’ve worked remote since before the CoViD-19 pandemic, and expect I’ll continue working remote for a substantial portion of my career. One thing that frustrates me about remote work is that communication is lower bandwidth than in person. The audio isn’t as clear, it’s not possible to see someone’s whole body (and importantly their body language!), and eyes and faces on camera are often blurry, low resolution, or full of compression artifacts.</p> <p data-svelte-h="svelte-1angiq4">The tech industry has many neurodivergent people who struggle with picking up social cues, auditory processing, and plenty of other communication skills. Remote workers with poor quality audio/video setups at home make it even harder by providing worse input data.</p> <p data-svelte-h="svelte-bx5p3j">My home setup is my acknowledgement of these challenges and it reflects my efforts to communicate clearly and effectively with everyone.</p> <ul data-svelte-h="svelte-1i8vo9v"><li><a href="https://www.amazon.com/dp/B09JZT6YK5" rel="nofollow">Sony A7IV camera</a> is my go-to for both my photography hobby and video calls. I typically do videos with a lens at ~50mm focal length.</li> <li>My desk is set up in front of a window, but I have an <a href="https://www.elgato.com/us/en/p/key-light" rel="nofollow">Elgato key light</a> for evening calls and cloudy days.</li> <li>The <a href="https://www.logitechg.com/en-us/products/streaming-gear/yeti-premium-usb-microphone.988-000100.html" rel="nofollow">Yeti mic</a> has been helping my coworkers hear me reliably for years with zero quality complaints (the substance of that audio is another story)</li> <li> A <a href="https://www.logitechg.com/en-us/products/streaming-gear/compass-boom-microphone-arm.html" rel="nofollow">Compass mic arm</a> keeps my mic in position to pick up my voice clearly. I think it looks great and works very well, but I’m casually interested in swapping it for something that holds the mic below me rather than above me.</li></ul> <h2 id="desk-setup" data-svelte-h="svelte-1lpimox"><a aria-hidden="true" tabindex="-1" href="#desk-setup"><span class="icon icon-link"></span></a><a href="#desk-setup" aria-hidden="true" tabindex="-1"><span class="icon icon-link"></span></a>Desk setup</h2> <p data-svelte-h="svelte-1qhq1s8">My desk setup makes up much of the periphery of what I see when working. It needs to be functional, but I also want it to be beautiful in an understated and non-distracting way.</p> <p data-svelte-h="svelte-fjslfg">Most importantly, my desk setup must facilitate me doing great work. As I write this from my couch at the start of 2025, this is a topic I’ve found myself reflecting on often in recent months. Lately I’ve been concluding that my desk setup is failing at its prime directive and needs to be changed.</p> <p data-svelte-h="svelte-4nx60h">This is a topic I find myself revisiting every year or two. In <em>my value system</em> it’s important to me that I do great work. <em>Doing great work is fulfilling</em> and <em>fulfillment is a requirement of deep contentment</em>. I also find that <em>my ideal working environment</em>, or at least my understanding of it, changes over time.</p> <p data-svelte-h="svelte-1cb20o8">Here’s the elements of my desk setup as they stand currently. I’ve included my thoughts on what is and isn’t working well.</p> <ul data-svelte-h="svelte-1cjkotz"><li>A <a href="https://www.twelvesouth.com/products/bookarc-for-macbook" rel="nofollow">Twelve South BookArc</a> is how I dock my laptop without cluttering up my desk surface. Recently I’ve not been using it, though.</li> <li>My laptop is a 13” MacBook pro. For a few months I’ve been working with my laptop open and using the built-in keyboard instead of a mechanical board. Being able to make use of it as second, smaller screen below the primary one has been great.</li> <li>The massive <a href="https://www.dell.com/en-us/shop/dell-ultrasharp-49-curved-usb-c-hub-monitor-u4924dw/apd/210-bgtz/monitors-monitor-accessories" rel="nofollow">Dell 49 inch ultrawide monitor</a> has been adorning my desk for several years, held by a desk-mounted <a href="https://www.ergotron.com/en-us/products/product-details/45-475#/?color=white" rel="nofollow">Ergotron HX arm</a>. In theory the screen is equivalent to two ~27” monitors with no bezel in between. In practice, window management is much worse than on two separate screens. It’s also so wide that the far edges of it aren’t very ergonomic to use. I’ve come to the conclusion it’s too big. I love the built-in USB hub, and it’s ability to function as a KVM was useful in the past when I used multiple computers.</li> <li>The desk itself is a 48” walnut butcher block that I cut and finished by hand and attached to some sit/stand legs from Humanscale. I often find it gets more cluttered than I like with papers, small items, and a variety of accessories. I’d like to take a pass at reducing how many items live on it. In the back I use their <a href="https://www.humanscale.com/products/cable-management-tools/neattech-system" rel="nofollow">NeatTech cable organizer</a>, which hides the mess but in my case “neat” is a stretch…</li> <li>My monitor can’t quite handle all the devices I plug in at my desk, so for the rest of them I have a <a href="https://www.kensington.com/internal-support-pages/SD5300T/" rel="nofollow">Kensington thunderbolt 3 dock</a>. I’d like to prune down the list of always attached accessories to remove the need for this.</li> <li>A <a href="https://www.logitech.com/en-us/products/mice/mx-master-3s-mac-bluetooth-mouse.910-006570.html" rel="nofollow">Logitech MX Master 3 mouse</a> and <a href="https://www.duckychannel.com.tw/en/One-2-RGB-TKL-White%60" rel="nofollow">Ducky One 2 RGB TKL white keyboard</a> have been sitting unused on my desk for a few months. I find myself only using the built-in keyboard and trackpad lately. This is the most seamless setup for moving between working at my desk and <em>anywhere else</em>, as all I have to do is plugin my laptop and everything is exactly the same. I have been working from <a href="/notes/seattle-cafes">cafes</a> a ton the past few years, and I suspect the two are related.</li> <li>Previously I had a <a href="https://store.hermanmiller.com/office-chairs-ergonomic-chairs/embody-chair/4737.html" rel="nofollow">Herman Miller Embody chair</a>, but despite trying to convince myself otherwise for several years, I really didn’t find it that comfortable. I sold it in 2024, and haven’t replaced it with another office chair since.</li> <li>A <a href="https://www.walkingpad.com/products/walkingpad-r1-pro-2in1-foldable-treadmill" rel="nofollow">Walkingpad R1 Pro treadmill</a> has been the sole intermediary between me and the floor at my desk for the better part of a year. I find walking much more comfortable than standing and appreciate the health and thinking (blood flow) benefits that come with it vs standing and sitting. I chose this model because I wanted the option to also run at home, but when I run the belt slips and when I don’t run I’m aware of the crease where it folds. When I’m not at my desk it’s bigger and uglier than its contemporaries. Rather than being more convenient for walking and running, I find it a bit uncomfortable for both. I also have a mat under it, so it’s not very convenient to fold it away. I should really sell this thing and replace it with the smaller <a href="https://egofitwalker.com/products/m1-under-desk-treadmill?variant=41959712850059" rel="nofollow">Egofit Walker</a> instead of turning this page into a rant about it.</li> <li>I have a <a href="https://www.amazon.com/gp/product/B09L1M2WTK" rel="nofollow">Kensington iPad dock</a> with chargers for my AirPods and iPhone. I would rather my phone live further from my desk, but I need it for 2FA codes. The dock isn’t compatible with cases, and my iPad lives in a case. Overall I don’t think this thing is working well for me. There’s not really room on my desk for an iPad with the 49” ultrawide anyway, so I think it’s time to get rid of this thing.</li></ul> <h2 id="web-technologies" data-svelte-h="svelte-1pcg8hb"><a aria-hidden="true" tabindex="-1" href="#web-technologies"><span class="icon icon-link"></span></a><a href="#web-technologies" aria-hidden="true" tabindex="-1"><span class="icon icon-link"></span></a>Web technologies</h2> <p data-svelte-h="svelte-cetvn8">The bulk of my work recently is building things on the internet, particularly front-end web development ie code that runs on the client device. I’ll also include tools that I use in my development process here.</p> <ul data-svelte-h="svelte-4vbuea"><li>HTML & CSS are a necessity. These days most of my CSS is written as inline Tailwindcss classes, and I’ll use vanilla CSS for anything that feels complicated or overly verbose to do in tailwind.</li> <li>TypeScript is my preference for interactivity & logic. My background is in C and C++, so working in vanilla JS without type information is really difficult for me. I much prefer TypeScript to JSDoc type annotation comments.</li> <li>Svelte is my go-to for reusable components. I love how close to vanilla HTML, CSS, and JS svelte is. I’m starting to migrate projects from svelte 4 to svelte 5 and first impressions have been great.</li> <li>Sveltekit is a natural pairing for a svelte frontend that needs a lightweight backend. It’s got pretty good end-to-end type safety and I feel it has sensible defaults. My only real complaint is that I find it a little annoying to manage component logic that should be run exclusively on the client vs client and server.</li> <li>Vite has been great. Easy to write plugins, works well, works quickly, and development seems to closely mirror production. It’s a dev server I don’t have to think about much, and that’s wonderful.</li> <li>Vitest has been a great test runner. I love that it shares my vite config as maintaining multiple versions of environment config is horrible. I use it to run all my tests.</li> <li>Storybook is a tool I’m really excited about, but that prior to svelte 5 felt like it wasn’t quite there yet <em>for svelte components</em>. The new svelte 5 API has been awesome to work with on the first project I’m migrating from svelte 4 to 5 and I’m excited to integrate storybook more into my development workflow.</li> <li>I use Git/GitHub for version control. I recently watched a talk about <a href="https://www.janestreet.com/tech-talks/janestreet-code-review/" rel="nofollow">how Jane Street does code reviews</a> and I’m interested in exploring what else might be out there for the code review experience. Their concept of a “brain” (a diff of what diffs have been reviewed) seems really interesting.</li> <li>Static deployments on GitHub Pages and server-backed deployments on Vercel has been working well for me. They just work, and that’s fantastic. I am looking to try out <a href="https://coolify.io/" rel="nofollow">coolify</a> on a dedicated server though. I think serverless has some great properties for scaling, but also some major downsides and complexity. I want to explore affordable long-running servers to back low scale projects as it seems the DX may have caught up.</li> <li>Static analysis tools are magic because they reduce the cognitive burden of writing great code. Often the rules have been written by thoughtful engineers with a deep understanding of the technologies they are linting, and can be a great way to catch bugs before they happen. I use ESLint and typescript-eslint and am thrilled to have them.</li> <li>Similarly, formatting/code style is not something I want to think about. Prettier does a great job handling it for me so I can use my brain for more interesting problems.</li></ul> <div class="divider"></div> <aside class="prose" data-svelte-h="svelte-1w3uusp"> <p>If you're feeling extra generous, you can show your support by buying me a
coffee with the button in the bottom right corner of the page.</p> <div class="divider"></div></aside></article> <p data-svelte-h="svelte-1bbfa0c">Loading comments...</p> <div class="flex w-full flex-col items-center"><h2 class="my-6 self-center text-5xl text-base-content">Linked notes</h2> <div class="col-auto grid w-full grid-cols-[repeat(auto-fill,_minmax(300px,_1fr))] justify-items-center gap-3"><a href="/uses" class="m-4 flex w-full min-w-[300px] max-w-[450px] flex-1 basis-80 text-inherit no-underline" style="--statusColor: 85, 40%, 55%;"><article class="group flex h-64 w-full flex-col justify-between border border-solid border-base-300 bg-base-100 px-10 py-8 text-base-content text-opacity-80 transition-all duration-200 hover:border-[hsl(var(--statusColor))] hover:text-opacity-100 hover:shadow-xl hover:shadow-[hsla(var(--statusColor),.25)] active:-translate-y-1 active:scale-[1.01] active:shadow-md svelte-1f9x9br"><section class="notecontent"><header class="svelte-1f9x9br"><h1 class="line-clamp-2 h-16 text-lg svelte-1f9x9br">Uses</h1></header> <p class="mt-3 line-clamp-3 h-[4.5em] leading-[1.5em] transition-all duration-200">The tools, technologies, hardware, and software that I use to do my thing.</p></section> <section class="notemetadata border-t border-t-neutral-content border-opacity-60 pt-1 text-right text-sm svelte-1f9x9br"><div class="date min-w-[12ch] text-opacity-50 svelte-1f9x9br">Jan 16, 2025</div> <div class="min-w-[12ch] capitalize text-[hsl(var(--statusColor))] svelte-1f9x9br">seedling 🌱</div></section></article> </a><a href="/notes/use-neovim" class="m-4 flex w-full min-w-[300px] max-w-[450px] flex-1 basis-80 text-inherit no-underline" style="--statusColor: 85, 40%, 55%;"><article class="group flex h-64 w-full flex-col justify-between border border-solid border-base-300 bg-base-100 px-10 py-8 text-base-content text-opacity-80 transition-all duration-200 hover:border-[hsl(var(--statusColor))] hover:text-opacity-100 hover:shadow-xl hover:shadow-[hsla(var(--statusColor),.25)] active:-translate-y-1 active:scale-[1.01] active:shadow-md svelte-1f9x9br"><section class="notecontent"><header class="svelte-1f9x9br"><h1 class="line-clamp-2 h-16 text-lg svelte-1f9x9br">I use Neovim btw</h1></header> <p class="mt-3 line-clamp-3 h-[4.5em] leading-[1.5em] transition-all duration-200">Imagine a world where something as simple as editing text becomes a fun and challenging puzzle to be solved.</p></section> <section class="notemetadata border-t border-t-neutral-content border-opacity-60 pt-1 text-right text-sm svelte-1f9x9br"><div class="date min-w-[12ch] text-opacity-50 svelte-1f9x9br">Jul 30, 2024</div> <div class="min-w-[12ch] capitalize text-[hsl(var(--statusColor))] svelte-1f9x9br">seedling 🌱</div></section></article> </a><a href="/notes/seattle-cafes" class="m-4 flex w-full min-w-[300px] max-w-[450px] flex-1 basis-80 text-inherit no-underline" style="--statusColor: 85, 40%, 55%;"><article class="group flex h-64 w-full flex-col justify-between border border-solid border-base-300 bg-base-100 px-10 py-8 text-base-content text-opacity-80 transition-all duration-200 hover:border-[hsl(var(--statusColor))] hover:text-opacity-100 hover:shadow-xl hover:shadow-[hsla(var(--statusColor),.25)] active:-translate-y-1 active:scale-[1.01] active:shadow-md svelte-1f9x9br"><section class="notecontent"><header class="svelte-1f9x9br"><h1 class="line-clamp-2 h-16 text-lg svelte-1f9x9br">Seattle area cafés I like</h1></header> <p class="mt-3 line-clamp-3 h-[4.5em] leading-[1.5em] transition-all duration-200">A curated list of my favorite Seattle area cafes to sit, sip, and relax or work.</p></section> <section class="notemetadata border-t border-t-neutral-content border-opacity-60 pt-1 text-right text-sm svelte-1f9x9br"><div class="date min-w-[12ch] text-opacity-50 svelte-1f9x9br">Sep 14, 2023</div> <div class="min-w-[12ch] capitalize text-[hsl(var(--statusColor))] svelte-1f9x9br">seedling 🌱</div></section></article> </a></div></div> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-KiWOvVjnN8qwAZbuQyWDIbfCLFhLXNETzBQjA/92pIowpC0d2O3nppDGQVgwd2nB" crossorigin="anonymous"></div></div>
<script>
{
__sveltekit_1yrf0hg = {
base: new URL(".", location).pathname.slice(0, -1)
};
const element = document.currentScript.parentElement;
const data = [null,null];
Promise.all([
import("./_app/immutable/entry/start.BYTGewrw.js"),
import("./_app/immutable/entry/app.8UFY0431.js")
]).then(([kit, app]) => {
kit.start(app, element, {
node_ids: [0, 3],
data,
form: null,
error: null
});
});
}
</script>
</div>
</body>
</html>