por rajaraodv

Nesta publicação, vou mostrar os passos para adicionar temas, Powerline, fontes e powerline-gitstatus para tornar seu terminal convencional do Bash útil e bonito, como na imagem inicial.

Se você estiver usando um Mac, precisará passar por muitos obstáculos para fazer isso funcionar, pois muitas das instruções são para o Linux ou estão desatualizadas. Então, eu pensei em escrever sobre isso - espero que ajude você.

Observações:

1. Siga os passos cuidadosamente, pois qualquer equivoco causará muita dor de cabeça.

2. Isso vale para o MacOS e para o Bash regular no Terminal.app. Não estou abrangendo o ZSH ou o Hyper neste artigo – pretendo escrever artigos diferentes para eles.

3. Minhas versões: Mac High Sierra; versão do git 2.14.3 (Apple Git-98); Python 2.7.10

Certo, quando você tem um Mac novo, por padrão, seu Terminal.app será parecido com algo como a imagem abaixo. Então, vamos em frente e adicionar temas, fontes e assim por diante.

Passo 1 — Adicionar um novo tema

O primeiro passo óbvio é aprimorar o tema. O Terminal não fornece todos os temas legais e sofisticados que você vê outros desenvolvedores usarem. Vamos baixar um tema e adicioná-lo ao Terminal.

Neste blog, vou adicionar o tema Solarized-Dark ao Terminal.

Observação: você pode baixar vários temas (.terminal files) deste repositório git. Basta abrir o arquivo  *.terminal  para instalá-lo, ou seja, clicar com o botão direito em *.terminal file > "Open with" > terminal.

1. Vá para http://ethanschoonover.com/solarized (texto em inglês)
2. Role o mouse até o tema (solarized.zip)
3. Extraia o arquivo solarized.zip
4. Abra a pasta  osx-terminal.app-colors-solarized . Esta pasta contém o tema para o terminal.
5. Clique duas vezes no arquivo "Solarized Dark ansi.terminal"  — Este arquivo é o tema específico para Terminal.app. Observação: caso você receba um aviso de que o arquivo é de um desenvolvedor não identificado, clique com o botão direito do mouse no arquivo e selecione Open with > Terminal.
6. Nesse momento, você já está com o tema instalado no terminal. Agora é necessário, apenas, torná-lo o tema padrão.
7. Abra o Terminal > Preferences > Text, selecione o tema  "Solarized Dark …" e clique em "Default".

De agora em diante, seu terminal se parecerá como o da imagem abaixo.

Passo 2 — Instalar o Powerline

Powerline é uma aplicação do Python e é um plug-in de linha de status para o vim que fornece linhas de status e prompts para vários outros aplicativos, incluindo zsh, bash, tmux, IPython, Awesome e Qtile.

Ele faz com que o prompt do terminal se pareça como abaixo.

2.1 Instalar Python

Devido ao fato de o Powerline ser uma aplicação do Python, é necessário ter o Python instalado, bem como uma versão apropriada do Python.

• O MacOS já vem com Python instalado. Assegure-se de que a versão do Python seja, pelo menos, a 2.7.x digitando python -V no terminal.
• Caso não seja a versão 2.7, instale o Homebrew, que permite instalar vários softwares de CLI (interface de comandos de linha), executando:/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
• Execute brew install python para instalar a última versão do Python via Homebrew

2.2 Instalar o pip — Um gerenciador de pacotes para Python (similar ao npm)

Instale o pip executando o seguinte comando:

$ sudo easy_install pip

2.3 Instalar ferramentas de desenvolvedor para a CLI do XCode

As ferramentas de desenvolvedor para a CLI do XCode são usadas pelo Powerline e outras aplicações que que manipulam os principais recursos do OSX. Portanto, certifique-se de instalar as ferramentas da CLI do XCode executando o comando a seguir.

$ xcode-select —-install

Observação: o comando acima abre o instalador do Mac e instala as ferramentas do desenvolvedor para CLI da  XCode. Caso não funcione, tente: xcode-select -r para resetar.

2.4 Instalar o Powerline

Finalmente, instale o Powerline (versão estável) com o pip executando o seguinte comando:

$ pip install --user powerline-status

Caso você queira instalar a última branch desenvolvida, execute o seguinte:

$ pip install --user git+git://github.com/powerline/powerline  //dev

2.5 Adicionar o Powerline daemon ao bash

Agora, é preciso adicionar o Powerline daemon ao bash para que ele possa monitorar o prompt do Terminal e fazer alterações.

2.5.1 Copie o local de instalação do Powerline

Você pode encontrar o local da instalação do Powerline executando o seguinte comando: pip show powerline-status. Copie o valor do campo Location.

2.5.2 Adicionar o daemon no local adequado para o .bash_profile

1. Certifique-se de que você tem o arquivo .bash_profile no seu diretório raiz. Caso ele não exista, prossiga criando o arquivo digitando o comando: cd ~ && touch ~/.bash_profile

2. Abra o .bash_profile  e adicione o seguinte comando:

export PATH=$PATH:$HOME/Library/Python/2.7/bin
powerline-daemon -q
POWERLINE_BASH_CONTINUATION=1
POWERLINE_BASH_SELECT=1
. /Users/rupa/Library/Python/2.7/lib/python/site-packages/powerline/bindings/bash/powerline.sh

Nota: o caminho /Users/rupa/Library/Python/2.7/lib/python/site-packages/ vem do passo anterior (2.5.1). Altere-o para se adequar ao caminho do seu computador.

2.5.3. Reinicie o Terminal

Feche completamente o terminal, se estiver aberto: (Terminal > Quit Terminal). Inicie o terminal novamente.

Você deve poder usar $ source ~/.bash_profile para atualizar as configurações. Porém, recebe algo estranho como "o powerline-config está sem um arquivo!" Normalmente, você recebe esse erro se não tiver $HOME/Library/Python/2.7/bin em seu PATH.

2.5.4 Seu novo terminal

Seu novo terminal, agora, deve se parecer com a figura abaixo. Deve estar usando o tema "Solarized Dark ansi"  e deve mostrar o Powerline no prompt de comando. Mas observe que também existe um caractere "?" ! Isso ocorre porque o Powerline usa vários ícones e fontes que não estão disponíveis por padrão. Então, precisamos instalar as fontes.

Passo 3 — Instalar as fontes do Powerline

Para instalar as fontes do Powerline, acesse: https://github.com/powerline/fonts. Lá, você verá diversas pastas. Cada uma é uma fonte, também conhecidas como "Fontes corrigidas" ("Patched fonts").

São chamadas de “Fontes corrigidas” porque as pessoas usaram fontes regulares e adicionaram a elas, ou corrigiram nelas, ícones e fontes específicos do Powerline.

3.1 Baixar o repositório inteiro e descompactá-lo

• Clique no botão "Clone or download" e baixe todo o repositório para experimentar várias fontes.
• Descompacte o fonts-master.zip

3.2 Instalar algumas fontes

Vamos abrir a pasta de fontes Meslo dotted. Ficará como abaixo. Você verá diversos arquivos .ttf. Cada um deles é uma fonte, mas alguns são a versão em "negrito" da fonte, alguns são a versão "regular" e assim por diante.

Basta clicar duas vezes no arquivo .ttf e pressionar "Install font" para instalar a fonte em seu computador.

Para o nosso caso, vamos instalar "Meslo LG L DZ Regular for Powerline.ttf" e "Meslo LG L DZ Italic for Powerline.ttf". Isso adicionará uma versão regular e uma versão itálica da fonte Meslo.

3.3 Selecione a fonte no tema do Terminal

Você lembra que adicionamos o tema "Solarized Dark" no passo 1? Não havia nenhuma fonte ali e o MacOS tem uma fonte padrão. Tudo o que precisamos fazer é definir nossa fonte Meslo dotted para este tema e pronto!

1. Abra Terminal > Preferences > Text
2. Selecione o tema  Solarized Dark ansi
3. Clique no botão "Font" - Isso abre a caixa de diálogo "Fonts"
4. Na caixa de diálogo "Fonts", selecione "Meslo LG L DZ for Powerline" na Família e também selecione o tamanho da fonte 14 (para facilitar a leitura).

3.4 Reiniciar o terminal

Feche completamente o terminal (Terminal > Quit Terminal) e reabra-o novamente.

Passo 4 — Adicionando informações do Git ao prompt

Para exibir vários status do Git no prompt, precisamos instalar o  powerline-gitstatus, que é um complemento simples para o Powerline que adiciona várias cores e temas para exibir várias informações de status do git.

4.1 Instalar o powerline-gitstatus

pip install --user powerline-gitstatus

Observação: o comando "—user" é necessário para instalá-lo no perfil do usuário.

4.2 Adicionar esquema de cores powerline-gitstatus ao Powerline

4.2.1 Abra a pasta colorschemes/shell/default.json

${powerline-install-directory}/powerline/config_files/colorschemes/shell/default.json

//For example:
/Users/rupa/Library/Python/2.7/lib/python/site-packages/powerline/config_files/colorschemes/shell/default.json

4.2.2 Adicione as cores abaixo:

Conforme é mencionado no arquivo readme do powerline-gitstatus. Apenas copie as cores dentro de "groups" e acrescente-as ao default.json, conforme mostrado abaixo.

Aqui estão meus esquemas de cores do default.json (que você pode copiar e colar):

{
	"name": "Default color scheme for shell prompts",
	"groups": {
		"hostname": {
			"fg": "brightyellow",
			"bg": "mediumorange",
			"attrs": []
		},
		"environment": {
			"fg": "white",
			"bg": "darkestgreen",
			"attrs": []
		},
		"mode": {
			"fg": "darkestgreen",
			"bg": "brightgreen",
			"attrs": ["bold"]
		},
		"attached_clients": {
			"fg": "white",
			"bg": "darkestgreen",
			"attrs": []
		},

		"gitstatus": {
			"fg": "gray8",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_branch": {
			"fg": "gray8",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_branch_clean": {
			"fg": "green",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_branch_dirty": {
			"fg": "gray8",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_branch_detached": {
			"fg": "mediumpurple",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_tag": {
			"fg": "darkcyan",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_behind": {
			"fg": "gray10",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_ahead": {
			"fg": "gray10",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_staged": {
			"fg": "green",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_unmerged": {
			"fg": "brightred",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_changed": {
			"fg": "mediumorange",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_untracked": {
			"fg": "brightestorange",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus_stashed": {
			"fg": "darkblue",
			"bg": "gray2",
			"attrs": []
		},
		"gitstatus:divider": {
			"fg": "gray8",
			"bg": "gray2",
			"attrs": []
		}
	},
	"mode_translations": {
		"vicmd": {
			"groups": {
				"mode": {
					"fg": "darkestcyan",
					"bg": "white",
					"attrs": ["bold"]
				}
			}
		}
	}
}

4.3 Ativar o tema

4.3.1 Abra o arquivo do tema do default.json

${powerline-install-directory}/powerline/config_files/themes/shell/default.json

//For example:
/Users/rupa/Library/Python/2.7/lib/python/site-packages/powerline/config_files/themes/shell/default.json

4.3.2 Adicione o seguinte ao default.json

{
    "function": "powerline_gitstatus.gitstatus",
    "priority": 40
}

Abaixo está o tema default.json do meu Powerline (você pode copiar e colar isso):

Observação: eu removi tudo da seção "direita" e também removi o número da tarefa, ou "job number" ("jobnum"), para manter tudo limpo. Caso contrário, você veria um pequeno artefato na borda direita do prompt.

{
	"segments": {
		"left": [{
				"function": "powerline.segments.shell.mode"
			},
			{
				"function": "powerline.segments.common.net.hostname",
				"priority": 10
			},
			{
				"function": "powerline.segments.common.env.user",
				"priority": 30
			},
			{
				"function": "powerline.segments.shell.cwd",
				"priority": 10
			}, {
				"function": "powerline_gitstatus.gitstatus",
				"priority": 40
			}
		],
		"right": []
	}
}

4.4 Reiniciar o Daemon

Salve o arquivo e execute o seguinte comando no terminal: powerline-daemon —-replace.

Observação importante: toda vez que você fizer alterações na configuração do Powerline, além de reiniciar o Terminal, você também precisará reiniciar o daemon para ver as alterações refletidas executando: powerline-daemon —-replace.

4.5 Reiniciar o terminal

Feche o terminal (Terminal > Quit Terminal) e inicie novamente.

Neste ponto, estamos com tudo pronto! Aí está! Se você abrir o Terminal e navegar para qualquer repositório git e colocar em funcionamento, ele deve se parecer com o seguinte:

Aqui é como se parece com o tema Solarized-Light:

Aqui é como se parece com o tema Cobalt2:

Obrigado!

Caso tenha dúvidas ou questões, pergunte-me no Twitter: https://twitter.com/rajaraodv

Outras publicações do autor:

(os links abaixo são para as publicações originais em inglês)

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?

Melhorias para o terminal

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

Desempenho no React

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

Programação funcional

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 e 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

Se essa publicação foi útil para você, compartilhe! Obrigado!

Neste artigo, tratarei da instalação do ITerm2, do ZSH shell, do "oh my ZSH", do Themes, dos esquemas de cores do ITerm2, dos plug-ins do "oh my ZSH" e sobre como habilitar o suporte à "ligadura tipográfica" para ajudar a criar um terminal lindo e poderoso.

Observação: se quiser simplesmente tornar seu Terminal do Bash poderoso, dê uma olhada no meu artigo anterior: "Jazz Up Your Bash Terminal" ("Turbine seu terminal do bash", em inglês). Porém, o ZSH explicado neste artigo é mais poderoso ainda.

Sumário:

Trataremos de muita coisa. Isso pode acabar confuso, então deixo aqui um sumário do que faremos.

1. Instalar o ITerm2 — Ele é uma alternativa melhor ao Terminal padrão
2. Instalar o shell do ZSH mais recente — Ele é mais poderoso do que o shell do bash padrão. Faremos com que o ITerm2 use o shell do ZSH.
3. Instalar o "Oh My ZSH" — Esta é uma ferramenta de CLI para configurar facilmente o ZSH e adicionar temas e plug-ins ao ZSH
4. Adicionar dois tipos de temas usando o "Oh My ZSH" — alguns temas precisam de etapas adicionais, por isso trataremos de ambos
5. Instalar esquemas diferentes do ITerm2 — Estes são apenas esquemas de cores para a UI
6. Adicionar dois plug-ins diferentes usando o "Oh My ZSH" para melhorara produtividade
7. Ativar o suporte à "ligadura tipográfica" para quando, por exemplo, você escrever uma seta =>, ela se pareça de fato com uma seta →

Etapa 1— Instalar o ITerm2

Vários programadores preferem o ITerm2 ao Terminal padrão. Ele é parecido com o Terminal, mas tem vários recursos próprios. Ele, logicamente, pode rodar o ZSH, o Bash e outros shells dentro dele.

Para este artigo, usaremos o ITerm2. Quando eu mencionar “Terminal”, pense sempre no ITerm2, embora os passos sejam os mesmos para os dois.

Etapa 2 — Alterar o Shell para o ZSH

Opção 1 — Usar o ZSH do próprio Mac:

O Mac vem com um ZSH de fábrica. Assim, nem é preciso instalá-lo. No entanto, em algumas situações, ele é uma versão antiga do ZSH. Tipicamente, ele está localizado em /bin/zsh. Para usá-lo, tudo o que é preciso fazer é mudar o shell (com o comando chsh).

1. Abra o Terminal (ou o ITerm2) e digite o seguinte comando.

$ chsh -s $(which zsh)

2. Insira a senha e ele mudará o shell, depois de sair e fazer o login novamente.

3. Saia e faça o login novamente.

4. Para testar, abra o Terminal e digite o seguinte (o resultado deve ser zsh):

$ echo $0
zsh //o retorno deve ser 'zsh'

Opção 2— Instalar o Homebrew e a versão mais recente do ZSH pelo Homebrew

Essa é uma opção bem comum entre os usuários, pois alguns dos plug-ins só funcionam com a versão mais recente do ZSH.

O Homebrew, dito de modo simplificado, é um instalador de linha de comando para todos os tipos de software. Vamos instalá-lo primeiro.

1. Instale o Homebrew executando o comando a seguir.

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

2. Se você receber o erro "Command Line Tools for Xcode", significa que você não instalou as ferramentas de CLI para o Xcode. Se não receber esse erro, pode pular essa etapa, pois elas já estão instaladas.

As ferramentas de CLI de desenvolvedor do XCode são usadas por vários apps que manipulam recursos centrais do OSX. Assim, não se esqueça de instalar as ferramentas de CLI do Xcode CLI executando o comando abaixo.

$ xcode-select —-install

Observação: esse comando abrirá o instalador do Mac e instalará as ferramentas de CLI de desenvolvedor do XCode. Se não funcionar, experimente xcode-select -r para reiniciar.

3. Instale o ZSH pelo Homebrew

Execute o seguinte comando para instalar o ZSH. Ele é instalado em /usr/local/bin/zsh

Importante: o ZSH padrão do Mac está em /bin/zsh

brew install zsh

4. Use a versão do Homebrew do ZSH

Execute o seguinte comando. Será pedido que você insira a senha do Mac.

chsh -s /usr/local/bin/zsh

5. Saia e faça o login novamente.

6. Teste se está usando o ZSH e se o ZSH é o correto

$ echo $0
zsh   //correto

$ which zsh
/usr/local/bin/zsh   //correto

Etapa 3 — "Oh My ZSH"

O "Oh My ZSH" é um plug-in que roda sobre o ZSH. Ele fornece a configuração padrão para o ZSH (arquivo ~/.zhrc), além de temas e mais recursos.

Até onde eu sei, a maioria dos power users que utilizam o ZSH também usam o "Oh My ZSH".

1. Instale o "Oh My ZSH"

Execute o comando a seguir para instalar o "oh My ZSH".

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

2. Feche e saia do ITerm2 e reabra-o.

Ele deve estar com a aparência similar ao que vemos abaixo. Observe que o prompt mudou e que o tema é um pouco diferente — Esse é o "Oh My ZSH" em ação para você.

Etapa 4 — Alterar os temas e instalar as fontes

Nesta etapa, adicionaremos temas diferentes do "Oh My ZSH". O "Oh My ZSH" vem com milhares de temas. Alguns temas, no entanto, precisam de etapas adicionais, como instalar certas fontes e assim por diante.

Para definir um tema, simplesmente abra o arquivo ~/.zshrc (criado pelo "Oh My ZSH") e altere o tema conforme mostramos abaixo.

Observação: o .zshrc é o arquivo de configuração para o shell do ZSH. Aqueles que não usam o "Oh My ZSH" terão que criar manualmente este arquivo e adicionar as configurações por conta própria. O "Oh My ZSH" cria automaticamente este arquivo se ele ainda não existir e adiciona seu próprio conjunto de configurações a esse arquivo.

Tema 1 — Vamos adicionar um tema chamado "Avit"

1. Abra o .zshrc

$ open ~/.zshrc

2. Altere o tema para o "Avit"

Você pode visualizar todos os temas do "Oh My ZSH" aqui. Para mudar o tema, altere o valor de ZSH_THEME no arquivo ~/.zshrc de robbyrussell para Avit.

3. Atualize a configuração do ZSH

Execute o seguinte comando para atualizar a configuração.

$ source ~/.zshrc

4. Altere a cor de fundo e o tamanho da fonte

Abra ITerm2 > Preferences > Profiles > Colors e mude a cor de fundo de Black para 20% Gray, conforme vemos abaixo.

Em seguida, abra Text > Change Font e altere o tamanho para 14pt.

OK, agora vamos instalar um tema diferente que precisa das fontes.

Tema 2 — Instalar o tema "agnoster" do Oh My ZSH

Este é um tema popular, pois simula o app Powerline do Python, que melhora o terminal. A imagem abaixo dá uma ideia de sua aparência. Este tema, porém, também precisa que instalemos temas do Powerline.

1. Instale as fontes Powerline

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

2. Altere o tema para o "agnoster"

$ open ~/.zshrc
// Defina ZSH_THEME="agnoster" e salve o arquivo

3. Saia do ITerm2 e abra-o novamente.

4. Defina a fonte Powerline

Você pode definir qualquer fonte Powerline que desejar. Todas elas terminam com "for Powerline".

Abra ITerm2 > Preferences > Profiles > Text > Change Font e defina a fonte como alguma das que tenha o final "for Powerline". Aqui, selecionei a fonte "Meslo LG DZ for Powerline".

Observação: se estiver confuso sobre fontes e temas, os temas são para o "Oh My ZSH" e para o shell do ZSH e as fontes são para o próprio Iterm2.

5. Tudo pronto

Neste momento, seu Terminal deve ter a seguinte aparência:

Etapa 5 — Instalar os "esquemas de cores" do iTerm2 (temas do ITerm2)

Existem vários esquemas de cores lindos para o iTerm2. Esses esquemas alteram a cor do primeiro plano, a cor de fundo, a cor do cursor e assim por diante. Você pode encontrá-los no repositório iTerm2-color-schemes do Github.

Observação: esses são apenas esquemas de cores para a UI do ITerm2, não mexendo com a aparência geral do prompt de comando, como os temas do "Oh My ZSH" (eles somente alteram as cores).

Siga essas etapas para instalá-los.

1. Baixe iTerm2-color-schemes como um arquivo zip e extraia-o
2. A pasta "Schemes" contém todos os arquivos de esquemas de cores — eles terminam com .itermcolors
3. Abra iTerm2 > Preferences > Profile > Colors > Color Presets > Import
4. Na janela de importação, navegue até a pasta "Schemes" (do passo 2)
5. Selecione todos os arquivos para poder importar todos os esquemas de cores ao mesmo tempo
6. Simplesmente selecione aquele esquema de cores que você preferir.

Meus favoritos são Batman e Argonaut

O esquema de cores Argonaut tem a seguinte aparência:

Etapa 6 — Instalar plug-ins

Os plug-ins adicionam mais funcionalidades ao seu fluxo de trabalho. Por padrão, o "Oh My ZSH" já tem o plug-in "git"! É por isso que você pode ver todos os status do Git nos prompts nas telas anteriores. Vamos adicionar outro plug-in para ver como funciona.

Observação: nesta seção, instalaremos dois plug-ins diferentes para mostrar como eles funcionam.

Plug-in 1 — Adicionar o plug-in de realce de sintaxe

O plug-in Syntax Highlighting (Realce de sintaxe) adiciona cores lindas aos comandos que você digitar, conforme vemos abaixo.

1. Faça a clonagem do repositório do plug-in zsh-syntax-highlighting e copie-o para o diretório de plug-ins do "Oh My ZSH".

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

2. Ative o plug-in no arquivo ~/.zshrc adicionando zsh-syntax-highlighting a seção plugins, conforme mostramos abaixo.

3. Faça a releitura a configuração zshrc com "source"

source ~/.zshrc

Plug-in 2 — Adicione o plug-in ZSH-AutoSuggestion

Este plug-in faz a autossugestão de qualquer um dos comandos anteriores. Muito útil! Para selecionar a sugestão, apenas pressione a tecla → .

1. Instale o plug-in

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

Observação: ZSH_CUSTOM aponta para ~/.oh-my-zsh/custom

2. Abra o arquivo ~/.zshrc e adicione zsh-autosuggestions

Etapa 7 — Use o suporte à ligadura tipográfica

Há várias fontes que auxiliam a fazer com que os operadores, como menor que, duplo igual, seta para direita, não igual e outros tenham uma bela aparência. Por exemplo, sempre que você digitar =>, ele se tornará →.

Para usar isso, precisamos de fontes que deem suporte a ligaduras tipográficas. Também precisamos habilitar esse recurso no ITerm2. A FiraCode é uma dessas fontes. Siga esses passos para instalar a fonte e habilitar as ligaduras tipográficas.

1. Baixe o repositório da FiraCode e extraia o arquivo zip (ou faça a clonagem do repositório)
2. Abra a pasta dstr > ttf e clique duas vezes em todos os arquivos *.ttf e selecione o botão "Install font" para instalar cada uma das variações de fonte.
3. Navegue até ITerm2 | Preferences | Profiles | Text
4. Marque a caixa de seleção Use Ligatures
5. Clique em Change Font e selecione a fonte Fira Code Regular

Em resumo

Tratamos de muitas coisas neste artigo, começando da instalação do ZSH mais recente pelo Homebrew, passando pelo Oh My ZSH, plug-ins, temas e ativação das "ligaduras tipográficas" para a fonte FiraCode.

Obrigado!

Outras publicações do autor no Medium e no freeCodeCamp (em inglês)

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?

Melhorias do terminal

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

Desempenho do React

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

Programação funcional

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] (por debaixo dos panos)
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 e Redux:

1. Step by Step Guide To Building React Redux Apps
2. A Guide For Building A React Redux CRUD App (app de 3 páginas)
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

Se achou este artigo útil, agradeça ao autor ou mande mensagem para ele pelo Twitter para demonstrar seu apoio.

Se tiver perguntas, o autor também encoraja a perguntá-las a ele pelo Twitter: https://twitter.com/rajaraodv

Às vezes, usar o terminal padrão é terrível. É quando você deseja sair do lugar comum, colocar um pouco de vida no tedioso terminal e melhorar a sua produtividade.

O Z shell (Zsh) é um shell do Unix construído sobre o bash (o shell padrão para o macOS) com uma grande quantidade de melhorias.

Neste guia, vamos configurar o iTerm2 com o ZSH e suas dependências. É bem fácil e, depois disso, você vai se perguntar como não descobriu o ZSH antes. Bem, como você chegou até aqui, vamos logo começar.

Pontos importantes

• Instalação do Homebrew
• Instalação do iTerm2
• Instalações do ZSH e do Oh My ZSH
• Configuração das dependências para criar um terminal lindo

Passo 1: Instalação do Homebrew

O Homebrew é um sistema de gerenciamento de pacotes gratuito e de código aberto que simplifica a instalação de software no macOS da Apple.

Antes de instalar o Homebrew, precisamos instalar as ferramentas de CLI (interface de linha de comando para o Xcode. Abra seu terminal e execute o comando:

xcode-select —-install

Se receber uma mensagem de erro, execute xcode-select -r para reiniciar o xcode-select.

Em seguida, instale o Homebrew.

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

Passo 2: Instalação do iTerm2

O iTerm2 é um substituto do terminal e é o sucessor do iTerm. A maioria dos engenheiros de software prefere o iTerm2 ao terminal padrão que vem com o macOS em função dos ótimos recursos que ele traz. Você pode integrar o zsh no iTerm2 para melhorar a produtividade.

Para instalar o iTerm2, execute o comando:

brew cask install iterm2

Passo 3: Instalalação do ZSH

O Zsh é um shell projetado para o uso interativo, mas também é uma linguagem de script poderosa.

Por padrão, o macOs vem com o zsh localizado em /bin/zsh.

Vamos instalar o zsh usando o Homebrew e fazer com que o iTerm2 o utilize.

brew install zsh

Passo 4: Instalação do Oh My Zsh

“O Oh My Zsh é um framework de código aberto e orientado à comunidade para o gerenciamento de sua configuração do zsh. Ele não tornará você 10x mais desenvolvedor… mas fará com que você se sinta assim.”

— Robby Russell

Ele roda no Zsh para fornecer recursos configuráveis no arquivo de configuração ~/.zhrc. Instale o Oh My Zsh executando o comando:

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

Verifique a versão instalada:

zsh --version

Você pode atualizá-la para obter os recursos mais recentes que ele oferece.

upgrade_oh_my_zsh

Reinicie o iTerm2 para mergulhar na nova experiência de uso do Zsh. Boas vindas ao mundo de “Oh My Zsh”.

Mas isso não é tudo. Agora, vamos instalar as dependências para obter o que há de melhor no Zsh.

Passo 5: Alteração do tema padrão

O Oh My Zsh já vem com vários temas. O tema padrão é o robbyrussell, mas você pode mudá-lo para qualquer tema de sua preferência. Neste cenário, eu mudei o tema para o agnoster, um tema já pré-instalado.

Você, então, precisa selecionar esse tema no seu ~/.zshrc. Para abrir o arquivo de configuração (.zshrc), execute o comando:

nano ~/.zshrc

Como alternativa, abra o arquivo no editor de texto com

open ~/.zshrc

Defina o tema do zsh e atualize suas mudanças

source ~/.zhrc

Como utilizar um tema personalizado

Para instalar outro tema que não tenha vindo pré-instalado, faça a clonagem do repositório no diretório custom/themes. Neste cenário, instalamos o powerlevel9k,

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

Em seguida, selecione este tema no seu ~/.zshrc

ZSH_THEME="powerlevel9k/powerlevel9k"

Atualize as mudanças executando o comando source ~/.zshrc

Navegue até iTerm2 > Preferences > Profiles > Colors se quiser alterar a cor de fundo do terminal.

O tema selecionado neste cenário precisa das fontes powerline. Assim, vamos instalá-las.

Passo 6: Instalação das fontes

Usarei a fonte Inconsolata. Escolha sua fonte preferida entre essas fontes powerline. Em seguida, baixe-as e instale-as.

Como opção, baixe a fonte inteira.

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

cd fonts

./install.sh

Para mudar a fonte, navegue até iTerm2 > Preferences > Profiles > Text > Change Font.

Agora, você pode ver a Inconsolata listada como uma das fontes. Selecione sua fonte preferida. Para fontes que dão suporte a ligaduras tipográficas, como a FiraCode, marque a opção “Use ligatures” para ver suas setas e outros operadores de modo estiloso, como (→).

Passo 7: Instalação do esquema de cores

Vamos mudar o esquema de cores para levar um pouco de beleza ao nosso terminal. Navegue até iTerm2-Color-Schemes e baixe o arquivo ZIP. Em seguida, extraia a pasta que você baixou, já que precisamos do que está na pasta de esquemas.

Navegue até iTerm2 > Preferences > Profile > Colors > Color Presets > Import

• Navegue até a pasta de esquemas (schemes) e selecione seus esquemas de cor preferidos para importá-los.
• Clique em um esquema de cor específico para ativá-lo. Neste cenário, ativei Batman, meu esquema de cores preferido.

Pronto! Terminamos as configurações básicas.

Passo 8: Instalação dos plug-ins

O Oh My ZSH vem com um plug-in do git pré-carregado. Para adicionar mais, por exemplo, o docker, sugestão automática, realce de sintaxe e muito mais:

• Faça a clonagem do repositório do Git

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

• Acesse o diretório .oh-my-zsh > custom > plugins para ver o diretório clonado. Para acessá-lo, execute o comando open ~/.oh-my-zsh
• Adicione o plug-in à seção de plug-ins do arquivo de configuração ~/.zshrc, mostrada abaixo
• Atualize suas mudanças executando o comando source ~/.zshrc

Passo 9: Adição de aliases

Os aliases são atalhos usados para reduzir o tempo gasto em digitar comandos. Adicione aliases aos comandos que você executa na seção mostrada abaixo.

Obrigado pela leitura.

Se souber de outros modos de melhorar a produtividade usando o ZSH, mande-os pela seção de comentários. O autor ficará muito satisfeito de receber um feedback.