Skip to content

Tools I use to build Virga

Hardware: MacBook permalink

First off, I’m Apple guy so tools I’ll Introduce here are heavily leaning to that direction.

My current is MacBook (Retina, 12-inch, 2017).
I don’t own an external keyboard nor monitor.

Editor: IntellJ IDEA & iA Writer permalink

I used be a Vimmer but I’ve been using IntellJ IDEA for 4 or 5 years now for coding.
And I use iA Writer for any other writing which is where Virga’s inspiration comes from by the way.
I love iA Writer. I’ve been using it since it’s released.

I’ve been looking for very light weight editor for coding. IntellJ IDEA is too heavy for small changes.
Xi editor looks very promising so I’m looking forward its progress.

Terminal: iTerm2 permalink

iTerm2 is my choice for a termial app. I’ve tried Hyper for while but I went back to iTerm2.
My default shell is now fish which I’ve made the switch after I upgrade to Catalina.

I have so many command line tools with me so I’m not gonna share them all here but I’ll list ones I use in developing websites.

direnv
Load/unload environment variables based on $PWD
jq
Lightweight and flexible command-line JSON processor
lynx
Text-based web browser
bat
Clone of cat(1) with syntax highlighting and Git integration
z
Tracks most-used directories to make cd smarter
gh
GitHub CLI
fnm
Fast and simple Node.js version manager
tidy-html5
Granddaddy of HTML tools, with support for modern standards
ripgrep
Search tool like grep and The Silver Searcher
imageoptim-cli
Automates ImageOptim, ImageAlpha, and JPEGmini for Mac to make
batch optimisation of images part of your automated build process
npm-check-updates
Find newer versions of dependencies than what your package.json or bower.json allows

Other apps permalink

I don’t do UI design but when I need to do some vector related stuff, I use Sketch.

I like color. So I have Sip and Spectrum. The former is a color picker app though I love its color contrast ability for it. The latter is a color scheme design app.

My default browser is Firefox Developer Edition.
I’ve made the switch from Chrome from this year and I only go back to Chrome when I need to do some serious performance audit.

Web Tools permalink

ColorBox by Lyft Design
Color scheme for Virga is come from this tool
Whimsical
Flowcharts、wireframes, sticky notes and mind maps tool. I use this almost everyday

There are other tools I use at work regularly but for building Virga, I use those 2 tools.