Nos últimos anos, o VS Code tem sido o queridinho de grande parte dos desenvolvedores. Você também faz parte dessa galera? Por quê? Conta para gente na sessão de comentários! 😀
Caso você seja da turma da resistência e ainda não tenha se rendido ou nem pense em se render ao poder de fogo do editor da Microsoft, comente também e deixe seu ponto de vista, gostaria de entender mais sobre a sua preferência.
Caso você queira saber mais sobre o que é o VS Code ou ainda outros editores, recomendo a leitura deste artigo explicando sobre qual editor você deve usar segundo desenvolvedores.
Sem enrolação, vamos direto ao assunto que são as melhores extensões para o VS Code, o software open source comprado em 2016 pela Microsoft:
Quokka
O Quokka.js é um playground de prototipagem rápida para JavaScript e TypeScript no seu VS Code, com acesso aos arquivos do seu projeto, relatórios embutidos, cobertura de código e formatação avançada de saída.
Os valores de tempo de execução são atualizados e exibidos no seu IDE ao lado do seu código, enquanto você digita.
Em outras palavras, enquanto você digita, os resultados aparecem em tempo real diretamente no VS Code.
Para ter acesso às melhores funcionalidades do Quokka, existe a versão paga. Quer saber mais? Acesse a página oficial da extensão.
Beautify
Pode parecer meio fútil no começo, mas acredite, essa extensão funciona que é uma beleza!
De forma prática, a Beautify faz a identação de seu código padronizando a formatação de forma legível e, por que não dizer, bonita como o próprio nome sugere.
Se você ainda não tem a Beautify instalado, instale-a por aqui.
Live Server
Essa extensão é praticamente obrigatória para você que curte o ambiente de front-end.
Com o Live Server, é possível fazer alterações no editor de código, alternar para o navegador e atualizar para ver as alterações sem se perder alternando entre janelas.
De forma ainda mais simples de explicar, digamos que o seu navegador é atualizado automaticamente sempre que você faz alguma alteração de código.
Além disso, também executa seu aplicativo em servidor localhost. Como há algumas coisas que você só pode testar ao executar seu aplicativo ao vivo num servidor, portanto, esse é um benefício interessante e justifica o nome da extensão :).
Saiba mais sobre o Live Server.
Javascript (ES6) Code Snippets
Nem preciso dizer que o JavaScript é a base do desenvolvimento web. Então, só por isso, já é justificável a instalação desta extensão.
Chega de cansar seus dedos digitando um caminhão de códigos de forma desnecessária sendo que o JavaScript (ES6) Code Snippets é capaz de fornecer trechos de código JavaScript, TypeScript, Vue, React e HTML de forma prática e simples.
Nem vou me extender muito, considero mais uma extensão obrigatória para quem é desenvolvedor front-end.
Faça a instalação aqui.
ESLint
Não vou perder muito tempo explicando essa, poucas palavras são suficientes: ESLint basicamente verifica seu código quanto a erros comuns e permite que você saiba onde está o bug no próprio editor.
É como um x-9 virtual que está validando seu código enquanto você o escreve e denuncia seus erros.
Pode instalá-lo por aqui.
Tem interesse em aprender mais sobre o ESLint? Veja essa sequência de artigos completa sobre linting com ESLint.
Paste JSON as Code
Essa extensão para o VS Code permite converter rapidamente dados de JSON para JavaScript, TypeScript, Python, Go, Ruby, Swift, Elm e outras linguagens.
Sim, é isso mesmo, ela permite colar JSON como código diretamente no VSCode.
Acesse aqui para instalar essa maravilha.
Remote – Containers
O Docker popularizou o conceito de contêineres para outro nível, permitindo que devs como você desenvolvam sem queimar muita massa cinzenta com a parte mais sistêmica.
E para dar uma mãozinha nesse assunto, o Remote – Containers veio para ajudar permitindo o empacotamento de todos os arquivos necessários para executar um novo programa em um “contêiner” possibilitando aos usuários uma execução sem problemas e sem precisar instalar nenhuma dependência. E tudo isso diretamente via VS Code.
Para instalar a extensão, só acessar aqui.
GitLens
Apesar de o VS Code já possuir integração nativa com o Git, o Git Lens é uma extensão poderosa que proporciona algumas coisinhas a mais dentro do VS Code.
Na minha opinião, é uma das extensões mais úteis para o VS Code ajudando você que trabalha junto de outras pessoas no mesmo repositório. Histórico, alterações recentes, autoria de código, informações gerais e pesquisa de confirmação são alguns dos melhores recursos desta extensão.
Saiba mais aqui.
Debugger for Chrome
O próprio nome já entrega o que faz esta extensão, basicamente, o Debugger for Chrome é uma extensão Visual Studio Code que serve para debugar JavaScript de forma simples e rápida no Chrome ao marcar breakpoints diretamente dentro do editor.
Confira mais sobre a extensão aqui.
Markdown All in One
Markdown All in One é uma extensão que eu gosto muito como produtor de conteúdo e serve para escrever Markdown usando o VS Code.
É uma extensão completa e vem com recursos funcionais como visualização ao vivo e destaque de sintaxe.
Por que não escrever suas documentações, documentos e tudo mais, diretamente no Visual Studio Code?
Além disso, a extensão em si é altamente personalizável e muito bem documentada.
Saiba mais sobre a extensão aqui.
Bookmarks
Viu um erro no seu código mas não irá corrigir nesse momento? Então a extensão Bookmarks pode ser a ideal para você.
Você pode marcar essa linha, que ficará armazenada em uma pasta que une todas as suas marcações.
Ela ajuda a navegar em seu código, movendo-se entre posições importantes com facilidade e rapidez. Não há mais necessidade de pesquisar o código.
Ele também suporta um conjunto de comandos de seleção, o que permite selecionar linhas marcadas e regiões entre essas linhas. É muito útil para análise de arquivos de log.
Você pode entender melhor sobre Bookmarks aqui.
Settings Sync
A extensão Settings Sync é ótima, pois com ela você pode sincronizar configurações, trechos, temas, ícones de arquivos, inicialização, atalhos de teclado, espaços de trabalho e extensões em várias máquinas usando GitHub Gist.
Leia mais sobre ela aqui.
Essas foram as 12 melhores extensões para VS Code, mas gostaria de deixar claro que as extensões que eu escolhi refletem uma opinião pessoal minha, não são verdades imutáveis.
Caso você tenha preferência por alguma extensão não citada, deixe seu comentário para eu experimentar o que você anda usando no seu VS Code!