Mac Web Developer Setup: Terminal, zsh, Git, Node, VS Code, Homebrew, and GitHub CLI
Tags: mac, node, nvm, zsh
Published: 2022-09-20 20:59:31

---
title: Mac Web Developer Setup: Terminal, zsh, Git, Node, VS Code, Homebrew, and GitHub CLI
published: true
description: A full checklist for setting up a Mac for web development, complete with links to documentation, run commands, and notes for potential issues you may encounter.
tags: mac, node, nvm, zsh
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
---

I’ve had to set up a Macbook for development three times this year, and hit road blocks each time. This time, I decided to write down and record the process based on what I’ve learned from previous attempts.

# Table of Contents

- [My machine specs](#my-machine-specs)
- [Note](#note)
- [Video walkthrough of the process](#video-walkthrough-of-the-process)
- [1. iTerm2](#1-iterm2)
  - [Installation](#installation)
- [2. Xcode Command Line Tools (CLT)](#2-xcode-command-line-tools-clt)
  - [Validation](#validation)
- [3. Git](#3-git)
  - [Validation](#validation-1)
- [4. ZSH](#4-zsh)
  - [Configuration](#configuration)
- [5. NVM](#5-nvm)
  - [Installation](#installation-1)
  - [Troubleshooting Notes](#troubleshooting-notes)
- [6. VSCode](#6-vscode)
  - [Installation](#installation-2)
- [7. Homebrew](#7-homebrew)
  - [Installation](#installation-3)
- [8. GitHub CLI](#8-github-cli)
  - [Installation](#installation-4)


**My machine specs:** Macbook Air, M1, Monterey 12.6

Here is my checklist, complete with links to documentation, run commands, and notes for potential issues you may encounter. It’s important to complete the steps **in order**, as there are dependencies installed in each step required for later installations.

### Note 
These are based on my experience with trial and error setting up a machine. If you have recommendations for improving this process, please comment!

**Video walkthrough of the process:**

{% embed https://www.loom.com/share/472c71953de04f77af0300fde3b0d4b9 %}

# 1. iTerm2
Terminal alternative for Mac, recommended to me and I’ve used it for years.

## Installation
* Install from download via [https://iterm2.com/](https://iterm2.com/)
* will automatically install Xcode CLT

# 2. Xcode Command Line Tools (CLT)
This should be installed already via Step 1, but it's important to validate the entire package was installed.

## Validation
* validate full package installed via iTerm2 with `xcode-select -p`
* Should see `/Library/Developer/CommandLineTools`
* Run `ls /Library/Developer/CommandLineTools/usr/bin/git`
* Should see `/Library/Developer/CommandLineTools/usr/bin/git`
* **Source:** [https://mac.install.guide/commandlinetools/2.html](https://mac.install.guide/commandlinetools/2.html)

# 3. Git
Installs automatically with Xcode CLT, but also important to validate installation was successful.

## Validation
* validate with `git --version`
* Will prompt installation if not already installed
* **Source:** [https://git-scm.com/book/en/v2/Getting-Started-Installing-Git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git)

# 4. ZSH
ZSH is the shell used in your terminal. As of MacOS 10.15, ZSH is the default over Bash. If you are using Bash or have Bash installed, your setup will be different. 

## Configuration
* Confirm you are using `zsh` with `echo $SHELL`, should output `/bin/zsh`
* Run `ls .zshrc` to see if you have a `zsh` profile
* If not found, `touch ~/.zshrc` then `ls .zshrc` again to confirm
* **Source:** [https://mac.install.guide/commandlinetools/1.html](https://mac.install.guide/commandlinetools/1.html)

# 5. NVM
NVM is recommended to navigate between versions and to avoid permission issues when installing Node directly on Mac.

## Installation
* Run `curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | zsh`
* Restart terminal instance
* Validate `nvm` installation with `nvm -v`
* `nvm install --lts`
  * This installs the latest long-term support version of Node, recommended for most users ([https://nodejs.org/en/](https://nodejs.org/en/))
  * Can also specify a certain version or `nvm install node` for latest version
  * first version installed becomes default, to update default in the future run `nvm alias default <VERSION>`
* validate Node installation with `node -v`
* **Source:** [https://github.com/nvm-sh/nvm#install--update-script](https://github.com/nvm-sh/nvm#install--update-script)

## Troubleshooting Notes
* **Source**: [https://github.com/nvm-sh/nvm#troubleshooting-on-macos](https://github.com/nvm-sh/nvm#troubleshooting-on-macos)
* Since macOS 10.15, the default shell is `zsh` and nvm will look for `.zshrc` to update, none is installed by default. Create one with `touch ~/.zshrc` and run the install script again (already handled with step 4)
* Homebrew installation is not supported. If you have issues with homebrew-installed `nvm`, please `brew uninstall` it, and install it using the instructions below, before filing an issue.
* For Macs with the M1 chip, node started providing **arm64**
         arch darwin packages since v16.0.0. For earlier versions, there were only **darwin_x64** packages available but no **darwin_arm64**. If you are facing issues installing node using `nvm`, you may want to update to v16 or later.
* You might need to restart your terminal instance or run `. ~/.nvm/nvm.sh`. Restarting your terminal/opening a new tab/window, or running the source command will load the command and the new configuration.

# 6. VSCode
A popular free code editor/IDE from Microsoft that provides a built-in terminal and various plugins for development.

## Installation
* Install via:  [https://code.visualstudio.com/docs/setup/mac#_installation](https://code.visualstudio.com/docs/setup/mac#_installation)
  * Make sure to drag into your Applications folder before launching.
* Set up launch from command line using instructions here: [https://code.visualstudio.com/docs/setup/mac#_launching-from-the-command-line](https://code.visualstudio.com/docs/setup/mac#_launching-from-the-command-line)
  * This will let you run `code .` from a project directory to open in VSCode
  * **Update 4/1/2024:** If the `code` command stops working, you may need to open the Command Palette and select `Uninstall code command in PATH` and reinstall to get it working again.

# 7. Homebrew
Recommended for GitHub CLI installation, and can be used for managing other packages installed globally on your Mac.

## Installation
* Xcode CLT required for installation (already handled with steps 1+2)
* Run `/bin/bash -c "$(curl -fsSL [https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh](https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh))"` and follow prompts to install
* May receive warning that brew is not in PATH with next steps. Run these two commands in your terminal to add Homebrew to your PATH:
  * `echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> /Users/cecelia/.zprofile`
  * `eval "$(/opt/homebrew/bin/brew shellenv)"`
* Validate install with `brew -v`
* **Source:** [https://brew.sh/](https://brew.sh/)

# 8. GitHub CLI
Highly recommended for interacting with GitHub from the terminal. You can skip if you prefer to use GitHub Desktop or interact with GitHub via Git and HTTPS/SSH, you can skip this step.

## Installation
* `brew install gh`
* Run `gh auth login`
* Select GitHub.com or GitHub Enterprise
* Select HTTPS or SSH
* Set title for SSH key
* Select Login via web browser, this will launch GitHub in your browser
* Create key if needed and authenticate in web browser
* Terminal output will confirm you are authenticated
* Validate with `gh auth status`
* **Source:** [https://cli.github.com/manual/](https://cli.github.com/manual/)

**Update 4/1/2024**: If you authenticate via SSH, you should test your SSH key using the [instructions here](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/testing-your-ssh-connection).

You'll also need to update your `.gitconfig` file with the correct name and email address. My preferred way to update is:

- Run `ls -a` to confirm there is a `.gitconfig` file in your home directory.
- Run `code .gitconfig` to open the file in VS Code
- Make your edits and save.

Now you are all set up and ready to start developing! Check out the documentation for GitHub CLI for more information on how to set up projects, check out pull requests, and more.