The Perfect Web Development Setup for OS X / macOS

This is what I perceive as the perfect web development OS X setup for JavaScript engineers.

Goals

• Never use sudo. Once you run a command with sudo, future commands are probably gonna be fucked up as well.
• Automatically start all services. Don't bother keeping track a bunch of terminals running processes.
• Don't shoot yourself in the foot.

Environment Profile

The new default shell in macOS is zsh. Create and update your profile at ~/.zshrc. You may also want to brew install zsh-completions zsh-autosuggestions.

XCode Command Line Tools

First, you need to install XCode's command line tools. This installs a lot of tools like git which aren't needed for plebeians.

xcode-select --install

If you're on Apple Silicon, you may want to install Rosetta 2:

softwareupdate --install-rosetta

Install Homebrew

Homebrew is a macOS package manager that makes setting up all your services very easy.

• For Intel Macs, you can just install with the simple script on the homepage.
• For Apple Silicon Macs, I would recommend following this guide: https://soffes.blog/homebrew-on-apple-silicon

Install everything

Install everything with Homebrew. Here are some packages you might be interested in right now:

# for editing files
brew install vim
# always keep your git up to date by installing it with brew
brew install git
# download stuff
brew install curl

Updating

To update your packages, simply run:

brew update
brew upgrade
brew cleanup

Install node.js with nvm

One thing many users do is install node.js globally. This is easy to get started or fine for servers, but it makes developing a pain. If you have to ever run npm with sudo, you're doing it wrong!

nvm is what I think is the best node version manager. It can be installed with homebrew! Yes, you use a package manager to install a version manager to install another package manager. It's stupid, but they all have their strengths.

brew install nvm

Then, follow the installation instructions:

brew info nvm

Then, set a default version of node.js. To use LTS:

nvm alias default lts/*

Default node.js version via .nvmrc

The .nvmrc route of selecting the version of node to use is helpful when you are working on multiple projects with different versions of node. Create a ~/.nvmrc file with a version of node you'd like to use or, for LTS versions, lts/*:

echo "lts/*" > ~/.nvmrc

Then install that version of node:

nvm install

Note that you should run nvm install once in a while to get an updated version of node.

Then in your ~/.zshrc, add the following line to always use the version of node the current working directory expects:

nvm use
# or `nvm install`, which is slower, but will always install the latest version of node

Now, nvm will find the nearest .nvmrc file and use that version of node whenever the terminal starts.

Using npm

With nvm, you should never be calling any npm functions with sudo. nvm adds binaries installed globally to your $PATH, so if you install npm i -g create-react-app, create-react-app will automatically be added to your $PATH.

To upgrade npm, run npm -i -g npm.

To have node binaries install faster, add the following to your ~/.nvmrc:

export NPM_CONFIG_JOBS=max

If you hate the npm progress bar like, add this to your zshrc:

export NPM_CONFIG_PROGRESS=false

Speed up node.js

node.js has by default 4 thread pools via libuv regardless of how many CPUs you have. If you have more CPUs and depending on what you're running locally, you may find a performance benefit in increasing this number.

export UV_THREADPOOL_SIZE=8

vim

Homebrew's default version of vim doesn't allowing copying and supports the mouse, which IMO defeats the purpose of vim. Here's a basic ~/.vimrc to fix that:

set mouse=
syntax on

thefuck?

thefuck is a nifty tool that allows you to fix your previous CLI typos by just typing fuck. It perhaps has the greatest UX of all products, ever.

Installing it is easy:

brew install thefuck

Then follow the instructions:

brew info thefuck

Setting up databases

Homebrew makes setting up databases super easy. First step - install it with Homebrew:

brew install redis

Then you'll see information on your terminal like the following:

To have launchd start redis now and restart at login:
  brew services start redis

To read this information again, just type brew info redis. Run the command and, Voila! redis-server will always be running! You won't have to open a bunch of terminals to keep it running!

Rinse and repeat for all your databases.

git & GitHub

You may want to set up a few configs.

Always fast-forward when pulling (never rebase as it may mess up your local branch):

git config --global pull.ff only 

• Setup SSH for GitHub
• GitHub Desktop
• GitHub CLI

Tools & Applications

• iStat Menus - help me figure out if something's taking too much CPU, RAM, or network
• VS Code
• Docker for Mac
• EditorConfig
• Set up private npm token
• Set up ssh without typing your password
• Bittorrent blocklist
• Hosts file blocklist
• Google DNS
• Cloudflare DNS