Zsh shell offers four configuration files with no discernible differences. Particularly, ~/.zshrc and ~/.zprofile appear to be identical, leaving us wondering which one to use.

In this article, you'll learn the difference and a simple guideline for your shell configuration.

Why Do you Need Configuration?

For programming on a Mac, the Terminal application is an essential tool in your development environment. The Terminal is a command-line interface (CLI) that allows you to interact with the operating system and run commands.

The Terminal or console gives you access to the Unix command line, or shell.

Zsh, also known as Z shell, is a program that runs in the Terminal, interprets Unix commands, and interacts with the operating system. Zsh is the default shell program on MacOS.

Before you get started with programming on the Mac, you'll need to configure the shell. There are optional and convenient settings, such as aliases for hard-to-remember commands and a custom prompt that can display the directory you're in, among other things.

There are also some critical environment variables that make programs available or alter shell behavior. The EDITOR environment variable, for example, can set your preferred text editor. Oftentimes, when installing a programming language or software utilities, you need to set the PATH environment variable..

Where to Start

Zsh configuration files are kept in the user's home directory and are named with a dot as the first character to keep them hidden by default.

Zsh recognizes four different configuration files in the user's home directory: ~/.zshenv, ~/.zprofile, ~/.zshrc, and ~/.zlogin.

This is where Zsh configuration becomes puzzling, even for experienced developers. Tutorials rarely explain the differences, especially between the zprofile and zshrc files, leaving curious developers scratching their heads and blindly following instructions.

How is the Shell Used?

To understand the differences among Zsh configuration files, consider various shell uses, which can be classified as interactive or non-interactive, login or non-login sessions.

1. On macOS, each new terminal session is treated as a login shell, so opening any terminal window starts an interactive login session. Also, a system administrator who connects to a remote server via SSH initiates an interactive login session.
2. If a terminal window is already open and you run the command zsh to start a subshell, it will be interactive and non-login. Beginners rarely use subshells.
3. Automated shell scripts run without login or any user prompting. These are non-interactive and non-login.
4. Few people ever encounter a non-interactive login shell session. It requires starting a script with a special flag or piping output of a command into an SSH connection.

How do the Configuration Files Work?

These use cases necessitate different shell configurations, which explains why Zsh supports four different configuration files. Here's how the configuration files are used:

• ~/.zshenv: This is loaded universally for all types of shell sessions (interactive or non-interactive, login or non-login). It is the only configuration file that gets loaded for non-interactive and non-login scripts like cron jobs. However, macOS overrides this for PATH settings for interactive shells.
• ~/.zprofile: Loaded for login shells (both interactive and the rare non-interactive sessions). MacOS uses this to set up the shell for any new terminal window. Subshells that start within the terminal window inherit settings but don't load ~/.zprofile again.
• ~/.zshrc: Loaded only for interactive shell sessions. It is loaded whenever you open a new terminal window or launch a subshell from a terminal window.
• ~/.zlogin: Only used for login shell configurations, loaded after .zprofile. This is loaded whenever you open a new terminal window.

How to Use Each File

With that in mind, let's consider which configuration files you should use.

• ~/.zshenv: It is universally loaded, so you could use it to configure the shell for automated processes like cron jobs. However, it is best to explicitly set up environmental variables for automated processes in scripts and leave nothing to chance. As a beginner, you will not use this configuration file. In fact, few experienced macOS developers use it.
• ~/.zprofile: Homebrew recommends setting the PATH variable here. There's a reason PATH should be set in ~/.zprofile and not the universal ~/.zshenvfile: the macOS runs a utility path_helper (from /etc/zprofile) that sets the PATH order before ~/.zprofile is loaded.
• ~/.zshrc: This is the configuration file that most developers use. Use it to set aliases and a custom prompt for the terminal window. You can also use it to set the PATH (which many people do) but ~/.zprofile is preferred.
• ~/.zlogin: This is rarely used. Only important in managing the order of initialization tasks for login shells in complex environments. It can be used to display messages or system data.

How to Avoid Complications

These configurations may appear complicated. It made sense in the early days of computing to start time-consuming processes at login and not have them repeat when a new terminal was launched.

MacOS now launches any new terminal window as a login shell, loading both ~/.zprofile and ~/.zshrc files without concern for the shell startup time. So why not use one Zsh configuration file? A bow to history, plus configuration customization for the experts.

The key advantage of the ~/.zprofile file (versus ~/.zshenv) is that it sets environment variables such as PATH without override from macOS. The ~/.zshrc file could be used for the same but, by convention and design, is intended for customizing the look and feel of the interactive terminal.

Keep It Simple

If you're looking for simple guidelines, here's the current best practice.

• Use ~/.zprofile to set the PATH and EDITOR environment variables.
• Use ~/.zshrc for aliases and a custom prompt, tweaking the appearance and behavior of the terminal.
• If you write automated shell scripts, check and set environment variables in the script.

More Information

I've written other guides that go into detail about the following:

• Mac Terminal
• Shell Configuration
• Mac PATH.

If you're just getting started, you'll need to know How to Open Mac Terminal and Install Xcode Command Line Tools.

Configuring the Zsh shell is a critical step in preparing your Mac development environment. With your development environment set up, you'll be prepared for any tutorial you'll find on freeCodeCamp.

There are other environments such as the C Shell, Korn Shell, Z Shell, and even the Fish Shell. All of these different shell environments have their own pros and cons, and you should consider them before you choose one to use on your own system.

In this article, I'll go over a few popular shells along with their main features to help you pick one.

The Bash Shell

The Bash Shell (or the Bourne Again Shell) is a UNIX shell and command language. It was written by Brain Fox for the GNU Project as a free software replacement for the Bourne Shell (sh).

Bash was first released in 1989, and for most Linux distributions it's the default Shell environment. Other distros, like Kali Linux, use the Z Shell as their default shell.

Bash is one of the first programs that Linus Torvalds (the creator of Linux) ported to Linux.

Image Source

Something you should not get confused about is that Bash is also a programming language. So it's a "Shell", but you can also program behavior in Bash. For example:

#!/bin/bash
echo "Hello World"

Key points about Bash

• Most users use Bash, since it is the default shell environment on most systems
• Bash does not have an inline wildcard expression. A wildcard expression is when you would want to search for patterns in your Shell, similar to Regex. The three main wildcards are *, ?, and [].
• You can't automatically change the directory name
• # is treated as a comment in scripting
• It has shopt settings
• Prompt has backslash escapes
• User configuration settings are in .bashrc

The Z Shell

The Z Shell, or Zsh is also a UNIX shell that is very similar to Bash. You can also script and use the shell as a command interpreter.

Zsh is an extension of the Bourne shell with a lot of improvements. Zsh was released in 1990 by Paul Falstad, and it has some features that Bash, Korn Shell, and C Shell share.

macOS by default uses the Zsh Shell.

Image Source

Key points about Zsh

• Comes with autocompletion when using the terminal. So when you press Tab ↹ in order to autocomplete whatever command you want to run, not only does it autocomplete for you but will bring down a drop-down of all the other possible files and directories:

• Supports inline wildcard expressions
• Much more configurable than Bash
• Supports plugins and themes. Here's a list of plugins available for Zsh.

There are also frameworks built around the Z Shell. One of the most popular ones is Oh My Zsh, which is a community driven, open-source framework for managing Zsh configuration. (I use Oh My Zsh 😄)

Image Source

Zsh and Oh My Zsh are similar but not the same exact things. To reiterate, Oh My Zsh is a way of managing your Zsh configurations, it is not the Shell itself.

The Fish Shell

Fish is a UNIX shell environment with an emphasis on interactivity and usability. Unlike Zsh, Fish aims to give the user interactivity by default instead of trusting the user to implement their own configuration.

It was created by Axel Liljencrantz in 2005. Fish is considered to be an "exotic shell" due to the fact that it does not comply to the POSIX shell standards. [[Source](https://en.wikipedia.org/wiki/Fish_(Unix_shell)]

Image Source

Key points about Fish

• Fish has "search as you type" automatic suggestions based on your command history and the directory you are in. Similar to Bash's history search, Fish Shell's search history is always turned on. That way the user will be able to get interactive feedback when working in their terminal.

Image Source

• Fish also prefers features as commands rather than syntax. This makes features visible in terms of commands with options and help texts
• Since Fish by default comes with a lot of configurations already set, it is believed to be more beginner friendly than other sh options like Zsh.
• Fish's scripting language is different than Zsh and Bash. Zsh uses more aliases whereas Fish avoids using aliases in the scripting language.

If you were to just make scripts using basic commands such as, cd, cp, vim, ssh, and so on, you would not notice any difference in the way Fish and Bash's scripting languages work.

One of the biggest differences is when you try capturing output from a command. In Bash you may be used to this:

todays_date=$(date)
echo "Todays date is $todays_date"

Todays Date is Tue Dec 13 15:29:28 CST 2022

Whereas in Fish, capturing output works differently. The equivalent for Fish in scripting would look like this:

set date (date)
echo "Todays Date $date"

todays date is Tue Dec 13 21:35:03 UTC 2022

Conclusion

Bash, Z Shell, and Fish Shell all have their merits, along with some similarities. You can use each of them effectively in your work environment now that you know a bit more about them.

If you want something more configurable, you could use Zsh (or even install Oh My Zsh). If you want more of an interactive terminal experience without a lot of configuration, you could use Fish Shell. If you want the classic feel, you can just keep Bash.

It all really comes down to your preferences as a developer - so just choose the shell that works best for you.

Hope this helped you! Thank you for reading 🐚🐚🐚

First, they can help make you more productive. But not only that - you'll be able to have that productive setup you created for youself on any machine.

This article is an introduction on how to get started with dotfiles.

You'll learn what they are, how to locate them on your system, and how to create a couple of simple dotfiles. In addition I'll give you some suggestions and resources on how to customise your settings and expand your knowledge.

Let's get started!

What are dotfiles?

Many computer software programs store their configuration settings in plain, text-based files or directories.

Dotfiles are configuration files for various programs, and they help those programs manage their functionality.

What sets them apart from regular files and directories is their prefix.

Dotfiles are named that way because each file and directory starts with a dot (.)

On Unix based systems, dotfiles are hidden by the Operating System by default.

Examples of common dotfiles

Most programs store their configurations in your home directory by default.

Some common dotfiles that you may have heard of or used before are:

• If you use the Bash shell, you might have a .bash_profile and .bashrc file, both of which contain scripts that load each time you start a new terminal session and configure the shell.
• If you use the Zsh shell, which is the new default for MacOS, you would have (or would've created) a .zshrc file which configures and customises the shell.
• If you use the command line code editor Vim, you would store its configurations in a .vimrc file.
• After setting up and configuring Git on your local machine, you would have a .gitconfig file, which would contain all your information and settings.
• Many programs, instead of storing their configurations in your home directory, instead store them in the hidden .config directory (folder) on your system.

How to Find Dotfiles

In Finder, the root of your Home directory might look something like this:

But you've seen that computer systems have many more files stored which are hidden by default.

To view dotfiles in Finder, go to the root of your Home directory and hold down the keys Command Shift . and the same time.

You'll soon see a variety of dotfiles that either you created on your own or were created when you installed a piece of software.

To view dotfiles from the command line (which is where you'll use and interact with them the most), you again have to add some extra steps to your search.

The list command, ls, which lists all files and directories in the current directory, doesn't show dotfiles by default - despite the fact that they're there.

First, navigate to your home directory. You can use the cd command to help you get there, if you're not there already.

Then use the ls command with the -a flag, which stands for all, like so:

ls -a

If you want to see some extra bits of information about your files, you can also use the -l flag, which lists files and directories in long format and includes details about the date and time they were created, their size, and so on.

ls -la

In the output, you'll see all files and directories – inlcuding all hidden ones – in your currect home directory.

Each file and directory that starts with a period/dot is a dotfile.

Why Use Dotfiles?

Your dotfiles are personal to you.

You spend a sufficient amount of time fine-tuning your setup. You curate configurations and settings that best suit your workflow, aesthetic, and preferences. And you end up with a development environment that helps you, personally, be more productive.

What if after all that time you spent, you now have to switch to a new, different machine? Does that mean you have to start all over again from the beginning?

How would you remember the exact settings and commands you used?

Or what if you have a second machine and you want your set up to be exactly the same on both systems?

One of the main goals of developers is to automate repetitive tasks.

Creating a dotfile repository that is source-controlled and hosted on GitHub will save you time when you want to set up a new computer and install the exact same settings you created for your previous one.

That way all your settings and preferences can be reusable and consistent on other machines.

How to Create Dotfiles

How to set up a folder to hold your dotfiles

It's good practice to have all your dotfiles in their own folder.

For simplicity's sake, I'll show an example of how to create a folder at the root of your home directory. But you can add the folder wherever is more convenient for you.

Also, I'll be showing examples of how to create a .zshrc and .vimrc file, but similar ideas apply to any other dotfiles you create.

Navigate to your home directory (cd) and make a directory named dotfiles that will hold all your configuration files:

mkdir dotfiles

To create dotfiles, you use the touch command and pass the name(s) of the file(s) as the argument to the command. The filename(s) will have a preceding period.

To create a .zshrc and a .vimrc file in the dotfiles directory, do this:

touch ~/dotfiles/.zshrc  ~/dotfiles/.vimrc

If those files already exist on your system and you want to move them to the dotfiles directory, you can move them there using the mv command:

mv ~/.zshrc ~/dotfiles/

The first argument is the current path of the file – the tilde (~) stands for the home direcory. By default, most hidden confuguration files are located there.

The second argument is the path where you want to move the file to. In this case you want to move it to the the dotfiles directory that is located in the home directory.

You can do the same for the .vimrc file:

mv ~/.vimrc ~/dotfiles/

To view the files:

ls -a dotfiles 
.         ..     .vimrc    .zshrc

With those files in place you can then add all your preferred configurations there.

How to set up configurations

Below are some ideas that could help you start the configurations of the dotfiles you created.

How to personalise your Zsh prompt

After setting up the .zshrc file, anything added to that file will affect the customisation of your Zsh shell program.

Now could be the time to customise your shell prompt. This will be personal to your taste, but here are some resources to get you started:

• How to customize your zsh prompt like a pro
• Jazz up your zsh terminal in seven steps
• More ideas to customize the zsh prompt
• How to Customize the zsh Prompt in the macOS Terminal

How to customise Vim

After creating the .vimrc file, you can customise the command line text editor Vim. Here are a couple of resources to help you start that process:

• Vimrc Configuration Guide
• How to Make Vim Look Good: 5 Vim Customization Tips

What are aliases and functions

One way to improve your workflow and enhance your productivity, is to cut down the time it takes to type commands you use often. You can achieve that by creating shortcuts.

Aliases are shortcuts to terminal commands. They are a shorter version of a long command.

As a developer you'll use Git often, so it's a good idea to create Git aliases to help save time on long, repetitive Git commands. Have a read on some of the most helpful ones on this freeCodeCamp article.

Another way to save time is by simplifying processes.

You can combine two commands into one by creating an isolated behavior that does one specific job. You can do that by creating functions.

One helpful function to create is to combine the command for creating a new directory (mkdir) with the command to change directory (cd).

In this way, you will create a new folder and immediately change into it – all in one step.

The function to do so looks like this:

function mkcd() {
  mkdir -p "$@" && cd "$_";
}

To read up on Zsh, functions have a look at this article on Scripting OS X that covers both aliases and functions in Zsh.

You can add both aliases and functions to your .zshrc file or you can create separate .aliases and .functions dotfiles.

How to Symlink your Dotfiles

You may have noticed that none of the settings you added to the files in the dotfiles folder have any effect on your system.

A program's configuration files, as mentioned previously, are hidden and stored in the home directory by default. This is where the program will look for and read its settings from.

It's a good idea to symlink (or create a symbolic link -a pointer) the file in the dotfiles directory where you have stored your preferred settings alongside with other files you created, with the file in its default home directory.

It's like the file will be in two places at the same time!

The file will be in both the dotfiles directory and there will also be a 'copy' of it in the home directory.

To create a link, you use the ln (stands for link) command with the -s argument (which stands for symbolic).

Here's how to symlink the .zshrc and .vimrc files:

ln -s ~/dotfiles/.vimrc  ~/.vimrc
ln -s ~/dotfiles/.zshrc  ~/.zshrc

This will make the programs you use aware of where their configuration files are normally – back in the home directory.

ls -l ~/.zshrc 

lrwxr-xr-x  1 dionysialemonaki  staff  39 Oct 21 18:30 /Users/dionysialemonaki/.zshrc -> /Users/dionysialemonaki/dotfiles/.zshrc

Looking at the details of the .zshrc file, it shows that the file located in the home directory points to the file in the dotfiles directory. The -> indicates the symlink.

Symlinking all your dotfiles manually is a cumbersome process and can get tiring and repetitive quickly as you add more dotfiles to the folder.

To make the process easier, you can create a shell script that will automate calling ln -s on the dotfiles you create or use a utility for that job.

How to Version Control your Dotfiles

Having your files under version control will help you track all the changes you make to them over time, and will also allow you to share them on GitHub.

Make sure to change directory into the dotfiles directory (cd dotfiles).

Follow these steps to organise your files in a git repository:

1. Initialise the repository:

git init

2. Add all the files you've created so far:

git add .

3. Commit the changes and add a commit message:

git commit -m "Added dotfiles"

How to host your dotfiles on GitHub

Make sure you've signed into your GitHub account.

Then, create a new repository:

Give it a name add click "Create repository".

Next, in the command line, add:

git remote add origin url 

#where 'url',the GitHub url of the repository you previously created
#ending in .git

Finally,

git push -u origin main

And now you are able to share your dotfiles online!

Conclusion

And there you have it – you now know the basics of dotfiles! I hope you found this tutorial helpful.

Your dotfiles project will most likely follow you throughout your career and will grow the more you learn about dotfiles themselves. And it'll also change as you learn more about what you like and don't like regarding your workflow and development environment setting by lots of trial and error.

Thanks for reading!

When working on a project with multiple stages (development, staging, production), developers use the command firebase use to switch between projects. It’s very easy to run a command on the production environment instead of the development. This is very dangerous.

Command to switch between firebase project

Note: You can always find the latest script at my GitHub repository.

Normally, developers only work on the development project. They only switch to production in case of checking or doing a hotfix. There have been a few times when I forgot to switch back to the development project. I accidentally changed the database without thinking that it could impact the actual users.

Digging into the firebase CLI, I found that it uses configstore to manage local configuration. All config is saved in a JSON file and reads easily. I created a small script which is intended to show the firebase project name on shell prompt.

How to set it up

Bash

Add the following script to the end of ~/.bash_profile:

_Add script to ~/.bashprofile

Then run source ~/.bash_profile or open a new terminal window:

Firebase project name is displayed as dev-project, stage-project and prod-project

iTerm2 with oh-my-zsh

Oh-my-zsh is a popular open source framework for Zshell. I like it because it has many beautiful terminal themes and many useful plugins.

Here, I will make an example with the agnoster theme:
Edit ~/.oh-my-zsh/themes/agnoster.zsh-theme

Script for oh-my-zsh

and then add prompt_firebase to build_prompt functions:

_Change buildpromt function

For the final step, run source ~/.zshrc or open a new terminal window:

saas-cs-deploy-taguro-5c55e is displayed as last text in terminal prompt

I hope this can help you prevent the an unexpected (and bad) situation.

Note: You can always find the latest script at my GitHub repository.

Sometimes, using the default terminal sucks. You want to go out of the ordinary, to add life to the boring terminal and improve your productivity.

Z shell (Zsh) is a Unix shell built on top of bash (the default shell for macOS) with a large number of improvements.

In this walk-through, we will configure iTerm2 with ZSH and its dependencies. This is a no-brainer, and after this, you’ll ponder the reason for not discovering ZSH earlier. Well, since you’re here already, let’s kick-start this.

Keynotes

• Homebrew installation
• iTerm2 installation
• ZSH and Oh My ZSH installations
• Setting up the dependencies to create a beautiful terminal

Step 1: Install Homebrew

Homebrew is a free and open-source software package management system that simplifies the installation of software on Apple’s macOS.

Before installing Homebrew, we need to install the CLI tools for Xcode. Open your terminal and run the command:

xcode-select —-install

If you get an error, run xcode-select -r to reset xcode-select.

Then, install Homebrew.

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Step 2: Install iTerm2

iTerm2 is a replacement for terminal and the successor to iTerm. Most software engineers prefer iTerm2 over the default terminal that ships with macOS as a result of its cool features. You can integrate zsh into iTerm2 to increase productivity.

To install iTerm2, run the command:

brew cask install iterm2

Step 3: Install ZSH

Zsh is a shell designed for interactive use, although it is also a powerful scripting language.

By default, macOs ships with zsh located in/bin/zsh.

Let’s install zsh using brew and make iTerm2 use it.

brew install zsh

Step 4: Install Oh My Zsh

“Oh My Zsh is an open source, community-driven framework for managing your zsh configuration. It will not make you a 10x developer…but you might feel like one”

— Robby Russell

It runs on Zsh to provide cool features configurable within the ~/.zhrc config file. Install Oh My Zsh by running the command

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

Check the installed version

zsh --version

You can upgrade it to get the latest features it offers.

upgrade_oh_my_zsh

Restart iTerm2 to dive into the new experience of using Zsh. Welcome to the “Oh My Zsh” world ?.

That’s not all. Now, we will install the dependencies to get the best out of Zsh.

Step 5: Change the Default Theme

Oh My Zsh comes bundled with a lot of themes. The default theme is robbyrussell, but you can change it to any theme of your choice. In this scenario, I changed it to agnoster, an already pre-installed theme.

You then need to select this theme in your ~/.zshrc. To open the config file (.zshrc), run the command:

nano ~/.zshrc

Zsh theme set to agnoster

Or open the file in a text editor with

open ~/.zshrc

Set the zsh theme and update your changes

source ~/.zhrc

Using a Custom Theme

To install another theme not pre-installed, clone the repository into custom/themesdirectory. In this scenario, we’ll install powerlevel9k,

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

Then, select this theme in your ~/.zshrc

ZSH_THEME="powerlevel9k/powerlevel9k"

Update your changes by running the command source ~/.zshrc

Navigate to iTerm2 > Preferences > Profiles > Colors if you wish to change the background color of the terminal.

The selected theme in this scenario requires powerline fonts. So, let’s install that.

Step 6: Install Fonts

I will be using Inconsolata. Get your preferred font out of these powerline fonts. Then, download and install it.

Or download the entire font.

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

cd fonts

./install.sh

To change the font, navigate to iTerm2 > Preferences > Profiles > Text > Change Font.

Now, you can see Inconsolata listed as one of the fonts. Select your preferred font. For fonts that support ligatures like FiraCode, check the “Use ligatures” option to view your arrows and other operators in a stylish manner like ( → ).

Select a powerline font

Step 7: Install Color Scheme

Let’s change the color scheme to bring out the beauty of our terminal. Navigate to iTerm2-Color-Schemes and download the ZIP folder. Then, extract the downloaded folder cos what we need resides in the schemes folder.

Navigate to iTerm2 > Preferences > Profile > Colors > Color Presets > Import

• Navigate to the schemes folder and select your preferred color schemes to import them.
• Click on a specific color scheme to activate it. In this scenario, I activated Batman which is my preferred color scheme.

Tada! ? We’re done with the basic settings.

Batman color scheme

Step 8: Install Plugins

Oh My ZSH comes preloaded with a git plugin. To add more, for instance, docker, auto-suggestion, syntax highlighting and more:

• Clone the Git repository

git clone https://github.com/zsh-users/zsh-docker.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-docker

• Head over to .oh-my-zsh > custom > plugins directory to view the cloned directory. To access this, run the command open ~/.oh-my-zsh
• Add the plugin to the plugin section of the config file ~/.zshrc shown below
• Update your changes by running the command source ~/.zshrc

Step 9: Add Aliases

Aliases are shortcuts used to reduce the time spent on typing commands. Add aliases to commands you run in the section shown below.

Typing **dckimgs** executes docker images command

Thanks for reading.

If you know about other means of improving productivity using ZSH, you can drop them on the comment section, I will be glad to hear from you.

In this blog I’ll cover installing ITerm2, ZSH shell, “oh my ZSH”, Themes, ITerm2 color schemes, “oh my ZSH” plugins and enable “ligature” support to help create a beautiful and powerful Terminal.

If you want to just make your regular Bash Terminal powerful, take a look at my previous blog: “Jazz Up Your Bash Terminal”. But ZSH explained in this blog is more powerful stuff.

Summary:

We’ll be covering a lot of things. This may be confusing, so here is the summary of what we will be doing.

1. Install ITerm2 — This is a better alternative to the default Terminal
2. Install latest ZSH shell — This is more powerful than the regular bash shell. We will switch ITerm2 to use ZSH shell.
3. Install “Oh My ZSH “— This is a CLI tool to easily configure ZSH and add themes and plugins to ZSH
4. Add two types of Themes using “Oh My ZSH” — some themes need extra steps so we will cover both
5. Install different ITerm2 Schemes — These are just color schemes for the UI
6. Add two different Plugins using “Oh My ZSH” to improve productivity
7. Enable “ligature” support so when you write an arrow =>;, it appears like a real arrow →

Step 1— Install ITerm2

A lot of programmers like ITerm2 instead of the default Terminal. It is similar to the Terminal, but has lots of features of its own. It of course can run ZSH, Bash, and other shells inside it.

The following video shows some of the new features of Item 2 (v3).

For this blog we’ll use ITerm2. When I mention “Terminal”, I mean ITerm2. Although the steps are the same for both Terminal or ITerm2.

Step 2— Change Shell To ZSH

The following video shows why ZSH is better than just a bash shell.

Option 1 — Use Mac’s own ZSH:

Mac comes with a ZSH out-of-the-box, so we don’t need to install it. However, sometimes it’s an older version of ZSH. Typically it’s located at /bin/zsh. To use it, all we need to do is to change shell (chsh).

1. Open the Terminal (or ITerm2) and type the following command.

$ chsh -s $(which zsh)

2. Enter the password and it will change the shell, upon logout and login.

3. Logout and re-login

4. To test, open the Terminal and type the following, and it should say zsh.

$ echo $0
zsh //should return zsh

Option 2— Install Homebrew and Install latest ZSH via Homebrew

This option is pretty common among users, because some of the plugins only work with the latest ZSH.

Homebrew, simply said, is a command line installer for all sorts of software. Let’s install that first.

1. Install Homebrew by running the following command.

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

2. If you get Command Line Tools for Xcode error, it means you haven’t installed the CLI tools for Xcode. If you don’t get the error, you can skip this step, because you already have it installed.

XCode Developer CLI tools are used by various apps that manipulate core OSX features. So make sure to install the Xcode CLI tools by running the following command.

$ xcode-select —-install

Note: The above command opens up Mac’s installer and installs the XCode Developer CLI tools. If it doesn’t work, try _xcode-select -r_ to reset.

3. Install ZSH via Homebrew

Run the following command to install ZSH. It gets installed at /usr/local/bin/zsh PS: Mac’s default ZSH is at /bin/zsh

brew install zsh

4. Use the Homebrew version of ZSH

Run the following command. You will be prompted to enter Mac’s password.

chsh -s /usr/local/bin/zsh

5. Logout and log back in.

6. Test if we are using ZSH and the correct ZSH

$ echo $0
zsh   //correct

$ which zsh
/usr/local/bin/zsh   //correct

Step 3— “Oh My ZSH”

“Oh My ZSH” is a plugin that runs on top of ZSH. It provides default config for ZSH (~/.zhrc file) and also provides themes and more features.

From what I know, most power users who use ZSH also use “Oh My ZSH”.

1. Install “Oh My ZSH”

Run the following command to install “oh My ZSH”.

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

Oh My ZSH is installed

2. Close and quit ITerm2 and reopen it.

It should look something like below. Notice that the prompt has changed and the theme is a bit different — That’s “Oh My ZSH” in action for you.

Initial Oh My ZSH Theme

Step 4— Change Themes And Install Fonts

In this step, we’ll add two different “Oh My ZSH” Themes. “Oh My ZSH” comes with tons of themes. PS: But some Themes need extra steps like installing specific fonts and so on.

To set a Theme, simply open ~/.zshrc file (created by “Oh My ZSH”) and change the theme as shown below.

PS: .zshrc is the config file for ZSH shell. People who don’t use “Oh My ZSH” will have to manually create this file and add any configs themselves. “Oh My ZSH” automatically creates this file if it doesn’t exist and then adds its own set of configs into this file.

Theme 1 — Let’s add a Theme called “Avit”

1. Open .zshrc

$ open ~/.zshrc

2. Change the Theme to “Avit”

You can browse all the “Oh My ZSH” Themes here. To change the Theme, simply change the ZSH_THEME value in ~/.zshrc file from robbyrussell to Avit.

3. Update ZSH config

Run the following command to update the config.

$ source ~/.zshrc

Your command prompt in Avit Theme

4. Change the background color and font size

Open ITerm2 > Preferences > Profiles > Colors and change the background black color to use 20% gray as shown below.

Use 20% Gray background

Then open Text > Change Font and change the size to 14pt.

Change font to 14pt

A clean and beautiful Iterm2 with ZSH!

OK, Let’s install a different Theme that needs fonts.

Theme 2 — Installing “agnoster” Oh My ZSH theme

This is a popular theme because it emulates the Powerline Python app that enhances the terminal. The following picture shows how it looks. But this theme also needs us to install Powerline themes.

agnoster Oh My ZSH theme

1. Install Powerline fonts

$ git clone https://github.com/powerline/fonts.git
$ cd fonts
$ ./install.sh

2. Change the Theme to “agnoster”

$ open ~/.zshrc
Set ZSH_THEME="agnoster" and save the file

3. Quit ITerm2 and reopen it.

4. Set Powerline font

You can set any Powerline patched font you like. All the fonts end with “for Powerline”.

Open ITerm2 > Preferences > Profiles > Text > Change Font and set it to something that has “for Powerline”. I’m choosing “Meslo LG DZ for Powerline” font.

Meslo LG DZ for Powerline Iterm2 font

Note — If you are confused about the fonts and Themes: the Themes are for “Oh My ZSH” and ZSH shell and the fonts are for the Iterm2 itself.

5. All Done

At this point your Terminal should look like below:

Step 5 — Install iTerm2 “color schemes” (ITerm2 Themes)

There are plenty of gorgeous color schemes for iTerm2. These schemes change the foreground color, background color, cursor color, and so on. You can find them at iTerm2-color-schemes Github repo.

Note: These are just color schemes of the ITerm2 UI and don’t deal with the command prompt’s look and feel like “Oh My ZSH”’s themes (other than just changing colors).

Follow these steps to install them.

1. Download the iTerm2-color-schemes as a zip file and extract it
2. The “Schemes” folder contains all the color scheme files — they end with .itermcolors
3. Open iTerm2 > Preferences > Profile > Colors > Color Presets > Import
4. In the import window, navigate to the “Schemes” folder (from step 2)
5. Select all the files so you can import all the color schemes at once
6. Simply select whichever color scheme you like.

My favorites are Batman and Argonaut

Batman Iterm2 Theme

The Argonaut color scheme looks like below:

Argonaut color scheme

Step 6— Install Plugins

Plugins add more functionalities to your workflow. By default “Oh My ZSH” already has the “git” plugin! and that’s why you were able to see all those Git statuses in the prompts in earlier screenshots. Let’s add another one to see how it works.

Note: In this section, we’ll install two different plugins to show how they work.

Plugin 1 — Add Syntax Highlighting Plugin

The Syntax Highlighting plugin adds beautiful colors to the commands you are typing as shown below.

1. Clone the zsh-syntax-highlighting plugin’s repo and copy it to the “Oh My ZSH” plugins directory.

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

2. Activate the plugin in ~/.zshrc by adding `zsh-syntax-highlighting to the Plugins section as shown below.

Add a new plugin in a new line inside plugins section

3. Re-read zshrc configuration

source ~/.zshrc

Plugin 2 — Add ZSH-AutoSuggestion Plugin

This plugin auto suggests any of the previous commands. Pretty handy! To select the completion, simply press → key.

1. Install the plugin

git clone https://github.com/zsh-users/zsh-autosuggestions $ZSH_CUSTOM/plugins/zsh-autosuggestions

PS: ZSH_CUSTOM points to ~/.oh-my-zsh/custom

2. Open ~/.zshrc and add zsh-autosuggestions

Step 7 — Use Ligature Support

There are various fonts that help make operators like less than, double equals, right arrow, not equals, and so on look beautiful. For example, every time you type: =>, it becomes: →.

To use this, we need fonts that support ligatures. We also need to enable it in ITerm2. FiraCode is one such font. Follow the steps to install and enable ligatures.

1. Download the FiraCode repo and extract the zip file (or clone it)
2. Open the dstr > ttf folder and double click on all the *.ttf files and select the “Install font” button to install each of the font variations.
3. Navigate to ITerm2 | Preferences | Profiles | Text
4. Select **Use Ligatures**checkbox
5. Click on Change Font and select Fira Code Regular font

Summary

We have covered a lot in this blog starting from installing latest ZSH via Homebrew, Oh My ZSH, Plugins, Themes, enable “ligatures” for FiraCode font.

?? Thank you!

If this was useful, please click the clap ? button down below a few times to show your support! ⬇⬇⬇ ??

My Other Posts

https://medium.com/@rajaraodv/latest

ECMAScript 2015+

1. Check out these useful ECMAScript 2015 (ES6) tips and tricks
2. 5 JavaScript “Bad” Parts That Are Fixed In ES6
3. Is “Class” In ES6 The New “Bad” Part?

Terminal Improvements

1. How to Jazz Up Your Terminal — A Step By Step Guide With Pictures
2. Jazz Up Your “ZSH” Terminal In Seven Steps — A Visual Guide

WWW

1. A Fascinating And Messy History Of The Web And JavaScript

Virtual DOM

1. Inner Workings Of The Virtual DOM

React Performance

1. Two Quick Ways To Reduce React App’s Size In Production
2. Using Preact Instead Of React

Functional Programming

1. JavaScript Is Turing Complete — Explained
2. Functional Programming In JS — With Practical Examples (Part 1)
3. Functional Programming In JS — With Practical Examples (Part 2)
4. Why Redux Need Reducers To Be “Pure Functions”

WebPack

1. Webpack — The Confusing Parts
2. Webpack & Hot Module Replacement [HMR] (under-the-hood)
3. Webpack’s HMR And React-Hot-Loader — The Missing Manual

Draft.js

1. Why Draft.js And Why You Should Contribute
2. How Draft.js Represents Rich Text Data

React And Redux :

1. Step by Step Guide To Building React Redux Apps
2. A Guide For Building A React Redux CRUD App (3-page app)
3. Using Middlewares In React Redux Apps
4. Adding A Robust Form Validation To React Redux Apps
5. Securing React Redux Apps With JWT Tokens
6. Handling Transactional Emails In React Redux Apps
7. The Anatomy Of A React Redux App
8. Why Redux Need Reducers To Be “Pure Functions”
9. Two Quick Ways To Reduce React App’s Size In Production

If this was useful, please click the clap ? button below a few times to show your support! ⬇⬇⬇ ??

If you have questions, please feel free to ask me on Twitter: https://twitter.com/rajaraodv