JavaScript wird heute für viele verschiedene Arten von Anwendungen verwendet. Meistens arbeitet JavaScript mit HTML5 und CSS, um Web-Frontends zu erstellen. JavaScript hilft aber auch beim Erstellen mobiler Anwendungen und hat einen wichtigen Platz im Backend in Form von Node gefunden.js-Server. Glücklicherweise steigen JavaScript—Entwicklungstools—sowohl Editoren als auch IDEs -, um die neuen Herausforderungen zu meistern.
Warum eine IDE anstelle eines Editors verwenden? Der Hauptgrund ist, dass eine IDE Ihren Code debuggen und manchmal profilieren kann., IDEs haben auch Unterstützung für ALM-Systeme, die Integration mit Leuten wie Git, GitHub, Mercurial, Subversion und Perforce für Versionskontrolle. Da jedoch mehr Editoren Hooks zu diesen Systemen hinzufügen, wird die ALM-Unterstützung immer weniger zum Unterscheidungsmerkmal.
Eclipse 2018 mit JavaScript-Entwicklungstools
In den alten Tagen, als Java Swing neu und aufregend war, habe ich Eclipse gerne für die Java-Entwicklung verwendet, bin aber bald zu anderen Java-IDEs übergegangen. Vor mehr als fünf Jahren, als ich eine Android-Entwicklung mit Eclipse gemacht habe, fand ich die Erfahrung in Ordnung, aber poky., Als ich 2014 versuchte, Eclipse Luna mit JSDT für die JavaScript-Entwicklung zu verwenden, wurden ständig falsch positive Fehler für gültigen Code angezeigt, der JSHint übergeben hat.
Glücklicherweise sind seitdem mehrere Anbieter und Open-Source-Projekte auf den Teller gekommen. Eclipse 2018 mit JavaScript-Entwicklungstools verfügt über einen anständigen JavaScript-Editor und einen Chrome-basierten Debugger, der jedoch nichts über TypeScript weiß, das von Angular verwendet wird, oder über ES6-und JSX-Dateien, die von React verwendet werden.
Eclipse hat schon immer einen riesigen Marktplatz von Plugins genossen. Betrachten Sie für TypeScript das kostenlose TypeScript 1.0.,0-plugin. Betrachten Sie für Angular, TypeScript und ES6 die kommerzielle Angular-IDE (von CodeMix, ehemals Webclipse) und für Reaktionsprojekte mit JSX-Dateien die Open-Source-TypeScript-IDE. Wenn Sie mehr als eine hinzufügen, müssen Sie ihren Streit darüber beilegen, welche TypeScript-Dateien bearbeitet werden sollen, aber das ist keine große Sache.
Mit etwas Aufwand können Sie Eclipse Arbeit mit Angular und React-Projekte., Obwohl Eclipse TypeScript -, ES6-oder JSX-Dateien nicht sofort unterstützt, können Sie eine Angular-IDE und eine TypeScript-IDE hinzufügen, um die Lücken zu füllen.
CodeMix-Tools werden als Hinzufügen von Visual Studio-Code-Smarts zu Eclipse in Rechnung gestellt. Im Gegensatz zu den meisten Eclipse-Plugins ist Angular IDE von CodeMix nicht kostenlos, verfügt jedoch über eine 45-tägige kostenlose Testversion. Angesichts der Tatsache, dass Visual Studio-Code kostenlos ist, würde ich dies in Betracht ziehen, bevor ich für Angular IDE bezahle.
Kosten: Kostenlos; Angular IDE von CodeMix, $ 29 (persönlich) oder $48 (kommerziell) pro Jahr. Plattform: Windows, MacOS, und Linux.,
ActiveState Komodo IDE
Ich bin Benutzer und Fan von Komodo IDE, seit es 2001 eingeführt wurde. Obwohl neuere Produkte wie Visual Studio Code und WebStorm es in einigen Bereichen übertroffen haben, ist es immer noch ein guter Editor und IDE.
Komodo IDE bietet erweiterte JavaScript-Bearbeitung, Syntaxhervorhebung, Navigation und Debugging, enthält jedoch keine JavaScript-Codeprüfung. Dazu können Sie JSHint immer in einer Shell ausführen.
Komodo unterstützt Dutzende von Programmier-und markup-Sprachen., Mit seiner breiten Palette an Programmier-und Markup-Sprachunterstützung, einschließlich Refactoring, Debugging und Profiling, ist Komodo IDE eine sehr gute Wahl für die End-to-End-Entwicklung in Open-Source-Sprachen.
Komodo verfügt über ein Code-Refactoring-Modul für alle Sprachen, für die es Code-Intelligenz bereitstellt: PHP, Perl, Python, Ruby, Tcl, JavaScript und Node.js. Leider beschränkt der“ kleinste gemeinsame Nenner “ dieses Ansatzes die Möglichkeiten zum Umbenennen von Variablen und Klassenmitgliedern und zum Extrahieren von Code in eine Methode. Dennoch sind dies einige der nützlichsten Fälle.,
Komodo IDE verfügt sowohl über die Spaltenbearbeitung als auch über mehrere Auswahlen. Dies bietet nahezu Parität mit Sublime Text und TextMate, was Massenbearbeitungen betrifft. Solange wir den Vergleich durchführen, ist Komodo eher eine IDE, während Sublime Text viel schneller ist. Und solange wir über Leistung sprechen, hat sich die Geschwindigkeit von Komodo im Vergleich zu älteren Versionen bei der Bildschirmzeichnung, Suche und Syntaxprüfung merklich verbessert.
Komodo IDE verfügt über mehrere Funktionen, die den meisten Wettbewerbsprodukten fehlen. Einer ist der HTTP Inspector, der sich hervorragend zum Debuggen von Ajax-Rückrufen eignet., Ein weiteres ist das Rx-Toolkit (Regular Expression oder Regex), mit dem reguläre Ausdrücke für JavaScript, Perl, PHP, Python und Ruby erstellt und getestet werden können.
Collaboration ist ein weiterer Komodo-IDE-Unterscheidungsmerkmal-betrachten Sie es als Google Text & Tabellen für Code. Sie können Sitzungen für Gruppen von Dateien erstellen, Kontakte zu Sitzungen als Mitarbeiter hinzufügen und dann mit nahezu Echtzeit-Synchronisation gleichzeitig an denselben Dateien arbeiten.
Collaboration ist kein Ersatz für die Quellcodeverwaltung, aber eine nützliche Ergänzung., Komodo IDE integriert die Quellcodesteuerung mit CVS, Subversion, Perforce, Git, Mercurial und Bazaar. Nur die grundlegenden Versionskontrolloperationen werden unterstützt. Erweiterte Vorgänge, z. B. Verzweigungen, müssen mit einem separaten Quellcode-Steuerungs-Client ausgeführt werden.
Obwohl Komodo keinen eigenen JavaScript-Dokumentformatierer hat, nutzt es zu diesem Zweck die beste kostenlose Open Source. Standardmäßig ist der Standardformatierer für JavaScript-Dateien JS Beautifier, aber weitere neun Optionen sind über ein Dropdown-Menü verfügbar.,
Komodo IDE bietet erweiterte JavaScript-Bearbeitung, Syntaxhervorhebung und Navigation, enthält jedoch keine signifikante JavaScript-Codeprüfung (führen Sie dafür JSHint aus). Komodo unterstützt Dutzende von Programmier-und Auszeichnungssprachen mit Schwerpunkt auf Perl, Python, PHP, Ruby, Tcl und XSLT und umfasst Debugging, Refactoring, Integration der Quellcodesteuerung und Komponententests.
Komodo-IDE unterstützt das Debuggen von clientseitigem JavaScript in Chrome, und es können debug-Knoten.js sowohl lokal als auch remote., Es auch Debuggen Perl, Python, PHP, Ruby, Tcl, und XSLT.
Komodo IDE verfügt über einen DOM-Viewer, mit dem Sie XML – und HTML-Dokumente als zusammenklappbare Bäume anzeigen können. Außerdem können Sie XPath-Suchen durchführen, um den Baum zu filtern.
Komodo code-profiling und unit-testing Module keine JavaScript-Unterstützung. Allerdings JavaScript und Knoten.js werden beide vom Code Intelligence-Modul von Komodo unterstützt, das Code-Browsing, automatische Vervollständigung und Calltips implementiert.
Komodo IDE kann Gruppen von Dateien über FTP, SFTP, FTPS oder SCP veröffentlichen., Komodo kann auch Dateien synchronisieren und potenzielle Veröffentlichungskonflikte erkennen, die dazu führen können, dass Sie die Änderungen anderer Personen überschreiben.
Insgesamt ist Komodo eine gute, aber keine großartige JavaScript-IDE und ein guter, aber kein großartiger JavaScript-Editor. Es kann jedoch Ihren Anforderungen gerecht werden, insbesondere wenn Sie auch mit Perl, Python, PHP, Ruby, Tcl oder XSLT arbeiten.
Kosten: $295, plus $87 pro Jahr für upgrades und support. Plattform: Windows (7 oder höher), MacOS (10.9 oder höher), Linux.,
Apache NetBeans
NetBeans unterstützt JavaScript, HTML5 und CSS3 in Webprojekten sehr gut und unterstützt das Cordova / PhoneGap-Framework zum Erstellen JavaScript-basierter mobiler Anwendungen. NetBeans ist nicht die schnellste IDE auf dem Block, aber es ist eine der vollständigeren. Und natürlich ist der Preis richtig: NetBeans ist kostenlos unter einer Open-Source-Lizenz erhältlich.
Der JavaScript-Editor von NetBeans bietet Syntaxhervorhebung, automatische Vervollständigung und Code-Faltung, so ziemlich wie Sie es erwarten würden., Die JavaScript-Bearbeitungsfunktionen funktionieren auch für JavaScript-Code, der in PHP -, JSP-und HTML-Dateien eingebettet ist. jQuery-Unterstützung wird in den Editor gebacken. NetBeans 8.2 hat neue oder verbesserte Unterstützung für Knoten.js und Express, Schluck, Grunzen, AngularJS, Knockout.js, Jade, Mokka und Selen.
Die Codeanalyse wird während der Bearbeitung im Hintergrund ausgeführt und bietet Warnungen und Hinweise. Das Debuggen funktioniert im eingebetteten WebKit-Browser und in Chrome mit installiertem NetBeans Connector. Der Debugger kann DOM -, Zeilen -, Ereignis-und XMLHttpRequest-Haltepunkte festlegen und Variablen, Uhren und den Aufrufstapel anzeigen., Ein integriertes Browserprotokollfenster zeigt Browserausnahmen, – fehler und-warnungen an.
NetBeans können Unit-Tests mit dem JsTestDriver konfigurieren und durchführen, einer JAR-Datei (Java-Archiv), die Sie kostenlos herunterladen können. Das Debuggen von Komponententests wird automatisch aktiviert, wenn Sie Chrome mit NetBeans Connector als einen der JsTestDriver-Browser angeben, wenn Sie JsTestDriver im Fenster Dienste konfigurieren.,
Wenn Sie eine Webanwendung in Chrome mit dem NetBeans Connector debuggen und CSS über die Chrome Developer Tools bearbeiten, werden die Änderungen von NetBeans erfasst und in den CSS-Dateien gespeichert. Wenn Ihre CSS-Dateien jedoch aus Less-oder Sass-Stylesheets generiert wurden, müssen Sie das Quellblatt manuell aktualisieren, da die CSS-Dateien lediglich eine kompilierte Ausgabe sind.
Im eingebetteten WebKit-Browser und in Chrome mit installiertem NetBeans Connector können Sie den NetBeans Network Monitor verwenden, um Anforderungsheader, Antworten und Aufrufstapel für die REST-Kommunikation anzuzeigen., Für die WebSocket-Kommunikation werden sowohl Header als auch Textrahmen angezeigt. Insgesamt bietet NetBeans eine etwas bessere Debugging-Erfahrung mit Chrome als in Firefox mit Firebug.
NetBeans integriert die Quellcodeverwaltung in Git, Subversion, Mercurial und CVS. Die Git-Unterstützung wird durch einen grafischen Diff-Viewer und ein Regalsystem innerhalb der IDE erweitert. NetBeans Farbcodes der Git-Status von Dateien, können Sie Revisionsverlauf für jede Datei anzuzeigen, und zeigt Ihnen Revisions-und Autoreninformationen für jede Zeile der versionsgesteuerten Dateien., NetBeans hat ähnliche Integrationen mit Subversion, Mercurial und CVS, aber ich habe nur Git getestet.
NetBeans integriert Problemverfolgung mit Jira und Bugzilla. Im NetBeans Task-Fenster können Sie nach Aufgaben suchen, Suchen speichern, Aufgaben aktualisieren und Aufgaben in Ihrem registrierten Task-Repository auflösen. NetBeans verfügt auch über eine Teamserver-Integration für Websites, die die Kenai-Infrastruktur verwenden.
Soweit ich feststellen kann, fehlt NetBeans jede JavaScript-Profilerstellung, obwohl Java-Anwendungen und EJB-Module profiliert werden können., Und während NetBeans Java und PHP umgestalten kann, kann es JavaScript nicht umgestalten.
Insgesamt ist NetBeans ein anständiger Anwärter für clientseitige JavaScript -, HTML5-und CSS3-Entwicklung, insbesondere wenn Sie auch Java -, PHP-oder C++ – Entwicklung auf dem Server durchführen. Wenn Sie nicht über das Budget für WebStorm verfügen und Microsoft nicht mögen, werden Sie feststellen, dass NetBeans den Job erledigt, solange Sie es nicht eilig haben.
Kosten: Kostenlos. Plattform: Windows, Solaris, MacOS, Linux.,
Microsoft Visual Studio 2017
In meinem vollständigen Testbericht zu Visual Studio 2017 habe ich das Produkt als Ganzes mit nur wenigen Verweisen auf JavaScript besprochen. Ich werde die Betonung hier umkehren.
Insgesamt dient Visual Studio 2017 sehr gut als JavaScript-IDE, obwohl es eine bessere.NET-IDE ist und nicht so gut wie WebStorm für JavaScript ist. Während es auch sehr gut als JavaScript-Editor dient, ist es ein besserer C# – Editor, und es ist nicht so gut oder so schnell wie Sublime Text für JavaScript.,
Wie Sie im Screenshot unten sehen können, leistet Visual Studio 2017 gute Arbeit mit JavaScript-Syntaxfärbung und Codefaltung. Es macht auch einen guten Job mit JavaScript-Code-Navigation: Rechtsklick auf eine Funktion oder Mitgliedernamen, und Sie können leicht auf die Definition springen oder alle Referenzen finden. Wenn Sie mit dem Betrachten der Definition fertig sind, können Sie den Zurück-Pfeil oben in der Benutzeroberfläche drücken, um dorthin zurückzukehren, wo Sie waren.
Sie können ganz einfach Snippets einfügen und Ihre Auswahl mit entsprechendem Code umgeben, z. B. HTML-oder URL-Codierung von String-Variablen., Neben JavaScript, HTML und CSS können Sie Markdown-Dateien bearbeiten, den gerenderten Markdown anzeigen und mit TypeScript arbeiten.
Darüber hinaus können Sie natürlich Code in jeder.Net-Sprache, in C++ und in Python. Und wie schon lange bei Visual Studio können Sie mit Datenbanken direkt von der IDE aus arbeiten. Visual Studio ist besonders stark bei der Arbeit mit SQL Server-Datenbanken. Sie können Visual Studio anstelle von SQL Server Management Studio für die meisten Datenbankoperationen verwenden, die Sie als Entwickler ausführen möchten.,
Visual Studio 2017 unterstützt das Debuggen in so ziemlich jedem Browser, den Sie darauf werfen möchten, einschließlich Browsern auf Mobilgeräten und in Emulatoren. Es hat auch zwei eigene Browser: den einfachen internen Webbrowser (Überraschung!) eine Version von Internet Explorer und der Seiteninspektor, der Ihnen die gerenderte Seite zusammen mit allen Quellen und Stilen anzeigt., Obwohl der Seiteninspektor viele potenziell zeitaufwändige Reverse-Engineering-Funktionen ausführt, um sich für eine Seite einzurichten, können Sie dort bleiben, ohne Visual Studio, den Browser und die Entwicklertools des Browsers jonglieren zu müssen.
Die Leistung von Visual Studio 2017 ist normalerweise ziemlich gut, wenn Sie genügend Speicher und CPU-Leistung bereitstellen, jedoch erhebliche Ressourcen erfordern. Visual Studio 2017 bietet eine großartige Leistungsdiagnose für Anwendungen, aber im Großen und Ganzen sind sie für normalen JavaScript-Code, der normalerweise tief in einem Browser ausgeführt wird, nicht so nützlich., Visual Studio verfügt über spezifische JavaScript-Funktions-Timing -, HTML-UI-Reaktionsfähigkeit und JavaScript-Speicher-Tools, aber sie gelten nur für JavaScript-basierte universelle Windows-Plattform-Projekte, nicht Web-Projekte, die JavaScript verwenden passieren.
Visual Studio 2017 hat erweiterte Unterstützung für Node.js, JavaScript ES6 und TypeScript mit der Salsa-Analyse-engine. Im ES6-Modus kann es automatisch (von DefinitelyTyped) die „Typings“ für Knoten herunterladen.js-Pakete, die Sie mit NPM installieren, um ein verbessertes IntelliSense bereitzustellen., Es kann auch fehlende NPM-Module automatisch installieren, wie unten links zu sehen.
Visual Studio 2017 enthält ausgezeichnete Knoten.js-Anwendung Bearbeiten, IntelliSense, profiling, NPM integration, TypeScript support, debugging lokal und Remote (Windows, MacOS, Linux) und debugging auf Azure-Web-Apps und Azure-Cloud-Services. Es hat auch Unterstützung für CSS, HTML, JavaScript, TypeScript, CoffeeScript, und Weniger., Dazu gehört das Ausführen von JSHint während der Eingabe, das Minimieren von JavaScript-Dateien aus einem Kontextmenü und das automatische Kompilieren von CoffeeScript-Dateien beim Speichern, wobei eine Side-by-Side-Vorschau des generierten JavaScript angezeigt wird.