[Pt-Br] VS Code - As melhores extensÔes para desenvolvedores JavaScript

Hello folks! Este é o primeiro post do blog, então vou compartilhar algumas dicas de extensÔes que utilizo no Visual Studio Code que me auxiliam demais no desenvolvimento de interfaces.

Para quem não sabe, o Vscode é um editor de código da Microsoft e uma alternativa gratuita ao Sublime Text e o Atom. O editor nos permite inserir extensÔes que nos auxiliam durante o processo de desenvolvimento.

Vou compartilhar com vocĂȘs os meus preferidos e espero que ajude vocĂȘ a usar essa ferramenta da melhor maneira possĂ­vel!

ExtensÔes

  1. JavaScript (ES6) code snippets
    Umas das melhores extensÔes com snippets para trabalhar com JavaScript ES6. Possui suporte as linguagens: JavaScript (.js), TypeScript (.ts), React (.jsx), TypeScript React (.tsx), Html (.html), Vue (.vue)

  2. NPM Intellisense
    Uma Ăłtima extensĂŁo que faz o autocomplete dos mĂłdulos do npm na hora de importar no seu cĂłdigo.

  3. ES7 React/Redux/GraphQL/React-Native snippets
    Extensão indispensåvel para quem trabalha no ecossistema do React! Snippets para React/Redux e GraphQL com suporte também ao TypeScript.

  4. ESLint
    Extensão que analisa o seu código e te auxilia a seguir padrÔes e guidelines na hora de escrever Javascript. Indispensåvel!

  5. EditorConfig
    ExtensĂŁo que auxilia vocĂȘ e a sua equipe a seguirem a mesma configuração no editor de cĂłdigo, como por exemplo “tabs” ou “spaces”, “single” ou “double quotes”. Ótimo para quando vocĂȘ trabalha com desenvolvedores que utilizam editores diferentes. Esta extensĂŁo tambĂ©m estĂĄ disponĂ­vel para o Sublime Text e Atom.

  6. Babel JavaScript
    ExtensĂŁo que fornece um suporte mais completo para se trabalhar com React, JSX, Flow e GraphQL.

  7. Debugger for Chrome
    ExtensĂŁo que ajuda a debuggar seu cĂłdigo javascript direto do editor.

  8. Code Metrics
    Extensão que mede a complexidade do seu código Javascript/Typescript. Quanto maior a nota, mais complexo o código é. Sempre é bom tomar cuidado para não fazer abstraçÔes em excesso.

  9. GitLens
    ExtensĂŁo que mostra quais foram as pessoas que fizeram as Ășltimas alteraçÔes no arquivo e na respectiva linha. Muito Ăștil quando precisamos tirar dĂșvidas ou saber quem foi o ator do delito.

  10. Prettier — Code formatter
    Uma das extensĂ”es mais utilizadas no Visual Studio Code. Ela ajuda vocĂȘ a formatar o seu cĂłdigo para que ele fique melhor identado e legĂ­vel.

  11. Path Intellisense
    Ficou na dĂșvida do nome do arquivo ou do caminho que ele se encontra na hora de importar no seu cĂłdigo? EntĂŁo essa extensĂŁo Ă© para vocĂȘ! Ela te auxilia exatamente nesses pontos, para que vocĂȘ nĂŁo perca tempo procurando onde estĂŁo os arquivos.

  12. Import Cost
    Extensão que mostra o tamanho do módulo importado no seu código. Ótimo para vermos onde podemos melhorar a performace da nossa aplicação.

E foram essas as extensÔes que utilizo no dia-a-dia e que espero que facilitem o seu trabalho como desenvolvedor Javascript.