Development
Languages and frameworks
ES6+ JavaScript is my main language these days. I’ve spent the last few years building in Vue (I’m unsurprisingly, therefore, a huge fan of Nuxt and Gridsome).
Recently, however, I’ve been moving most new projects over to SvelteKit (including this website!), and loving both the dev experience and reduced bundle size. I’ve also been working on implmenting TypeScript in all new projects. Professionally, I work in React, and have built several personal projects with it as well. I’ve also got working experience with jQuery and Knockout.
I love CSS passionately, but I don’t use any libraries or frameworks; all my CSS is from-scratch, responsive, and custom (usually written in SCSS). I love authoring smooth, fluid transitions and animations.
I’m a strong proponent of well-architected, accessible, and semantic HTML. (I create and use SVG often.)
I’m a wordpress expert and generally prefer to build themes from scratch. I’m capable with PHP and MySQL.
I wouldn’t call myself a full-stack developer, but I know my way around Ruby on Rails and have dabbled in some Node and Laravel.
Code tools
Visual Studio Code: my favorite editor ever. I was a reluctant Sublime Text convert, but the switch was more than worth it.
Theme: I love Dracula Pro; it strikes the perfect balance of contrast and color to my eye. I also appreciate that it comes with identical themes for other apps, like Slack, iTerm, and others. It is espensive, however, so for a free option, I’d go with go with good ol’ Dracula Official.
Font: MonoLisa. I’m a code nerd and a font nerd, so I don’t take this choice lightly, but this is my favorite dev font. I love its combination of legibility and subtle personality, and plus, the code ligatures are great. (If you’re not willing to spend the money, though—and I definitely understand if that’s the case— Fira Code is my runner-up.)
Extensions: I don’t have too many global recommendations here (it depends a lot on what you’re working with), but I’ll mention:
es6-string-html: treats HTML inside template literal strings like actual HTML code, for the purposes of highlighting, code completion, Emmett, etc.
Polacode: a nifty, pretty way to take code screenshots
GitLens: less indispensable now that VS Code has the Timeline view, but still amazingly handy for viewing git status and history in projects.
Close HTML/XML Tag: the only keyboard shortcut I miss from Sublime Text is easily replicated with this extension. Gives you a key command to auto-close whatever HTML tag your cursor is inside of.
Firefox: took some getting used to, but it’s a great browser with some awesome tools. It may not be as performant as Chromium browsers in some regards, but I personally view that as feature, not a bug; if I can make a transition or animation smooth in Firefox, I know it’s buttery everywhere else, too.
Local: hands-down the best way to develop WordPress sites. Fast and easy (especially if you host with Flywheel or WP Engine; you can push and pull sites directly).
CodeKit: there’s nothing CodeKit does that I couldn’t accomplish by fiddling with NPM scripts, but why bother? It’s smooth and easy to use, and as a bonus, it works great with Local.
iTerm2: I’ve tried other terminals, but none seem to run as well, and with the recent update, arguably, none look better, either.
Netlify: I’m also a fan of Now, but Netlify has taken over my Jamstack hosting #1 spot. It’s free to start and unbelievably easy. Netlify makes the painfully difficult effortlessly simple.
Hardware
Anker 2.4G Wireless Vertical Ergonomic Optical Mouse: I could feel my wrist straining using both a magic mouse and a touchpad. I switched to this mouse years ago. It took some adjustment, but I don’t ever want to use another mouse again, and I don’t even use the extra buttons.
Kinesis Freestyle2 for Mac keyboard: I paid for months of sitting-on-the-couch laptop time with a repetitive stress injury on my right wrist. This keyboard is a bit of an adjustment, but it has helped a lot with the wrist pain by keeping my wrists from going to outward angles.
Herman Miller Sayl Chair: I made it about two months as a full-time work-from-home employee before I went and bought one of these chairs. It’s the most comfortable and easily adjustable office chair I’ve ever sat in (and it looks really nice, too).
Uplift V2 C-Frame standing desk: Not a lot of purchases I’ve been happier with than this one. It works incredibly well and is surprisingly sturdy, even without springing for the commercial version. (I have the 27.5” feet for my larger Ikea desktop, and the Advanced Digital Memory Keypad.)
Productivity & Utility
1Password: The first thing I instal on every new device. I’ve tried and liked other password software, but 1Password is just the most reliable cross-platform and -device in my experience.
Alfred: the second thing I install on every new Mac. (I use the powerpack for added features, which is worth every penny.) The main features I love are clipboard history, snippet expansion, global search (never touch Finder again!), and workflows to automate repetitive or tedious tasks. Wouldn’t ever want to work without it.
CloudApp: taking screenshots and videos is a many-times-daily activity for me, and CloudApp makes it as seamless as possible.
RightFont: a simple, minimalist app for managing your computer’s fonts that looks and works better than Mac’s built-in FontBook.
Rectangle: never drag or resize another window again. Keyboard shortcuts to put everything right where you need it.
Bartender: helps wrangle all those app icons in your taskbar if you’re a minimalist like me.
Rocket: lends you Slack-like ability to use emoji anywhere. Way better than the OSX default emoji picker.
Notion: my current favorite notes app. Can grow and get as complex as you need it to be, but for simple notes, the markdown and code highlight support is fantastic.
Design and Illustration
Affinity Photo, Designer and Publisher: you can have software 90% as good as Photoshop, Illustrator and InDesign forever for the cost of three months of Creative Cloud.
Wacom Intuos Pro PTH-451 (small): I don’t often illustrate these days, but when I do, I’m always glad I have this fantastic pad. Wireless is a big plus.
This site
This is about the fifth iteration of my personal brand. The colors haven't changed, but I rotate fonts and layout once every year or two.
Colors
- #ffd100
- #34657f
- #7ba7bc
- #ff6a13
- #e4002b
- #a7a8aa
- #888b8d
- #53565a
- #341F23
- #101820
Fonts
Other fonts I've used previously: Korb (both on its own and paired with Bitter); Clarendon BT Pro + Texta; and Amsi Pro + Sagona. (I know you do not care, but this is here mostly just for my own memory.)