Customize your mac and VS code terminal-EASY!

So back in the day, I used to have my terminal all pimped out when I was running Ubuntu. Today, I decided to customize my terminal in my Mac.

Note, I'm not an expert at all playing with the terminal but after googling and playing around I got my terminal looking as the following:

1) The first thing to do is opening the "Go to Folder" by pressing
shift + command + G

Inside of the input box enter the following: ~/.bash_profile

If for any reason it says the file doesn't exist or something like that, don't panic.

1a) Let's create a .bash_profile file

Open your terminal and type:

nano ~/.bash_profile

-We have created/open our .bash_profile file

Add the Git branch name to your terminal

# Git Branch

parse_git_branch() {
   git branch 2> /dev/null | sed -e '/^[^*]/d' -e 's/* \(.*\)/ (\1)/'
}

export PS1="\u@\h \W\[\033[32m\]\$(parse_git_branch)\[\033[00m\] $ "

Restart your terminal and test inside of a folder that has a git repo

Add Color to your folders

# Add Color to Folders

export PS1="\[\033[36m\]\u\[\033[m\]@\[\033[32m\]\h:\[\033[33;1m\]\w\[\033[m\]\$ "
export CLICOLOR=1
export LSCOLORS=ExFxBxDxCxegedabagacad
alias ls='ls -GFh'

Restart your terminal and test inside of a folder that has a git repo

Note: At this point you will notice that you don't see your git branch anymore. This has to do with something related with the PS1 variable.

Note 2: If you just want to show color in your folder, then you can remove the code for the Git branch. If you want to only show the git branch name, you can remove the the color folder code.

But I want Colors and the branch name!! 😡

So yep, that's what I wanted. I wanted to be able to have colors in my folders and see the branch name while inside of a folder with a repo.

I don't know if this is the optimal solution but I had to combine everything in one variable (like I said, I'm not an expert on terminal stuff and I'm trying to setup my mac asap)

This is how the combine line will look like:

export PS1="\[\033[36m\]\u\[\033[m\]@\[\033[32m\]\h:\[\033[33;1m\]\w\[\033[m\]\[\033[32m\]\$(parse_git_branch)\[\033[00m\]$ "

Final code:

# Git Branch

parse_git_branch() {
   git branch 2> /dev/null | sed -e '/^[^*]/d' -e 's/* \(.*\)/ (\1)/'
}

#export PS1="\u@\h \W\[\033[32m\]\$(parse_git_branch)\[\033[00m\] $ "

# Folder Color

export PS1="\[\033[36m\]\u\[\033[m\]@\[\033[32m\]\h:\[\033[33;1m\]\w\[\033[m\]\[\033[32m\]\$(parse_git_branch)\[\033[00m\]$ "
export CLICOLOR=1
export LSCOLORS=ExFxBxDxCxegedabagacad
alias ls='ls -GFh'

Restart your terminal and test

More Customization

Go to Terminal->Preferences

then look at the image below. Everything inside of the red squares is what I changed.

Note: Inside of the background property, when you click on it, you will see an opacity option. This option is the one that makes your terminal have a transparency effect. Mine is set to 60%.

Change case sensitive auto-complete

I hope you have noticed that in your terminal when you want to navigate lets say to the Documents folder and use tab to auto complete the name, the name of your folder is case sensitive. Meaning if the name is in capital letters, you have write it that way. With the following command you can write it with lowercase letters if you want.

echo "set completion-ignore-case On" >> ~/.inputrc

Add Emoji To Your Computer Name (HostName)

Get your emoji from here: https://emojipedia.org/

sudo scutil --set HostName paste-emoji-here

sudo scutil --set HostName 🔥

You don't have to enter an emoji. You can write whatever you want to display.

Restart your terminal

Test on VS Code

Open your terminal in VS Code and voila! It's working here too.

Resources

http://osxdaily.com/2013/02/05/improve-terminal-appearance-mac-os-x/
http://osxdaily.com/2006/12/11/how-to-customize-your-terminal-prompt/
http://blog.nickburwell.com/blog/2008/11/mac-os-x-terminal-case-insensitive-auto/
https://emojipedia.org/