VSCode | O "diferentão" e o "Igualzão"

No passado, num dos bootcamps que estava fazendo, percebi que o mestre usava um "diferentão" e um "igualzão" no código dele. E ficava muito legal. Então fui atrás para descobrir como é que o doutor fazia aquilo.

Quando estamos programando em Javascript, normalmente precisamos comparar os valores de duas variáveis. Se é preciso comparar só o valor, usamos dois sinais. Para ver se são iguais usamos "==", para diferentes "!=".

Em muitos casos, porém, precisamos comparar não só os valores das variáveis mas, também o tipo das mesmas, se são strings, int, float, etc.... Nestes casos acrescentamos mais um sinal de "=" para verificar valores e tipos. Para igualdade "===" e para diferença "!==".

É daí que saiu a expressão "diferentão" e "igualzão". Utilizando uma propriedade chamada "Font Ligatures", dentro do JSON de configuração do VSCode, podemos alterar a forma como visualizamos estes sinais na tela. Veja como fica:

Para alterar estas propriedades foi preciso instalar a fonte "Fira Code", que pode ser baixado no link no final do artigo. Depois de instalada, você clica:

1 - Naquela roldana de engrenagem no canto inferior do VSCode;

2 - Em Configurações (Settings);

3 - Depois em Editor de Texto (Text Editor);

4 - Clica em Fonte (Font);

5 - Depois, no meio da tela, em "Edit in settings.json";

6 - Daí, substitua o conteúdo do arquivo json pelos valores abaixo e salve:

{
    "workbench.colorTheme": "Monokai",
    "workbench.iconTheme": "material-icon-theme",
    "editor.fontWeight": "500",
    "editor.fontSize":16,
    "editor.lineHeight":24,
    "editor.fontFamily":"Fira Code",
    "editor.fontLigatures":true,
}

Perceba que no código acima também se altera o tema do editor para Monokai e o tema dos ícones, que são os que eu prefiro e é exibido na imagem no final do artigo. Se desejar manter seu tema preferido, altere apenas as linhas abaixo:

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

Segue abaixo o link para a baixar a fonte Fira Code e a imagem do meu VSCode com as alterações acima, mais as alterações do meu outro artigo "VSCode | Extensões para aumentar a produtividade".

Fonte Fira Code

Imagem do VSCode com todas as customizações:

Tenho sentido muito mais prazer ao programar deixando a IDE do jeito que mais me agrada. Espero que você também encontre a sua configuração ideal. Não existe certo e errado. O que realmente importa é que nos impulsione para o próximo nível.

#portugolnoprezinho