Extensões de código VS úteis para desenvolvedores de JavaScript

Publicamos recentemente a tradução de um artigo sobre extensões de código VS úteis para desenvolvedores Python. É a vez do JavaScript!



Da última vez, os leitores compartilharam seus favoritos nos comentários. Esperamos que hoje nós também possamos coletar uma excelente coleção de extensões úteis do VS Code para JavaScript.


Eu uso o PyCharm Pro e o WebStorm, um IDE da Jetbrains há vários anos . Como esses produtos não são baratos, toda vez que eu os recomendo, as pessoas sugerem que eu mude para o VS Code, já que este editor é gratuito e bacana ao mesmo tempo. Depois de várias discussões no Reddit, prometi testar o VS Code em algumas semanas.



Entre as vantagens importantes do VS Code (além, é claro, do custo "de graça"): a capacidade de customizar e o ecossistema de plugins. Eu queria tirar o máximo proveito do teste, por isso precisava de plug-ins. Novamente no Reddit fui avisado de um grande número de extensões diferentes, e hoje gostaria de falar sobre plug-ins para VS Code que gostei especialmente.







Apesar de minhas experiências com o VS Code, continuo trabalhando com meus amados PyCharm e WebStorm, conforme me acostumei com eles ao longo dos anos. Seu custo é totalmente justificado pelo valor e qualidade. Dito isso, o VS Code me surpreendeu agradavelmente: é uma ferramenta muito simples e rápida.



ESLint







ESLint é sem dúvida uma das extensões mais populares entre os desenvolvedores JS. Ele aplica regras ESLint no código e exibe o resultado no editor. Isso permite que você identifique e corrija rapidamente as violações das regras. ESLint será útil para todos os desenvolvedores JS, pois ajuda a melhorar o desempenho e a qualidade do código.



Baixar ESLint



Mais bonita







Prettier é uma ferramenta de formatação de código opinativa que se integra ao VS Code, Visual Studio, Atom, Vim, Sublime Text e outros editores. Uma pequena extensão útil para ajudá-lo a formatar seu código, recuar seu código e destacar palavras-chave para tornar o código mais fácil de ler.



Claro, esses recursos úteis irão reduzir o trabalho de formatação e, portanto, aumentar nossa produtividade. Graças a Prettier, a legibilidade do código será muito alta.



Baixar mais bonito



Quokka.js







A extensão Quokka.js fornece prototipagem JavaScript rápida no editor de código VS. É uma sandbox em tempo real para desenvolvedores de JavaScript e TypeScript. Quokka.js é frequentemente referido como o notebook moderno para desenvolvedores de JavaScript.



Você já quis testar algo rápido e acabou usando o console do navegador? Ou você executa node



-process no terminal e tenta lá? O principal objetivo desta extensão é executar o código de forma rápida e conveniente diretamente no editor de código do VS.



Baixe Quokka.js



Cliente REST







O Cliente REST é uma extensão do VS Code que permite enviar solicitações HTTP e ver a resposta certa no VS Code.



Este é o Postman para VS Code, mas convenientemente integrado ao editor de código.



O cliente REST oferece suporte a APIs REST e GraphQL.



Baixar cliente REST



Debugger para Chrome







Depurar o JavaScript pode ser frustrante. O Chrome e outros navegadores oferecem ótimas ferramentas para ajudá-lo a começar.



No entanto, muitas vezes não são fáceis de trabalhar. Além disso, tais ferramentas não são muito convenientes, especialmente ao usar frameworks e muitas bibliotecas.



Debugger for Chrome é uma extensão desenvolvida pela Microsoft que ajuda você a depurar facilmente seu código para cada pequena alteração.



O console de extensão é agradavelmente surpreendente com seu poder, especialmente quando você precisa descobrir em qual linha e função ocorreu um erro. Você pode até rastrear o processamento de dados.



Execute o código no Chrome e depure-o no editor de código.



Baixe o Debugger para Chrome



Live Server







O Live Server permite que você execute um servidor de desenvolvimento local com funcionalidade live-reload para páginas estáticas e dinâmicas. Isso não é muito relevante para aqueles que trabalham com estruturas que já configuraram o live-reload, como React. No entanto, se você trabalha com outras bibliotecas ou conteúdo estático, esta extensão certamente será útil para você.



Baixar Live Server



Live Share







Esta é uma ferramenta incrível! Não tenho certeza se existe algo assim para WebStorm. Com o Live Share, você pode compartilhar seu editor de código com outras pessoas. É perfeito para a programação em pares, especialmente agora que a maioria das pessoas ainda está trabalhando remotamente devido à pandemia.



Experimentei e gostei!



Baixe o Live Share



Snippets de código JavaScript (ES6)







Como você provavelmente notou, quase todas as extensões nesta lista são aprimoramentos de desempenho e os trechos de código JavaScript (ES6) não são exceção.



O nome fala por si! Esta extensão ajudará a aumentar a velocidade de codificação, trabalhando com um conjunto predefinido de snippets. Os snippets podem ser personalizados de acordo com nossas preferências instalando pacotes pré-fabricados ou criando o nosso próprio.



Baixar trechos de código JavaScript (ES6)



Babel JavaScript







O JavaScript evoluiu muito ultimamente. Um grande número de estruturas e bibliotecas apareceu, por exemplo, React, Flow, GraphQL e, como resultado, muitas novas maneiras de projetar código.



O Babel JavaScript permite que você trabalhe com a sintaxe JavaScript mais recente, bem como com as bibliotecas listadas acima. A extensão oferece ao editor JavaScript as versões de sintaxe mais recentes e bonitas.



Baixar Babel JavaScript



Um escuro profissional







Os desenvolvedores passam muito tempo em um editor de código, por isso é especialmente importante que estejamos felizes com sua aparência e estética. One Dark Pro é um tema para VS Code que deixa o editor mais bonito, como estou acostumado.



Baixe o One Dark Pro



Resultado



Depois de experimentar o VS Code, fiquei agradavelmente surpreso ao perceber como ele é rápido e confiável.



Ao personalizá-lo com extensões, também pude sentir como ele é poderoso.



Por ser um dos editores de código mais populares do mercado (se não o mais popular), existe uma enorme comunidade de criação de ferramentas e extensões para torná-lo ainda melhor. Isso é o que eu sempre gostei nos produtos Jetbrains e o que eu gosto no VS Code agora.



VS Code é uma ótima escolha para qualquer desenvolvedor. Eu recomendo! No entanto, WebStorm e PyCharm ainda têm um lugar especial em meu coração.



Obrigado por ler este artigo!



All Articles