11 de agosto de 2020 · 3 min de leitura
Extensões super hiper legais para VSCode
Aumentando sua produtividade e qualidade de código com extensões para VSCode.
Introdução
Fala gurizada, esse é meu primeiro post e já começamos com estilo, aqui vai algumas dicas hiper legais para os devs de plantão.
Atualmente não podemos falar de produtividade ao codar sem citarmos editores de código, e o VSCode não deixa duvida que é o cara certo para isso. Nativamente ele já possui algumas ferramentas que facilitam muito a vida na hora do desenvolvimento, mas existem também uma infinidade de extensões para aumentarmos ainda mais nossa produtividade.
Code Snippets
Code Snippets são "atalhos" que geram instruções e blocos de código extensos e comuns no dia a dia.
Falando sério, não há nada mais delicinha que snippets, e existem váááários deles no VSCode, para qualquer tipo de linguagem e gosto.
Os principais que eu poderia citar para o universo Front-end são:
Para desenvolvimento:
Para testes:
Live Server
Essa extensão é mágica e facilita muito projetos "vanilla", sem nenhum framework nem nada do tipo. O que ela faz é iniciar um servidor de desenvolvimento com reload de página automático, ou seja, ao modificar um arquivo do seu projeto a extensão já atualiza seu navegador sozinha! Diga adeus aos infinitos F5.
Produtividade
Essas extensões são feras quando o quesito é melhorar nossa produtividade!
Better Comments
Essa extensão ajuda a criar alguns comentários mais amigáveis no nosso código, podemos até categorizar nossas anotações, bacana né?
Live Share
Cara, essa extensão é mágica, sério! Ela te permite trabalhar em conjunto num mesmo projeto simultaneamente! E o mais bacana é que você acompanha em tempo real as alterações do seu colega. Agora da para acompanhar as gambiarras ao vivo.
Prettier
O que essa extensão faz é formatar seu código, podendo seguir um padrão pré definido. Ela ajuda demais em projetos com Lint, fica a dica!
Live Sass Compiler
Essa extensão faz automaticamente a compilação/transpilação de arquivos SASS/SCSS em tempo real e funciona super bem com o Live Server!
Menções honrosas
Algumas extensões não couberam em nenhum tópico acima, mas ainda sim são super delicinhas e valem a pena dar uma conferida:
Git Blame
Essa extensão serve para quem desenvolve em código compartilhado com outros devs, ao colocar o cursor em uma linha do código, a extensão mostra qual desenvolvedor fez ou alterou aquela linha. Assim fica mais fácil dar nos dedos.
Rainbow Brackets
O que essa extensão faz é destacar os parênteses, chaves e colchetes, deixando mais visível onde cada um se inicia e finaliza, assim evitando confusão.
Auto Rename Tag
Essa extensão nos ajuda a alterar algum trecho de código HTML, ao modificar o início de uma tag a extensão altera automaticamente seu fechamento, e vice-versa.
Conclusão
Esses pequenos problemas que as extensões resolvem fazem uma baita diferença no nosso dia a dia, seja automatizando algo repetitivo ou nos ajudando a executar uma tarefa específica. Contar com um editor de código mais inteligente nos ajuda a ser mais eficientes.
E ai? Curtiram o post? Fique a vontade para expressar sua opinião na área de comentários! E caso ficou faltando alguma extensão maneira, compartilha com noix nos comentários! O universo agradece!
Por hoje é só, aquele abraço!