Revisão: o 6 Melhor IDEs JavaScript

JavaScript é usado para muitos tipos diferentes de aplicações hoje. Na maioria das vezes, JavaScript trabalha com HTML5 e CSS para construir front-ends web. Mas JavaScript também ajuda a construir aplicações móveis, e ele encontrou um lugar importante na parte de trás na forma de nó.servidores js. Felizmente, ferramentas de desenvolvimento JavaScript-editores e IDEs—estão subindo para enfrentar os novos desafios.

Por que usar um IDE em vez de um editor? A principal razão é que um IDE pode depurar e às vezes traçar o seu código., O IDEs também tem suporte para sistemas ALM, integrando-se com os tipos de Git, GitHub, Mercurial, Subversion e Perforce para o controle de versões. Mas à medida que mais editores adicionam Ganchos a esses sistemas, o suporte ALM está se tornando menos diferenciador.

Eclipse 2018 with JavaScript Development Tools

Back in the ancient days when Java Swing was new and exciting, I enjoyed using Eclipse for Java development, but soon moved on to other Java IDEs. Há mais de cinco anos, quando fiz um desenvolvimento Android com o Eclipse, achei a experiência boa, mas estranha., Quando eu tentei usar Eclipse Luna com JSDT para o desenvolvimento JavaScript em 2014, ele constantemente exibia erros falsos-positivos para o código válido que passou JSHint.

felizmente, vários fornecedores e projetos de código aberto têm subido para a placa desde então. Eclipse 2018 with JavaScript Development Tools has a decent JavaScript editor and a Chrome-based debugger, but it doesn’t know about TypeScript, which is used by Angular, or about ES6 and JSX files, which are used by React.

Eclipse sempre gostou de um grande mercado de plugins. Para o TypeScript, considere o TypeScript livre 1.0.,0 plugin. For Angular, TypeScript, and ES6, consider the commercial Angular IDE (by CodeMix, formerly Webclipse), and for React projects with JSX files try the open source TypeScript IDE. Se você adicionar mais de um, você vai precisar resolver a disputa sobre qual deles deve editar arquivos TypeScript, mas isso não é um grande problema.

IDG

Com algum esforço, você pode fazer o Eclipse trabalhar com Angulares e Reagir projetos., Embora Eclipse não suporte TypeScript, ES6, ou arquivos JSX fora da caixa, você pode adicionar um IDE Angular e um IDE TypeScript para preencher as lacunas.

CodeMix tools are billed as adding Visual Studio Code smarts to Eclipse. Ao contrário da maioria dos plugins Eclipse, o IDE Angular por CodeMix não é livre, mas tem um julgamento livre de 45 dias. Dado que o Visual Studio Code é gratuito, eu consideraria isso antes de pagar pela IDE Angular.

custo: gratuito; IDE Angular por CodeMix, $ 29 (pessoal) ou $48 (comercial) por ano. Plataforma: Windows, MacOS e Linux.,

ActiveState Komodo IDE

i have been a user and fan of Komodo IDE since it was first introduced in 2001. Embora novos produtos como Visual Studio Code e WebStorm tenham superado em algumas áreas, ainda é um bom editor e IDE.

Komodo IDE fornece edição avançada de JavaScript, realce de sintaxe, navegação e depuração, mas não inclui verificação de código JavaScript. Por isso, podes sempre usar o JSHint numa concha.

Komodo suporta dezenas de linguagens de programação e de marcação., Com sua ampla gama de programação e suporte de linguagem de marcação, incluindo refactoring, debugging e profiling, o Komodo IDE é uma escolha muito boa para o desenvolvimento final-a-final em linguagens de código aberto.

Komodo has a code refactoring module for all of the languages for which it provides code intelligence: PHP, Perl, Python, Ruby, Tcl, JavaScript, and Node.js. Infelizmente, a natureza de “menor denominador comum” desta abordagem limita as capacidades de renomear variáveis e membros de classe, e de extrair código em um método. No entanto, estes são alguns dos casos mais úteis.,

Komodo IDE tem edição de colunas e várias seleções. Isso fornece quase paridade com Texto Sublime e TextMate no que diz respeito a edições em massa. Enquanto estamos fazendo a comparação, Komodo é mais uma IDE, enquanto Texto Sublime é muito mais rápido. E enquanto estamos discutindo o desempenho, a velocidade da Komodo melhorou notavelmente em comparação com versões mais antigas, em desenho de tela, pesquisa e verificação de sintaxe.Komodo IDE tem várias características que a maioria dos produtos concorrentes não possuem. Um é o seu Inspector HTTP, que é excelente para depurar callbacks Ajax., Outra é a sua ferramenta RX (expressão regular, ou regex), que é uma ótima maneira de construir e testar expressões regulares para JavaScript, Perl, PHP, Python e Ruby.

colaboration is another Komodo IDE differentiator-think of it as Google Docs for code. Você pode criar sessões para grupos de arquivos, adicionar contatos a sessões como colaboradores, e então trabalhar em conjunto nos mesmos arquivos ao mesmo tempo, com sincronização em tempo quase real.

A colaboração não é um substituto para o controle de código fonte, mas é um suplemento útil., Komodo IDE integra o controle de código fonte usando CVS, Subversion, Perforce, Git, Mercurial e Bazaar. Apenas as operações básicas de controle de versão são suportadas. Operações avançadas, como ramificações, devem ser feitas usando um cliente de controle de código fonte separado.

embora o Komodo não tenha o seu próprio formatador de documentos JavaScript, ele tira vantagem do melhor código aberto livre para este propósito. Fora da caixa, o formatador padrão para arquivos JavaScript é JS Beautifier, mas outras nove opções estão disponíveis através de um menu.,

IDG

Komodo IDE fornece edição avançada de JavaScript, realce de sintaxe e navegação, mas não inclui verificação significativa de código JavaScript (execute JSHint para isso). O Komodo suporta dezenas de linguagens de programação e marcação, com ênfase em Perl, Python, PHP, Ruby, TCL e XSLT, e inclui depuração, refactoring, integração de controle de código fonte e testes de unidade.

Komodo IDE suporta depuração JavaScript do lado do cliente no Chrome, e pode debug Node.js tanto localmente como remotamente., Ele também remove Perl, Python, PHP, Ruby, Tcl, e XSLT.

Komodo IDE tem um visualizador DOM que lhe permite ver os documentos XML e HTML como árvores flexíveis. Ele também permite que você faça pesquisas XPath para filtrar a árvore.

o perfil de código do Komodo e os módulos de teste de unidade não suportam JavaScript. No entanto, JavaScript e nó.js são ambos suportados pelo Módulo de Inteligência de código do Komodo, que implementa navegação de código, completação automática e dicas de chamadas.

Komodo IDE pode publicar grupos de arquivos sobre FTP, SFTP, FTPS ou SCP., O Komodo também pode sincronizar arquivos e detectar potenciais conflitos de publicação que podem fazer com que você sobreponha as mudanças de outras pessoas.

no geral, Komodo é um bom, mas não grande IDE JavaScript, e um bom, mas não grande editor JavaScript. No entanto, ele pode muito bem atender às suas necessidades, especialmente se você também trabalhar com Perl, Python, PHP, Ruby, Tcl, ou XSLT.

custo: $ 295, mais $ 87 por ano para atualizações e suporte. Plataforma: Windows (7 ou superior), MacOS (10.9 ou superior), Linux.,

Apache NetBeans

NetBeans tem um bom suporte para JavaScript, HTML5 e CSS3 em projetos web, e suporta o framework Cordova/PhoneGap para construir aplicações móveis baseadas em JavaScript. NetBeans não é a IDE mais rápida do quarteirão, mas é uma das mais completas. E, claro, o preço está certo: o NetBeans está disponível gratuitamente sob uma licença de código aberto.

O editor de JavaScript NetBeans oferece realce de sintaxe, completação automática e dobragem de código, praticamente como seria de esperar., A edição JavaScript também funciona para o código JavaScript embutido em arquivos PHP, JSP e HTML. o suporte de jQuery é cozido no editor. NetBeans 8.2 tem suporte novo ou melhorado para o nó.js e Express, Gulp, Grunt, AngularJS, Knockout.js, Jade, Mocha e selénio.

a análise de código é executada em segundo plano à medida que você edita, fornecendo avisos e dicas. A depuração funciona no navegador Webkit incorporado e no Chrome com o conector NetBeans instalado. O depurador pode definir pontos de paragem DOM, line, event, e XMLHttpRequest, e irá mostrar variáveis, Relógios e a pilha de chamadas., Uma janela de registro de navegador integrado exibe exceções, erros e avisos do navegador.

o NetBeans pode configurar e realizar testes unitários com o JsTestDriver, um ficheiro JAR (Java archive) que poderá obter gratuitamente. A depuração dos testes unitários é activada automaticamente se indicar o Chrome com o conector NetBeans como um dos navegadores do JsTestDriver quando configurar o JsTestDriver na janela de Serviços.,

Quando estiver a depurar uma aplicação web no Chrome com o conector NetBeans e a editar CSS das ferramentas de desenvolvimento Chrome, as alterações serão capturadas pelo NetBeans e gravadas nos ficheiros CSS. No entanto, se seus arquivos CSS foram gerados a partir de folhas de estilo menos ou Sass, você terá que atualizar manualmente a folha de código porque os arquivos CSS são meramente saída compilada.

no navegador Webkit incorporado e no Chrome com o conector NetBeans instalado, você pode usar o Monitor de rede NetBeans para ver os cabeçalhos, respostas e pilhas de chamadas para as comunicações de descanso., Para as comunicações WebSocket, tanto os cabeçalhos como os quadros de texto são exibidos. No geral, o NetBeans oferece uma experiência de depuração ligeiramente melhor com o Chrome do que você entra no Firefox com Firebug.

NetBeans integra o controle de código fonte com Git, Subversion, Mercurial e CVS. O suporte Git é aumentado por um visualizador gráfico de diferenças e por um sistema de estantes dentro da IDE. O NetBeans codifica o estado do Git dos ficheiros, permite-lhe ver o histórico de revisões para cada ficheiro, e mostra-lhe a informação de revisão e autor para cada linha de ficheiros controlados por versões., NetBeans tem integrações similares com Subversion, Mercurial e CVS, mas eu só testei o Git.

NetBeans integra rastreamento de emissões com Jira e Bugzilla. Na janela de Tarefas NetBeans, você pode procurar por tarefas, salvar pesquisas, atualizar tarefas e resolver tarefas em seu repositório de Tarefas registradas. NetBeans também tem integração de servidores de equipe para sites que usam a infraestrutura Kenai.

até onde posso determinar, o NetBeans não possui nenhum perfil JavaScript, embora ele possa traçar o perfil de aplicações Java e módulos EJB., E enquanto os NetBeans podem refaturar Java e PHP, não podem refaturar JavaScript.

no geral, NetBeans é um candidato decente para o desenvolvimento de JavaScript, HTML5 e CSS3, especialmente se você também estiver fazendo desenvolvimento Java, PHP ou C++ no servidor. Se você não tem o orçamento para WebStorm e não gosta da Microsoft, você vai descobrir que NetBeans faz o trabalho, desde que você não esteja com muita pressa.

custo: gratuito. Plataforma: Windows, Solaris, MacOS, Linux.,

Microsoft Visual Studio 2017

In my full review of Visual Studio 2017 I discussed the product as a whole, with only a few references to JavaScript. Vou inverter a ênfase aqui.

InfoWorld

em Geral, o Visual Studio 2017 serve muito bem como um JavaScript IDE, que é melhor .Net IDE, e ele não é tão bom quanto o WebStorm para JavaScript. Enquanto ele também serve muito bem como um editor de JavaScript, é um melhor editor C#, e não é tão bom ou tão rápido quanto Texto Sublime para JavaScript.,

Como você pode ver na imagem abaixo, Visual Studio 2017 faz um bom trabalho com coloração de sintaxe JavaScript e dobragem de código. Ele também faz um bom trabalho com a navegação de código JavaScript: clique com o botão direito em uma função ou nome de membro, e você pode facilmente saltar para a definição ou encontrar todas as referências. Quando você terminar de olhar para a definição, você pode pressionar a seta de trás no topo da interface para voltar para onde você estava.

pode facilmente inserir excertos e rodear a sua selecção com o código apropriado, como a codificação HTML ou URL de variáveis de texto., Além de JavaScript, HTML e CSS, você pode editar arquivos de Markdown e ver o Markdown renderizado, e você pode trabalhar com TypeScript.

além disso, você pode, naturalmente, codificar em qualquer linguagem.Net, em C++, e em Python. E como tem sido o caso do Visual Studio por um longo tempo, você pode trabalhar com bases de dados diretamente da IDE. Visual Studio é especialmente forte quando se trabalha com bases de dados de servidores SQL. Você pode se safar com o uso Visual Studio em vez de SQL Server Management Studio para a maioria das operações de banco de dados que você gostaria de fazer como um desenvolvedor.,

Visual Studio 2017 suporta depuração em praticamente qualquer navegador que você queira jogar nele, incluindo navegadores em dispositivos móveis e emuladores. Ele também tem dois navegadores próprios: o simples navegador interno da web, que é (surpresa!) uma versão do Internet Explorer, e o inspetor de página, que mostra a página renderizada, juntamente com todas as fontes e estilos., Embora o inspetor de página faça um monte de coisas potencialmente consumidoras de tempo, de engenharia reversa para se configurar para uma página, uma vez que você está nele você pode ficar lá sem ter que lidar com o Visual Studio, o navegador, e as ferramentas de desenvolvimento do navegador.

O desempenho do Visual Studio 2017 é geralmente muito bom se você lhe der memória suficiente e poder de CPU, mas ele tende a exigir recursos significativos. O Visual Studio 2017 tem um excelente diagnóstico de desempenho para aplicações, mas de um modo geral não são muito úteis para o código JavaScript comum, que normalmente corre profundamente dentro de um navegador., Visual Studio tem programação específica de função JavaScript, interface HTML, e ferramentas de memória JavaScript, mas eles só se aplicam a projetos de Plataforma Universal Windows baseados em JavaScript, não projetos web que por acaso usam JavaScript.

IDG

Visual Studio 2017 has advanced support for Node.js, JavaScript ES6, and TypeScript using the Salsa analysis engine. No modo ES6, ele pode baixar automaticamente (a partir de DefinitelyTyped) os “typings” para o Node.pacotes js que você instala com NPM, para fornecer IntelliSense melhorado., Ele também pode instalar automaticamente módulos NPM em falta, como visto na parte inferior esquerda.

Visual Studio 2017 includes excellent Node.js application editing, IntelliSense, profiling, npm integration, TypeScript support, debuging locally and remotamente (Windows, MacOS, Linux), and debugging on Azure Web Apps and Azure Cloud Services. Ele também tem suporte para CSS, HTML, JavaScript, TypeScript, CoffeeScript, e menos., Isto inclui correr o JSHint à medida que escreve, permitindo-lhe minificar os ficheiros JavaScript a partir de um menu de contexto, e compilar automaticamente os ficheiros CoffeeScript ao gravar, mostrando uma antevisão lado a lado do JavaScript gerado.

Leave a Comment