JavaScript jest używany do wielu różnych rodzajów aplikacji dzisiaj. Najczęściej JavaScript współpracuje z HTML5 i CSS do tworzenia front endów internetowych. Ale JavaScript pomaga również budować aplikacje mobilne i znalazł ważne miejsce na zapleczu w postaci węzła.serwery js. Na szczęście narzędzia programistyczne JavaScript – zarówno edytory, jak i IDE-rosną, aby sprostać nowym wyzwaniom.
Po co używać IDE zamiast edytora? Głównym powodem jest to, że IDE może debugować i czasami profilować Twój kod., IDE mają również wsparcie dla Systemów ALM, integrujących się z takimi systemami jak Git, GitHub, Mercurial, Subversion i Perforce do kontroli wersji. Ale w miarę jak coraz więcej edytorów dodaje Hooki do tych systemów, obsługa ALM staje się coraz mniej wyróżnikiem.
Eclipse 2018 z narzędziami programistycznymi JavaScript
w dawnych czasach, kiedy Java Swing był nowy i ekscytujący, lubiłem używać Eclipse do tworzenia Javy, ale wkrótce przeniosłem się na inne IDE Javy. Pięć lat temu, kiedy zrobiłem trochę rozwoju Androida z Eclipse, znalazłem doświadczenie OK, ale poky., Kiedy próbowałem użyć Eclipse Luna z JSDT do programowania JavaScript w 2014, ciągle wyświetlał fałszywie dodatnie błędy poprawnego kodu, który przeszedł JSHint.
Eclipse 2018 z narzędziami programistycznymi JavaScript ma przyzwoity edytor JavaScript i debugger oparty na Chrome, ale nie wie o maszynopisie, który jest używany przez Angular, ani o plikach ES6 i JSX, które są używane przez Reacta.
Eclipse zawsze cieszył się ogromnym rynkiem pluginów. W przypadku maszynopisu rozważ darmowy TypeScript 1.0.,0 plugin. Dla Angular, TypeScript i ES6, rozważ komercyjne IDE Angular (przez CodeMix, dawniej Webclipse), a dla projektów Reactowych z plikami JSX spróbuj open source TypeScript IDE. Jeśli dodasz więcej niż jeden, będziesz musiał rozwiązać ich spór o to, który z nich powinien edytować pliki maszynopisu, ale to nic wielkiego.
przy odrobinie wysiłku możesz sprawić, że Eclipse będzie działać z projektami Angular i React., Chociaż Eclipse nie obsługuje plików TypeScript, ES6 lub JSX po wyjęciu z pudełka, możesz dodać Angular IDE i TypeScript IDE, aby wypełnić luki.
narzędzia CodeMix są rozliczane jako dodawanie inteligentnego kodu Visual Studio do Eclipse. W przeciwieństwie do większości wtyczek Eclipse, Angular IDE by CodeMix nie jest darmowy, ale ma 45-dniową bezpłatną wersję próbną. Biorąc pod uwagę, że kod Visual Studio jest darmowy, rozważyłbym to przed zapłaceniem za Angular IDE.
koszt: gratis; Angular IDE by CodeMix, 29 $(Personal) lub 48 $(Commercial) rocznie. Platforma: Windows, MacOS i Linux.,
ActiveState Komodo IDE
jestem użytkownikiem i fanem Komodo IDE od czasu jego wprowadzenia w 2001 roku. Chociaż nowsze produkty, takie jak Visual Studio Code i WebStorm, przewyższyły go w niektórych obszarach, nadal jest dobrym edytorem i IDE.
Komodo IDE zapewnia zaawansowaną edycję JavaScript, podświetlanie składni, nawigację i debugowanie, ale nie obejmuje sprawdzania kodu JavaScript. W tym celu zawsze możesz uruchomić JSHint w powłoce.
Komodo obsługuje dziesiątki języków programowania i znaczników., Dzięki szerokiemu zakresowi programowania i obsługi języka znaczników, w tym refaktoryzacji, debugowania i profilowania, Komodo IDE jest bardzo dobrym wyborem do kompleksowego rozwoju w językach open source.
Komodo posiada moduł refaktoryzacji kodu dla wszystkich języków, dla których zapewnia inteligencję kodu: PHP, Perl, Python, Ruby, Tcl, JavaScript i Node.js. Niestety, „najmniejszy wspólny mianownik” tego podejścia ogranicza możliwości do zmiany nazw zmiennych i członków klasy oraz do wyodrębniania kodu do metody. Niemniej jednak są to jedne z najbardziej przydatnych przypadków.,
Komodo IDE ma zarówno edycję kolumn, jak i wiele zaznaczenia. Zapewnia to prawie równość z Sublime Text i TextMate, jeśli chodzi o masowe edycje. Tak długo, jak robimy porównanie, Komodo jest bardziej IDE, podczas gdy Sublime Text jest znacznie szybszy. I tak długo, jak mówimy o wydajności, szybkość Komodo znacznie się poprawiła w porównaniu ze starszymi wersjami, w rysowaniu ekranu, wyszukiwaniu i sprawdzaniu składni.
Komodo IDE ma kilka funkcji, których brakuje większości konkurencyjnych produktów. Jednym z nich jest inspektor HTTP, który jest doskonały do debugowania wywołań zwrotnych Ajax., Innym jest zestaw narzędzi Rx (regular expression lub regex), który jest świetnym sposobem na tworzenie i testowanie wyrażeń regularnych dla JavaScript, Perla, PHP, Pythona i Ruby.
Collaboration to kolejny wyróżnik Komodo IDE—pomyśl o tym jak o Google Docs dla kodu. Możesz tworzyć sesje dla grup plików, dodawać kontakty do sesji jako współpracownicy, a następnie pracować razem nad tymi samymi plikami w tym samym czasie, z synchronizacją prawie w czasie rzeczywistym.
współpraca nie zastępuje kontroli kodu źródłowego, ale jest przydatnym uzupełnieniem., Komodo IDE integruje sterowanie kodem źródłowym przy użyciu CVS, Subversion, Perforce, Git, Mercurial i Bazaar. Obsługiwane są tylko podstawowe operacje kontroli wersji. Zaawansowane operacje, takie jak rozgałęzianie, muszą być wykonywane przy użyciu oddzielnego klienta kontroli kodu źródłowego.
chociaż Komodo nie ma własnego formatera dokumentów JavaScript, korzysta z najlepszego darmowego open source do tego celu. Po wyjęciu z pudełka domyślnym formaterem dla plików JavaScript jest js Beautifier, ale kolejne dziewięć opcji jest dostępnych za pośrednictwem rozwijanego menu.,
Komodo IDE zapewnia zaawansowaną edycję JavaScript, podświetlanie składni i nawigację, ale nie zawiera znaczącego sprawdzania kodu JavaScript (uruchom w tym celu JSHint). Komodo obsługuje dziesiątki języków programowania i znaczników, z naciskiem na Perl, Python, PHP, Ruby, Tcl i XSLT, i obejmuje debugowanie, refaktoryzację, integrację kontroli kodu źródłowego i Testowanie jednostek.
Komodo IDE obsługuje debugowanie JavaScript po stronie Klienta w Chrome i może debugować węzeł.js zarówno lokalnie, jak i zdalnie., Debuguje również Perl, Python, PHP, Ruby, Tcl i XSLT.
Komodo IDE posiada przeglądarkę DOM, która umożliwia przeglądanie dokumentów XML i HTML jako zwijanych drzew. Pozwala również na wyszukiwanie XPath w celu filtrowania drzewa.
moduły do profilowania kodu i testowania jednostek Komodo nie obsługują JavaScript. Jednak JavaScript i Node.js są obsługiwane przez moduł Code Intelligence Komodo, który implementuje przeglądanie kodu, autocompletion i wywołania.
Komodo IDE może publikować grupy plików przez FTP, SFTP, FTPS lub SCP., Komodo może również synchronizować pliki i wykrywać potencjalne konflikty publikowania, które mogą spowodować zastąpienie zmian innych osób.
ogólnie Komodo jest dobrym, ale nie świetnym JavaScript IDE i dobrym, ale nie świetnym edytorem JavaScript. Może jednak służyć twoim potrzebom, zwłaszcza jeśli pracujesz również z Perlem, Pythonem, PHP, Ruby, Tcl lub XSLT.
koszt: $295, plus $87 rocznie na aktualizacje i wsparcie. Platforma: Windows (7 lub nowszy), MacOS (10.9 lub nowszy), Linux.,
Apache NetBeans
NetBeans ma bardzo dobre wsparcie dla JavaScript, HTML5 i CSS3 w projektach internetowych, i obsługuje Cordova / PhoneGap framework do budowania aplikacji mobilnych opartych na JavaScript. NetBeans nie jest najszybszym IDE w bloku, ale jest jednym z bardziej kompletnych. I oczywiście cena jest odpowiednia: NetBeans jest dostępny bezpłatnie na licencji open source.
edytor JavaScript NetBeans zapewnia podświetlanie składni, automatyczne uzupełnianie i składanie kodu, prawie tak, jak można się spodziewać., Funkcje edycji JavaScript działają również dla kodu JavaScript osadzonego w plikach PHP, JSP i HTML. obsługa jQuery jest dostępna w edytorze. NetBeans 8.2 ma nowe lub ulepszone wsparcie dla węzła.js i Express, Gulp, Grunt, AngularJS, Knockout.js, Jadeit, Mocha i selen.
analiza kodu działa w tle podczas edycji, zapewniając ostrzeżenia i podpowiedzi. Debugowanie działa we wbudowanej przeglądarce WebKit oraz w Chrome z zainstalowanym złączem NetBeans. Debugger może ustawić punkty przerwania DOM, line, event I XMLHttpRequest i wyświetli zmienne, zegarki i stos wywołań., Zintegrowane okno dziennika przeglądarki wyświetla wyjątki, błędy i ostrzeżenia przeglądarki.
NetBeans może skonfigurować i przeprowadzić testy jednostkowe za pomocą JsTestDriver, pliku JAR (Java archive), który można pobrać za darmo. Debugowanie testów jednostkowych jest automatycznie włączone, jeśli podczas konfigurowania Jstestdriver w oknie Usługi określisz Chrome z NetBeans Connector jako jedną z przeglądarek JsTestDriver.,
podczas debugowania aplikacji internetowej w Chrome za pomocą złącza NetBeans i edycji CSS z narzędzi programistycznych Chrome zmiany zostaną przechwycone przez NetBeans i zapisane w plikach CSS. Jeśli jednak Pliki CSS zostały wygenerowane z arkuszy stylów Less lub Sass, będziesz musiał ręcznie zaktualizować arkusz źródłowy, Ponieważ pliki CSS są tylko skompilowane.
we wbudowanej przeglądarce WebKit oraz w Chrome z zainstalowanym złączem NetBeans możesz używać monitora sieciowego NetBeans do wyświetlania nagłówków żądań, odpowiedzi i stosów połączeń w celu komunikacji REST., W przypadku komunikacji WebSocket wyświetlane są zarówno nagłówki, jak i ramki tekstowe. Ogólnie Rzecz Biorąc, NetBeans zapewnia nieco lepsze debugowanie w Chrome niż w Firefoksie z Firebug.
NetBeans integruje kontrolę kodu źródłowego z Git, Subversion, Mercurial i CVS. Obsługa Git jest rozszerzona o graficzną przeglądarkę różnic i system regałów w IDE. NetBeans color-koduje Status plików Git, umożliwia przeglądanie historii wersji dla każdego pliku oraz wyświetla informacje o wersji i autorze dla każdej linii plików sterowanych wersjami., NetBeans ma podobne integracje z Subversion, Mercurial i CVS, ale testowałem tylko Gita.
NetBeans integruje śledzenie problemów z Jira i Bugzillą. W oknie Zadania NetBeans możesz wyszukiwać zadania, zapisywać wyszukiwania, aktualizować zadania i rozwiązywać zadania w zarejestrowanym repozytorium zadań. NetBeans posiada również integrację z serwerem team server dla witryn korzystających z infrastruktury Kenai.
z tego co wiem, NetBeans nie ma żadnego profilowania JavaScript, chociaż może profilować Aplikacje Java i moduły EJB., Podczas gdy NetBeans potrafi refaktorować Javę i PHP, nie potrafi refaktorować JavaScript.
Ogólnie Rzecz Biorąc, NetBeans jest przyzwoitym konkurentem dla programistów JavaScript, HTML5 i CSS3 po stronie klienta, zwłaszcza jeśli zajmujesz się również Java, PHP lub c++ na serwerze. Jeśli nie masz budżetu na WebStorm i nie lubisz Microsoftu, przekonasz się, że NetBeans robi to, o ile nie spieszysz się bardzo.
koszt: gratis. Platforma: Windows, Solaris, MacOS, Linux.,
Microsoft Visual Studio 2017
w mojej pełnej recenzji Visual Studio 2017 omówiłem produkt jako całość, z tylko kilkoma odniesieniami do JavaScript. Odwrócę nacisk.
Ogólnie rzecz biorąc, Visual Studio 2017 służy bardzo dobrze jako JavaScript IDE, choć jest lepszym.Net IDE i nie jest tak dobry jak WebStorm dla JavaScript. Chociaż służy również bardzo dobrze jako edytor JavaScript, jest to lepszy edytor C# i nie jest tak dobry lub tak szybki jak Sublime Text dla JavaScript.,
Jak widać na poniższym zrzucie ekranu, Visual Studio 2017 dobrze radzi sobie z kolorowaniem składni JavaScript i składaniem kodu. Działa również dobrze z nawigacją kodu JavaScript: kliknij prawym przyciskiem myszy na funkcji lub nazwie członka, a możesz łatwo przejść do definicji lub znaleźć wszystkie odniesienia. Kiedy skończysz patrzeć na definicję, możesz nacisnąć strzałkę w tył u góry interfejsu, aby wrócić do miejsca, w którym byłeś.
możesz łatwo wstawić fragmenty i otoczyć swój wybór odpowiednim kodem, takim jak kodowanie HTML lub URL zmiennych łańcuchowych., Oprócz JavaScript, HTML i CSS, możesz edytować pliki Markdown i wyświetlać renderowane znaczniki, a także pracować z maszynopisem.
ponadto możesz oczywiście kodować w dowolnym języku.Net, w C++ i w Pythonie. Podobnie jak w przypadku Visual Studio od dłuższego czasu, można pracować z bazami danych bezpośrednio z poziomu IDE. Visual Studio jest szczególnie silny podczas pracy z bazami danych SQL Server. Możesz uniknąć korzystania z Visual Studio zamiast SQL Server Management Studio dla większości operacji bazodanowych, które chcesz wykonać jako programista.,
Visual Studio 2017 obsługuje debugowanie w prawie każdej przeglądarce, w tym przeglądarkach na urządzeniach mobilnych i emulatorach. Ma również dwie własne przeglądarki: zwykłą wewnętrzną przeglądarkę internetową, która jest (niespodzianka!) wersji przeglądarki Internet Explorer oraz inspektora strony, który wyświetla renderowaną stronę wraz ze wszystkimi źródłami i stylami., Chociaż Inspektor strony wykonuje wiele potencjalnie czasochłonnych, inżynierii wstecznej rzeczy, aby skonfigurować stronę, gdy już na niej jesteś, możesz tam pozostać bez konieczności żonglowania Visual Studio, przeglądarką i narzędziami programistycznymi przeglądarki.
wydajność Visual Studio 2017 jest zwykle całkiem dobra, jeśli dasz mu wystarczającą ilość pamięci i mocy procesora, ale zwykle wymaga znacznych zasobów. Visual Studio 2017 ma świetną diagnostykę wydajności aplikacji, ale ogólnie nie są one zbyt przydatne dla zwykłego kodu JavaScript, który zazwyczaj działa głęboko w przeglądarce., Visual Studio ma specyficzne funkcje JavaScript timing, responsywność interfejsu HTML i narzędzia pamięci JavaScript, ale mają one zastosowanie tylko do projektów opartych na Javascript uniwersalnej platformie Windows, a nie projektów internetowych, które używają JavaScript.
Visual Studio 2017 ma zaawansowane wsparcie dla węzła.js, JavaScript ES6 i TypeScript przy użyciu silnika analizy Salsa. W trybie ES6 może automatycznie pobierać (z definitywnego) „typowania” dla węzła.Pakiety js instalujesz za pomocą NPM, aby zapewnić lepszą IntelliSense., Może również automatycznie instalować brakujące Moduły NPM, jak widać w lewym dolnym rogu.
Visual Studio 2017 zawiera doskonały węzeł.edycja aplikacji js, IntelliSense, profilowanie, integracja z NPM, obsługa maszynopisu, debugowanie lokalnie i zdalnie (Windows, MacOS, Linux) oraz debugowanie w aplikacjach internetowych Azure i usługach chmurowych Azure. Posiada również wsparcie dla CSS, HTML, JavaScript, TypeScript, coffeescript i Less., Obejmuje to uruchamianie JSHint podczas pisania, co pozwala na minifikację plików JavaScript z menu kontekstowego i automatyczne kompilowanie plików CoffeeScript przy zapisie, pokazując obok siebie podgląd wygenerowanego JavaScript.