MacOS Environment Setup
Hi guys. In this guide, I will share my current environment setting for web development. Whether you are a new developer, or you simply just bought yourself a new macbook, I hope you will find the information useful to you.
1. XCode
Xcode is a development tools developed by Apple to develop, test apps for all Apple platforms. Installing Xcode is pretty straightforward
You can download and install it from App Store. However this way it will download the whole IDE (20GB+) and for a Web Developer it may not be necessary. You can just use its CLI (For use Git, Homebrew, or compiling code).
To install the CLI, run it in Terminal:
xcode-select --install
Then click Install in the prompt that pops up.
📦 This installs only the Xcode Command Line Tools, which are ~1GB — much smaller than full Xcode.
2. Homebrew
Homebrew is the package to manage for macOS and using to install a lot of tools like git, node, xcode,...
Copy and paste this command into your terminal:
/bin/ -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
Following the guide to input your sudo password or press RETURN/ENTER to complete the installation. When the installation is complete, reopen your terminal to use Homebrew. You can check everything is working by running:
brew-doctor
If you see the warning instead "ready to brew!", don't worry . You can run below promt to verify Homebrew working fine:
brew-search-iterm2
3. iTerm2 / Wrap
If your current terminal is really boring, you might consider using iTerm2 by running the following command:
brew install --cask iterm2
Customization
This customize can improve your terminal experience. But this is optional, you can skip if you feel it not interested
- Download theme from iTerm2-Color-Schemes and import your favorite profile
- Install Zsh + Oh My Zsh for better prompts and plugins (Since MacOS Catalina, zsh has been set as the default)
sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
Then pick a theme from .zshrc, e.g., ZSH_THEME="agnoster" or use Powerlevel10k:
brew install romkatv/powerlevel10k/powerlevel10k
Then in .zshrc:
ZSH_THEME="powerlevel10k/powerlevel10k"
Besides iTerm2, recently I switched to another Rust-based terminal which is easier to use, install and more support with AI, is Warp. To install Warp, run the following command:
brew install --cask warp
4. Git
If you are a developer, you must use Git. To install, run:
brew install git
When done, verify that by using git --version and set git config
git config --global user.name "Your Name"
git config --global user.email "you@example.com"
Set up SSH
You need to follow the Official documentation of Github for setup SSH config. I won't describe the steps in detail in this blog
5. NVM & Node
NVM is a cross-platform Node.js version manager. To install, run:
brew install nvm
Create NVM directory
mkdir ~./nvm
Config shell. Add the following config to .zshrc or .rc. If these 2 files do not exist, create them by:
touch ~/.zshrc
Then, open this file to add config:
export NVM_DIR="$HOME/.nvm"
[ -s "/opt/homebrew/opt/nvm/nvm.sh" ] && \. "/opt/homebrew/opt/nvm/nvm.sh"
[ -s "/opt/homebrew/opt/nvm/etc/_completion.d/nvm" ] && \. "/opt/homebrew/opt/nvm/etc/_completion.d/nvm"
Then, apply the changes:
source ~/.zshrc
Install Node with NVM
nvm install node # or nvm install node --version
nvm use node # or nvm use --version
# Verify the Node.js version
node -v
You can switch between Node.js versions in specific projects or directories.
6. IDEs
- Visual studio code
Visual Studio Code is a lightweight code editor with support for many programming languages through extensions
To install the latest version, use Homebrew:
brew install --cask visual-studio-code
- WebStorm
WebStorm is the JavaScript and TypeScript IDE. JetBrains now accepts Free for non-commercial use. You can download it via here WebStorm