O VS Code dispensa qualquer apresentação. Desde o seu lançamento, a ferramenta da Microsoft conquistou uma série de fãs ao redor do planeta. Seja você um desenvolvedor JavaScript, PHP ou Python, o VS Code é flexível o suficiente para agradar a todos os gostos.

Recentemente, ele tomou a liderança como o editor de código favorito dos programadores, ultrapassando concorrentes fortíssimos, tais como o Sublime Text, Atom (que agora também é da Microsoft, embora, de acordo com a empresa, seu desenvolvimento acontecerá de forma desconexa com o VS Code, fazendo com que as duas plataformas sejam concorrentes entre si – curioso, não?), Brackets e tantos outros.

Como citado anteriormente, o VS Code consegue se adaptar aos mais diversos gostos e formatos. Isso acontece porque a ferramenta possui mais de 400 configurações internas possíveis. Além disso, é expansível através das extensões. Para qualquer atividade que você queira fazer, tenho certeza que você encontrará uma extensão que se encaixe.

Mas neste artigo quero comentar um outro aspecto que não é exatamente uma configuração interna do VS Code e nem uma extensão. Aqui iremos explorar como utilizar a fonte Fira Code no editor.

Qual é o problema com as “fontes tradicionais”?

Nós, programadores, usamos muitos símbolos nos nossos programas, geralmente codificados com vários caracteres em sequência. Para o cérebro humano, sequências como: “=>“, “<=” ou: “=“, são tokens lógicos únicos, mesmo se eles pegarem dois ou três caracteres na tela.

Nosso olho gasta uma quantidade diferente de zero de energia para escanear, analisar e unir vários caracteres em um único e lógico. Idealmente, todas as linguagens de programação devem ser projetadas com símbolos Unicode completos para os operadores, mas esse não é o caso ainda.

A solução que você não conhecia mas não vai mais largar

O Fira Code é uma extensão da fonte Fira Mono que contém um conjunto de ligaduras para combinações de vários caracteres de programação comuns. Este é apenas um recurso de renderização de fonte: o código subjacente permanece compatível com ASCII. Isso ajuda a ler e entender o código mais rapidamente. Para algumas sequências frequentes como “..” ou “//“, as ligaduras nos permitem corrigir o espaçamento.

Veja nesta comparação como ela funciona:

Para termos em mente um exemplo mais prático, veja como as ligaturas fazem toda a diferença no código JavaScript a seguir:

Este é só um exemplo. Para códigos Ruby, PHP, Erlang, Elixir, Go, Swift e afins, ela funcionará da mesma forma. Ficou interessando? Então veremos como utilizá-la no VS Code.

Instalando no VS Code

É importante ressaltar que, apesar do foco do artigo ser o editor da Microsoft, a fonte Fire Code funciona em uma série de outros editores. Além disso, também é possível integrá-lo ao terminal. Tudo o que é necessário está muito bem documentado na página oficial do projeto, hospedada no GitHub. Minha recomendação é que você experimente primeiro no editor e, se achar realmente interessante, explore as demais possibilidades.

Dito isso, o primeiro passo será baixar a fonte para o seu computador. O link está disponível no site, mas para facilitar sua vida, basta clicar aqui (até o momento em que este artigo foi escrito, a versão mais recente é a 1.205). Este pacote é um zip que conterá uma série de formatos para a fonte.

Se estiver usando o Windows, separe a pasta chamada TTF; dentro dela, você encontrará as cinco fontes:

• FiraCode-Bold
• FiraCode-Light
• FiraCode-Medium
• FiraCode-Regular
• FiraCode-Retina

Instale todas elas na sua máquina. O jeito mais fácil é selecionando-as e clicando com o botão direito na opção “Instalar”, como mostra a figura a seguir:

Com ela instalada, precisamos dizer ao VS Code que queremos utilizá-la no nosso código. Para isso, abra o programa e entre nas configurações de usuário. Lá, insira as seguintes linhas:

"editor.fontFamily": "Fira Code",
"editor.fontLigatures": true

Salve as configurações e reinicie o seu VS Code. Caso não funcione, experimente fazer isso:

"editor.fontFamily": "'Fira Code'",
"editor.fontLigatures": true

Não se sabe porque, mas em algumas máquinas, só funciona quando o Fira Code está entre aspas simples. No meu caso, não tive este problema; só tive que reiniciar o VS Code que tudo funcionou como esperado.

Agora é só aproveitar!

Mais e mais dicas sobre o VS Code!

Aproveito a oportunidade para indicar o meu curso Performance Máxima com o VS Code. Lá dou dicas como estas sobre como aproveitar ao máximo o que a plataforma oferece a aumentar a sua produtividade.