Setting up my Dev Environment on a Mac
Tags: productivity, programming
Published: 2021-02-25 20:27:44

I recently started a new job and spent hours looking up how to install all of the tools I use for development on my personal MacBook. I came across Tania Rascia's [macOS Catalina: Setting up a Mac for Development](https://www.taniarascia.com/setting-up-a-brand-new-mac-for-development/), which inspired me to create some documentation on the tools I use so I can streamline the process in the future.

This is intended to be a "living document" of my development environment. I would highly recommend Tania's article for more of a tutorial on many of the tools.

*I'm always looking for tools that make my life easier. I'd love to hear what you're using!*

## Tools

- [homebrew](https://brew.sh/): package manager

```bash
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
```

- [git](https://git-scm.com/): version control
- [make](https://www.gnu.org/software/make/manual/make.html): builds executable programs
- [pyenv](https://github.com/pyenv/pyenv): python manager

```bash
brew install git make pyenv
```

After installing `git`, don't forget to configure it:

```bash
vi ~/.gitconfig
```

After installing `pyenv`, install the latest Python version:

```bash
pyenv install 3.9.1
pyenv global 3.9.1
pyenv version
# update shell path (ZSH on Catalina)
echo -e 'if command -v pyenv 1>/dev/null 2>&1; then\n  eval "$(pyenv init -)"\nfi' >> ~/.zshrc
# ensure pip uses pip3 (ZSH on Catalina)
echo "alias pip=/usr/local/bin/pip3" >> ~/.zshrc 
```

- nvm: node manager

```bash
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash
nvm install node
# restart terminal
nvm use node
```

## GUI Applications

I'm a simple person. I rely on generic macOS apps like notes and terminal and use the Teams, Spotify, and GitHub web apps.

- VSCode: IDK
- Chrome: Main browser
- Firefox: Secondary browser
- Postman: API testing
- Docker: VM containers

```sh
brew cask install \
  visual-studio-code \
  google-chrome \
  firefox \
  docker \
  postman
```

## Extensions

### Chrome

- [uBlock Origin](https://chrome.google.com/webstore/detail/ublock-origin/cjpalhdlnbpafiamejdnhcphjbkeiagm): Adblocker
- [React DevTools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi): Debugging for react apps
- [Augury](https://chrome.google.com/webstore/detail/augury/elgalmkoelokbchhkhacckoklkejnhcd): Debugging for Angular
- [Grammarly](https://chrome.google.com/webstore/detail/grammarly-for-chrome/kbfnbcaeplbcioakkpcpgfkobkghlhen): Grammar/spellchecker
- [Dark Reader](https://chrome.google.com/webstore/detail/dark-reader/eimadpbcbfnmbkopoojfekhnkhdbieeh): Dark mode for any website
- [Last Pass](https://chrome.google.com/webstore/detail/lastpass-free-password-ma/hdokiejnpimakedhajhdlcegeplioahd): Password manager
- [JSON View](https://chrome.google.com/webstore/detail/jsonview/chklaanhfefbnpoihckbnefhakgolnmc): Beautify JSON docs

### VS Code

**Languages**

- [Go](https://marketplace.visualstudio.com/items?itemName=golang.Go)
- [Python](https://marketplace.visualstudio.com/items?itemName=ms-python.python)
- [C/C++](https://marketplace.visualstudio.com/items?itemName=ms-vscode.cpptools)
- [JavaScript and TypeScript Nightly](https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-next&ssr=false#overview)
- [YAML](https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml)
- [dotENV](https://marketplace.visualstudio.com/items?itemName=mikestead.dotenv)

**Linters**

- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint): JavaScript ESLint
- [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode): Opinionated code formatting
- [Grammarly](https://marketplace.visualstudio.com/items?itemName=znck.grammarly): Grammar/spellcheck for Markdown files

**Tools**

- [Night Owl](https://marketplace.visualstudio.com/items?itemName=sdras.night-owl): Dark theme for VS Code
- [Kubernetes](https://marketplace.visualstudio.com/items?itemName=ms-kubernetes-tools.vscode-kubernetes-tools): Cluster management, debugging, etc.
- [Docker](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-docker): Container management
- [Jupyter](https://marketplace.visualstudio.com/items?itemName=ms-toolsai.jupyter): Jupyter notebook in VSCode...not a huge fan :(

**Productivity**

- [TabNine](https://marketplace.visualstudio.com/items?itemName=TabNine.tabnine-vscode): AI auto-complete
- [Markdown All-in-One](https://marketplace.visualstudio.com/items?itemName=yzhang.markdown-all-in-one): Markdown preview/shortcuts
- [Auto Rename Tag](https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag): Auto rename HTML tags

*Cover photo by [Alexander Shatov](https://unsplash.com/@alexbemore)*