iTerm2 config or new project — new battle

There is a storm on the horizon. A time of hardship and pain. The battle has been won, but the war against machines rages on… John Connor.

And again, new project — new configuration…

Working in out staff company each time when you change a project you need to change company and its macbook. Even working in outsource company when you should not change company for each project it’s better to reset your macbook.

The most important stuff in development is a console or terminal. And in this article we configure it.

Homebrew

Homebrew is a Package Manager for macOS. To install it run:

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

After that you can install git and nvm (Node Version Manager):

brew install git nvm

iTerm2

Now we need to install iTerm2 — a replacement for Terminal and the successor to iTerm. It works on Macs with macOS 10.12 or newer. iTerm2 brings the terminal into the modern age with features you never knew you always wanted.

You can install it manually — download it from iTerm2 homepage or run:

brew install --cask iterm2

To change background color of the terminal navigate to

iTerm2 > Preferences > Profiles > Colors

Then you need to change font to SourceCodePro (or choose another from powerline fonts):

git clone https://github.com/powerline/fonts.git ~/Downloads/fonts/

sh ~/Downloads/fonts/install.sh

rm -Rf ~/Downloads/fonts

To change the font, navigate to

iTerm2 > Preferences > Profiles > Text > Change Font

Another useful change — vertical cursor.

iTerm2 → Preferences → Profiles → Text
→ Cursor : ✓ Vertical Bar 
→ Blinking cursor : ✓ ON

Text navigation with keyboard.

Moreover, by default, word jumps (option + → or ←) and word deletions (option + backspace) do not work on iTerm2. To enable them, go to :

iTerm → Preferences → Profiles → Keys → Load Preset… → Natural Text Editing

By default terminal has small size. To make it bigger change Settings for New Windows (I like 120x30):

iTerm → Preferences → Profiles → Window

And I don’t like when it works even if I closed all tabs and windows. To change it check Quit when all windows are closed:

iTerm → General → Closing

Zsh

Zsh is a shell designed for interactive use, although it is also a powerful scripting language. We will use it with some other useful plugins:

brew install zsh zsh-syntax-highlighting zsh-autosuggestions

To see current version you can run:

zsh --version

Oh-My-Zsh

Oh-My-Zsh is a delightful, open source, community-driven framework for managing your ZSH configuration. It comes bundled with thousands of helpful functions, helpers, plugins, themes, and a few things that make you shout…

To install it run:

sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)"

Then if you need to upgrade it run

omz update

Next we can customize it and add plugins and change theme.

I like to use Powerlevel9k — a theme for ZSH which uses Powerline Fonts. It can be used with vanilla ZSH or ZSH frameworks such as Oh-My-Zsh, Prezto, Antigen, and many others.

To install it run

git clone https://github.com/bhilburn/powerlevel9k.git ~/.oh-my-zsh/custom/themes/powerlevel9k

Then you need to open .zshrc file

open ~/.zshrc

and change theme

ZSH_THEME="powerlevel9k/powerlevel9k"

Oh My Zsh comes with a shitload of plugins for you to take advantage of. You can take a look in the plugins directory and/or the wiki to see what’s currently available.

We can enable some useful plugins:

plugins=(
  git
  yarn 
  web-search 
  jsontools
  macports
  node 
  macos 
  sudo
  vscode
  docker
  dotenv
  npm
  nvm
)

As you remember we installed zsh-syntax-highlighting and zsh-autosuggestions, to activate it just add to the end of file:

source /usr/local/share/zsh-autosuggestions/zsh-autosuggestions.zsh
source /usr/local/share/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh

For Mac with m1 replace /usr/local to /opt/homebrew

source /opt/homebrew/share/zsh-autosuggestions/zsh-autosuggestions.zsh
source /opt/homebrew/share/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh

And last step — visual customization. You can read more about Powerlevel9k customization.

In our case we need to add next code to the end of the .zshrc file:

### VISUAL CUSTOMIZATION ### 

# Elements options of left prompt (remove the @username context)
POWERLEVEL9K_LEFT_PROMPT_ELEMENTS=(dir rbenv vcs)
# Elements options of right prompt
POWERLEVEL9K_RIGHT_PROMPT_ELEMENTS=(status root_indicator background_jobs history time)



# Add a second prompt line for the command
POWERLEVEL9K_PROMPT_ON_NEWLINE=true

# Add a space in the first prompt 
POWERLEVEL9K_MULTILINE_FIRST_PROMPT_PREFIX="%f"

# Visual customisation of the second prompt line
local user_symbol="$"
if [[ $(print -P "%#") =~ "#" ]]; then
    user_symbol = "#"
fi
POWERLEVEL9K_MULTILINE_LAST_PROMPT_PREFIX="%{%B%F{black}%K{yellow}%} $user_symbol%{%b%f%k%F{yellow}%} %{%f%}"


# Change the git status to red when something isn't committed and pushed
POWERLEVEL9K_VCS_MODIFIED_BACKGROUND='red'

# Add a new line after the global prompt 
POWERLEVEL9K_PROMPT_ADD_NEWLINE=true


# Colorise the top Tabs of Iterm2 with the same color as background
# Just change the 18/26/33 wich are the rgb values 
echo -e "\033]6;1;bg;red;brightness;18\a"
echo -e "\033]6;1;bg;green;brightness;26\a"
echo -e "\033]6;1;bg;blue;brightness;33\a"

To save the change run Cmd+S. To apply the change run

source ~/.zshrc

Then reopen terminal and you can see something like this

If you see next error:

Insecure completion-dependent directories detected

Run next command to fix

chmod 755 /usr/local/share/zsh
chmod 755 /usr/local/share/zsh/site-functions

Git configuration

When you start working with git you need to add some settings.

Name and Email:

git config --global user.name "FIRST_NAME LAST_NAME"
git config --global user.email "MY_NAME@example.com"

To change default editor:

git config --global core.editor "nano"

To see full list of branches:

git config --global pager.branch false

VS Code

To use zsh in VS Code console open the settings pane of VS Code and find this property: “terminal.integrated.shell.osx”. Tap on the edit button and set next values

{
    "files.autoSave": "afterDelay",
    "terminal.integrated.shell.osx": "zsh",
    "terminal.integrated.fontFamily": "Source Code Pro for Powerline",
    "terminal.integrated.fontSize": 14
}

WebStorm

To use zsh in WebStorm open

Preferences -> Tools -> Terminal

and change Shell path to /bin/zsh

My other articles:

Evheniy Bystrov - Medium

If you have own company and you need help with IT infrastructure, create app or even team, start using a new features like react/redux/nodejs/aws/serverless, please ping me.