DEV Community

Khairun Nahar Nowrin
Khairun Nahar Nowrin

Posted on

How To Setup ZSH on Mac Terminal

Install Homebrew

Open up a terminal window and install homebrew with the following command:

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

Add Homebrew To Path

After installing, add it to the path (replace "[username]" with your actual username):

echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> /Users/[username]/.zprofile
eval "$(/opt/homebrew/bin/brew shellenv)"
Enter fullscreen mode Exit fullscreen mode

Install iTerm2

To install, run:

brew install --cask iterm2
Enter fullscreen mode Exit fullscreen mode

Switch to iTerm2 for the remainder of this walkthrough.

Install Git

If you don't have it installed, install git as well:

brew install git
Enter fullscreen mode Exit fullscreen mode

Install Oh My Zsh

Run this to install Oh My Zsh:

sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
Enter fullscreen mode Exit fullscreen mode

Install PowerLevel10K Theme for Oh My Zsh

Run this to install PowerLevel10K:

git clone https://github.com/romkatv/powerlevel10k.git $ZSH_CUSTOM/themes/powerlevel10k
Enter fullscreen mode Exit fullscreen mode

Now that it's installed, open the zshrc run this command

nano ~/.zshrc
Enter fullscreen mode Exit fullscreen mode

file with your preferred editor and change the value of "ZSH_THEME" as shown below:

ZSH_THEME="powerlevel10k/powerlevel10k"
Enter fullscreen mode Exit fullscreen mode

To reflect this change on your terminal, restart it or run this command:

source ~/.zshrc
Enter fullscreen mode Exit fullscreen mode

Install Meslo Nerd Font

Install the font by pressing "y" and then quit iTerm2.

Update VSCode Terminal Font (Optional)

The settings.json file in Visual Studio Code can be found in the following location:

  • macOS: $HOME/Library/Application Support/Code/User/settings.json

  • You can also access the settings.json file directly in Visual Studio Code by going to File > Preferences > Settings, and then clicking on the {} icon in the top right corner to open the settings.json file.

Open settings.json and add this line:

"terminal.integrated.fontFamily": "MesloLGS NF"
Configure PowerLevel10K
Enter fullscreen mode Exit fullscreen mode

Restart iTerm2. You should now be seeing the PowerLevel10K configuration process. If you don't, run the following:

p10k configure
Enter fullscreen mode Exit fullscreen mode

Follow the instructions for the PowerLevel10K configuration to make your terminal look as desired.

Increase Terminal Font Size

  • Open iTerm2 preferences

  • Go to Profiles > Text

  • I increase my font size to about 20px

Change iTerm2 Colors to My Custom Theme

  • Open iTerm2

  • Download my color profile by running the following command (will be added to Downloads folder):

curl https://raw.githubusercontent.com/josean-dev/dev-environment-files/main/coolnight.itermcolors --output ~/Downloads/coolnight.itermcolors
Enter fullscreen mode Exit fullscreen mode

  • Open iTerm2 preferences

  • Go to Profiles > Colors

  • Import the downloaded color profile (coolnight)

  • Select the color profile (coolnight)

You can find other themes here: Iterm2 Color Schemes

Install ZSH Plugins

Install zsh-autosuggestions:

git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions
Enter fullscreen mode Exit fullscreen mode

Install zsh-syntax-highlighting:

git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting
Enter fullscreen mode Exit fullscreen mode

Open the "~/.zshrc" file in your desired editor and modify the plugins line to what you see below.

plugins=(git zsh-autosuggestions zsh-syntax-highlighting web-search)
Enter fullscreen mode Exit fullscreen mode

Load these new plugins by running:

source ~/.zshrc
Enter fullscreen mode Exit fullscreen mode

You're Done!

Youtube video reference - https://www.youtube.com/watch?v=CF1tMjvHDRA&t=284s

Top comments (4)

Collapse
 
delciopolanco profile image
Delcio Polanco •

Thanks, this guide made me so happy.

Collapse
 
simeydotme profile image
Simon Goellner •

easy to follow, worked perfect. Great for new mac setup. thanks!
Only suggestion is a few images (especially for your color theme)

Collapse
 
khairunnaharnowrin profile image
Khairun Nahar Nowrin •

Thanks for the suggestion

Collapse
 
patrickmonteiro profile image
Patrick Monteiro •

This is the best tutorial I've seen on the subject, covering it in a simple, easy and straight to the point way!
Congratulations and thank you.

Read next

driverfibre2 profile image

Exploring the Effect of Blockchain on Modern Industries

Buchanan Rosenberg -

saladcousin5 profile image

Quantum Computing: Exploring the Next Era of Technology

Reilly Kjer -

syriadrawer6 profile image

Starter Tips for Becoming Skilled in Python Coding

Carlsson Kiilerich -

gamelord2011 profile image

Accessing the Windows filesystem from WSL (WSL2)

Reid Burton -