Terminal com Oh My Zsh, Spaceship, Dracula e mais

Última atualização: 21 de novembro de 2023

Durante toda história da Rocketseat existem duas perguntas que as pessoas mais me fazem, o tema do meu VSCode (que é o Dracula) e as configurações do meu terminal de desenvolvimento.

Antes de mais nada, nesse post vou considerar que você esteja utilizando Unix (Mac ou Linux) já que no Windows fica bem inviável configurar o que eu menciono nesse post a não ser que você crie um subsistema Linux dentro dele.

A minha ideia com esse post é mostrar exatamente todas configurações que faço em meu terminal como tema, plugins, configurações, etc.

Instalando Zsh

Antes de conseguirmos iniciar com qualquer configuração precisamos instalar o Zsh. Como existem várias formas de instalação dependendo do sistema operacional que você está, leia esse guia: https://github.com/robbyrussell/oh-my-zsh/wiki/Installing-ZSH

Com o Zsh instalado deve ser possível você executar:

zsh --version

E receber algo como: zsh 5.9 (x86_64-apple-darwin22.0).

Fique pode dentro dos temas que usamos por aqui clicando aqui

Instalando Oh My Zsh

Para instalar o Oh My Zsh você precisa executar o comando abaixo (você deve ter o cURL instalado para executa-lo):

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

A partir de agora todas configurações que você quer fazer como adicionar variáveis ambientes ou configurar seu terminal de qualquer forma utilize o arquivo ~/.zshrc e não mais o ~/.bash_profile ou derivados.

Agora reiniciando seu terminal você deve ter algo diferente do convencional, parecido com isso:

Lembrando que a ainda vamos realizar configurações de cores, informações que aparecem em tela, etc.

Utilizando Dracula

Dracula é um padrão de cores disponível para muitas aplicações de desenvolvimento e hoje utilizo esse esquema em boa parte dos apps em que desenvolvo.

O Dracula está disponível para muitos terminais e você pode conferir todos aqui: https://draculatheme.com na seção "Terminal".

Se você estiver no Mac usando o Terminal padrão, provavelmente irá usar: https://draculatheme.com/terminal/

Se você estiver no Linux com uma distribuição que usa Gnome, vai utilizar: https://github.com/dracula/gnome-terminal

Tema Spaceship

Agora vamos instalar o tema Spaceship que vai modificar um pouco as informações que são exibidas no terminal, com ele podemos mostrar a versão do Node atual, do Docker, etc.

Instalando FiraCode

Antes de iniciar a configuração do Spaceship precisamos instalar a fonte Fira Code que possui diversos ícones dos quais são utilizados nesse tema. Baixe o zip da última versão da fonte disponível aqui: https://github.com/tonsky/FiraCode/releases

Descompacte o arquivo baixado e na pasta TTF copie os arquivos de fonte para as fontes do seu sistema (cada sistema operacional possui uma forma de fazer isso).

Depois disso será necessário configurar seu terminal com essa fonte, abaixo mostro uma imagem de como configurei no Mac:

Instalando Spaceship

Vamos começar clonando o repositório do Spaceship em nossa pasta de themes do Oh My Zsh (é necessário ter instalado o Git pra isso):

git clone https://github.com/spaceship-prompt/spaceship-prompt.git "$ZSH_CUSTOM/themes/spaceship-prompt" --depth=1

Agora vamos criar um link simbólico para o arquivo do tema do Spaceship na pasta dos temas do Oh My Zsh:

ln -s "$ZSH_CUSTOM/themes/spaceship-prompt/spaceship.zsh-theme" "$ZSH_CUSTOM/themes/spaceship.zsh-theme"

Agora dentro do arquivo ~/.zshrc vamos alterar a variável ZSH_THEME ficando dessa forma:

ZSH_THEME="spaceship"

Agora reinicie o terminal e você verá uma interface bem mais limpa, parecida com essa:

Configurações adicionais

A partir de agora você já finalizou todas instalações e tudo a partir de aqui são preferências minhas que gosto de utilizar em meu terminal, por isso fique à vontade para incluir/excluir qualquer item abaixo.

Configurando Spaceship

Por mais que seja muito interessante mostrar as versões do Node, Docker e outros itens no nosso terminal geralmente isso consome processamento e pode tornar mais lento o carregamento de pastas, por isso eu gosto de desabilitar a maioria dessas opções.

No fim do arquivo ~/.zshrc adiciono o seguinte conteúdo:

SPACESHIP_PROMPT_ORDER=(
  user          # Username section
  dir           # Current directory section
  host          # Hostname section
  git           # Git section (git_branch + git_status)
  hg            # Mercurial section (hg_branch  + hg_status)
  exec_time     # Execution time
  line_sep      # Line break
  vi_mode       # Vi-mode indicator
  jobs          # Background jobs indicator
  exit_code     # Exit code section
  char          # Prompt character
)
SPACESHIP_USER_SHOW=always
SPACESHIP_PROMPT_ADD_NEWLINE=false
SPACESHIP_CHAR_SYMBOL="❯"
SPACESHIP_CHAR_SUFFIX=" "

Plugins do ZSH

Utilizo alguns plugins bem legais para o Oh My Zsh que facilitam muito na hora de executar comandos comuns, realizar autocompletes, etc...

Para instalar plugins precisamos configurar o ZInit, ferramenta que facilita a instalação e remoção de plugins no Zsh.

bash -c "$(curl --fail --show-error --silent --location https://raw.githubusercontent.com/zdharma-continuum/zinit/HEAD/scripts/install.sh)"

Após essa instalação, vamos abrir o arquivo ~/.zshrc novamente e abaixo da linha ### End of ZInit's installer chunk que foi adicionada automaticamente no arquivo, adicionamos:

zinit light zdharma/fast-syntax-highlighting
zinit light zsh-users/zsh-autosuggestions
zinit light zsh-users/zsh-completions

Esses são os plugins que utilizo e abaixo explico como funciona cada um deles:

• zdharma/fast-syntax-highlighting: Adiciona syntax highlighting na hora da escrita de comandos que facilita principalmente em reconhecer comandos que foram digitados de forma incorreta;
• zsh-users/zsh-autosuggestions: Sugere comandos baseados no histórico de execução conforme você vai digitando;
• zsh-users/zsh-completions: Adiciona milhares de completitions para ferramentas comuns como Yarn, Homebrew, NVM, Node, etc, para você precisar apenas apertar TAB para completar comandos;

Terminal no VSCode

Se, assim como eu, você utiliza o VSCode pode adicionar a seguinte configuração abaixo para utilizar o Oh My Zsh no terminal integrado:

"terminal.integrated.shell.osx": "/bin/zsh"

Concluindo

Pronto, se você configurou todos passos acima então seu terminal deve estar exatamente igual o meu assim como mostro nas aulas :)

Meu arquivo ~/.zshrc com todas opções acima está disponível em: https://gist.github.com/diego3g/b0513d5ff6d9d983c48bed3fd8f10cdb