JavaScriptiä käytetään nykyään monissa erilaisissa sovelluksissa. Useimmiten JavaScript toimii HTML5: n ja CSS: n avulla web-käyttöliittymien rakentamiseksi. Mutta JavaScript auttaa myös rakentamaan mobiilisovelluksia, ja se on löytänyt tärkeän paikan takana Node.js-palvelinten muodossa. Onneksi JavaScript-kehitystyökalut - sekä toimittajat että IDE: t - nousevat vastaamaan uusiin haasteisiin.
Miksi käyttää IDE: tä editorin sijasta? Tärkein syy on, että IDE voi virheenkorjata ja joskus profiloida koodisi. IDE: llä on myös tuki ALM-järjestelmille, integroitumalla Gitin, GitHubin, Mercurialin, Subversionin ja Perforcen kaltaisiin versioiden hallintaa varten. Mutta kun useampi toimittaja lisää koukkuja näihin järjestelmiin, ALM-tuki on tulossa vähemmän erottelijaksi.
Eclipse 2018 JavaScript-kehitystyökaluilla
Muinaisina aikoina, kun Java Swing oli uusi ja jännittävä, nautin Eclipsen käytöstä Java-kehityksessä, mutta muutin pian muihin Java IDE: iin. Viisi plus vuotta sitten, kun tein jonkin verran Android-kehitystä Eclipse-ohjelmalla, huomasin kokemuksen olevan OK, mutta muuttunut. Kun yritin käyttää Eclipse Lunaa JSDT: n kanssa JavaScript-kehityksessä vuonna 2014, se näytti jatkuvasti vääriä positiivisia virheitä kelvolliselle koodille, joka läpäisi JSHintin.
Liittyvä video: Mikä on JavaScript? Luoja Brendan Eich selittää
Brendan Eich, JavaScript-ohjelmointikielen luoja, kertoo kuinka kieltä käytetään ja miksi se on edelleen suosikki ohjelmoijien keskuudessa sen helppokäyttöisyyden vuoksi.
Onneksi useat toimittajat ja avoimen lähdekoodin projektit ovat nousseet levylle sen jälkeen. Eclipse 2018: lla JavaScript-kehitystyökaluilla on kunnollinen JavaScript-editori ja Chrome-pohjainen virheenkorjaus, mutta se ei tiedä Angularin käyttämästä TypeScriptistä eikä Reactin käyttämistä ES6- ja JSX-tiedostoista.
Eclipse on aina nauttinut laajoista laajennuksista. Harkitse TypeScript-versiota ilmaisesta TypeScript 1.0.0 -laajennuksesta. Harkitse Angular-, TypeScript- ja ES6-mallien osalta kaupallista Angular IDE -ohjelmaa (CodeMix, aiemmin Webclipse), ja JSX-tiedostoilla reagoivissa projekteissa kokeile avoimen lähdekoodin TypeScript IDE: tä. Jos lisäät enemmän kuin yhden, sinun on ratkaistava heidän kiistansa siitä, kumman pitäisi muokata TypeScript-tiedostoja, mutta se ei ole iso juttu.
CodeMix-työkaluja laskutetaan lisäämällä Visual Studio Code -älypuhelimet Eclipseen. Toisin kuin useimmat Eclipse-laajennukset, CodeMixin Angular IDE ei ole ilmainen, mutta sillä on 45 päivän ilmainen kokeilu. Ottaen huomioon, että Visual Studio Code on ilmainen, harkitsisin sitä ennen kuin maksat Angular IDE: stä.
Hinta: ilmainen; Kulmallinen IDE by CodeMix, 29 dollaria (henkilökohtainen) tai 48 dollaria (kaupallinen) vuodessa. Alusta: Windows, MacOS ja Linux.
ActiveState Komodo IDE
Olen ollut Komodo IDE: n käyttäjä ja fani siitä lähtien, kun se esiteltiin ensimmäisen kerran vuonna 2001. Vaikka uudemmat tuotteet, kuten Visual Studio Code ja WebStorm, ovat ylittäneet sen joillakin alueilla, se on edelleen hyvä editori ja IDE.
Komodo IDE tarjoaa edistyneen JavaScript-muokkauksen, syntaksikorostuksen, navigoinnin ja virheenkorjauksen, mutta se ei sisällä JavaScript-koodin tarkistusta. Tätä varten voit aina suorittaa JSHintin kuoressa.
Komodo tukee kymmeniä ohjelmointi- ja merkintäkieliä. Laajan ohjelmointivalikoiman ja merkintäkielen tuen, mukaan lukien korjaus, virheenkorjaus ja profilointi, Komodo IDE on erittäin hyvä valinta päästä päähän -kehitykseen avoimen lähdekoodin kielillä.
Komodolla on koodin korjausmoduuli kaikille kielille, joille se tarjoaa kooditietoja: PHP, Perl, Python, Ruby, Tcl, JavaScript ja Node.js. Valitettavasti tämän lähestymistavan "vähiten yhteinen nimittäjä" -ominaisuus rajoittaa kyvyt muuttujien ja luokan jäsenten uudelleennimeämiseen ja koodin purkamiseen menetelmään. Nämä ovat kuitenkin joitain hyödyllisimpiä tapauksia.
Komodo IDE: ssä on sekä sarakkeiden muokkaus että useita valintoja. Tämä tarjoaa lähes pariteetin Sublime Text- ja TextMate-ohjelmien kanssa massamuokkausten osalta. Niin kauan kuin vertailemme, Komodo on pikemminkin IDE, kun taas Sublime Text on paljon nopeampi. Ja niin kauan kuin keskustelemme suorituskyvystä, Komodon nopeus on parantunut huomattavasti vanhempiin versioihin verrattuna näytön piirtämisessä, haussa ja syntaksin tarkistuksessa.
Komodo IDE: llä on useita ominaisuuksia, joista useimmat kilpailevat tuotteet puuttuvat. Yksi on sen HTTP-tarkastaja, joka sopii erinomaisesti Ajax-soittopyyntöjen virheenkorjaukseen. Toinen on sen Rx (säännöllinen lauseke tai regex) -työkalupakki, joka on loistava tapa rakentaa ja testata säännöllisiä lausekkeita JavaScriptille, Perlille, PHP: lle, Pythonille ja Rubyille.
Yhteistyö on toinen Komodo IDE -erottaja - ajattele sitä Google-dokumentteina koodia varten. Voit luoda istuntoja tiedostoryhmille, lisätä yhteystietoja istuntoihin yhteiskäyttäjinä ja työskennellä yhdessä samojen tiedostojen kanssa samanaikaisesti lähes reaaliaikaisella synkronoinnilla.
Yhteistyö ei korvaa lähdekoodin hallintaa, mutta se on hyödyllinen lisäosa. Komodo IDE integroi lähdekoodin hallinnan CVS: n, Subversionin, Perforcen, Gitin, Mercurialin ja Bazaarin avulla. Vain perusversioiden hallinnan toimintoja tuetaan. Edistyneet toiminnot, kuten haaroitus, on suoritettava käyttämällä erillistä lähdekoodin ohjausasiakasta.
Vaikka Komodolla ei ole omaa JavaScript-dokumentin muotoilijaa, se hyödyntää parasta avointa lähdekoodia tähän tarkoitukseen. JavaScript-tiedostojen oletusmuotoilija on laatikosta JS Beautifier, mutta vielä yhdeksän vaihtoehtoa on käytettävissä pudotusvalikossa.
Komodo IDE tukee asiakaspuolen JavaScriptin virheenkorjausta Chromessa, ja se voi virheenkorjata Node.js: n sekä paikallisesti että etänä. Se myös debugoi Perl-, Python-, PHP-, Ruby-, Tcl- ja XSLT-tiedostoja.
Komodo IDE: ssä on DOM-katseluohjelma, jonka avulla voit tarkastella XML- ja HTML-asiakirjoja kokoontaitettavina puina. Sen avulla voit myös tehdä XPath-hakuja puun suodattamiseksi.
Komodon koodiprofilointi ja yksikötestausmoduulit eivät tue JavaScriptiä. Komodon Code Intelligence -moduuli tukee kuitenkin JavaScriptiä ja Node.js-koodia, joka toteuttaa koodin selaamisen, automaattisen täydennyksen ja puheluviestit.
Komodo IDE voi julkaista tiedostoryhmiä FTP: n, SFTP: n, FTPS: n tai SCP: n kautta. Komodo voi myös synkronoida tiedostoja ja havaita mahdolliset julkaisuristiriidat, jotka saattavat aiheuttaa sinun korvata muiden tekemät muutokset.
Kaiken kaikkiaan Komodo on hyvä, mutta ei hyvä JavaScript IDE, ja hyvä, mutta ei hyvä JavaScript-editori. Se voi kuitenkin palvella tarpeitasi, varsinkin jos työskentelet myös Perlin, Pythonin, PHP: n, Rubyn, Tcl: n tai XSLT: n kanssa.
Kustannukset: 295 dollaria, plus 87 dollaria vuodessa päivityksiin ja tukeen. Alusta: Windows (7 tai uudempi), MacOS (10.9 tai uudempi), Linux.
Apache NetBeans
NetBeansilla on erittäin hyvä tuki JavaScriptille, HTML5: lle ja CSS3: lle web-projekteissa, ja se tukee Cordova / PhoneGap-kehystä JavaScript-pohjaisten mobiilisovellusten rakentamiseen. NetBeans ei ole lohkon nopein IDE, mutta se on yksi täydellisemmistä. Ja tietysti hinta on oikea: NetBeans on saatavana ilmaiseksi avoimen lähdekoodin lisenssillä.
NetBeans JavaScript -editori tarjoaa syntaksikorostuksen, automaattisen täydennyksen ja koodin taittamisen, melkein mitä odotit. JavaScript-muokkausominaisuudet toimivat myös PHP-, JSP- ja HTML-tiedostoihin upotetulle JavaScript-koodille. jQuery-tuki leivotaan editoriin. NetBeans 8.2: lla on uusi tai parannettu tuki Node.js: lle, Expressille, Gulpille, Gruntille, AngularJS: lle, Knockout.js: lle, Jadelle, Mochalle ja Seleniumille.
Koodianalyysi toimii taustalla, kun muokkaat, varoituksia ja vihjeitä. Virheenkorjaus toimii sulautetussa WebKit-selaimessa ja Chromessa, kun NetBeans Connector on asennettu. Debuggeri voi asettaa DOM-, linja-, tapahtuma- ja XMLHttpRequest-katkaisupisteet, ja se näyttää muuttujat, kellot ja puhelupinon. Integroitu selaimen loki-ikkuna näyttää selaimen poikkeukset, virheet ja varoitukset.
NetBeans voi määrittää ja suorittaa yksikötestauksen JsTestDriverilla, joka on JAR-tiedosto (Java-arkisto), jonka voit ladata ilmaiseksi. Yksikkötestien virheenkorjaus otetaan automaattisesti käyttöön, jos määrität Chromen NetBeans Connectorilla yhdeksi JsTestDriver-selaimista, kun määrität JsTestDriver-palvelun ikkunassa.
Kun virheenkorjaat verkkosovellusta Chromessa NetBeans Connectorilla ja muokkaat CSS: ää Chrome Developer Tools -sovelluksessa, NetBeans tallentaa muutokset ja tallentaa ne CSS-tiedostoihin. Jos CSS-tiedostosi on kuitenkin luotu Less- tai Sass-tyylitaulukoista, joudut päivittämään lähdesivun manuaalisesti, koska CSS-tiedostot ovat vain koottu tulosteita.
Sulautetussa WebKit-selaimessa ja Chromessa, johon on asennettu NetBeans Connector, voit käyttää NetBeans-verkkomonitoria tarkastelemaan pyyntöotsikoita, vastauksia ja puhelupinoja REST-viestinnässä. WebSocket-viestintää varten näytetään sekä otsikot että tekstikehykset. Kaiken kaikkiaan NetBeans tarjoaa hieman paremman virheenkorjauskokemuksen Chromen kanssa kuin Firefoxissa Firebugin kanssa.
NetBeans integroi lähdekoodin hallinnan Git-, Subversion-, Mercurial- ja CVS-järjestelmiin. Git-tukea täydentää graafinen Diff-katseluohjelma ja IDE: n hyllyjärjestelmä. NetBeans värikoodaa tiedostojen Git-tilan, antaa sinun tarkastella jokaisen tiedoston versiohistoriaa ja näyttää versio- ja kirjoittajatiedot jokaiselle versiohallittujen tiedostojen riville. NetBeansilla on samanlaiset integraatiot Subversionin, Mercurialin ja CVS: n kanssa, mutta testasin vain Gitin.
NetBeans integroi ongelmanseurannan Jiran ja Bugzillan kanssa. NetBeansin tehtäväikkunassa voit etsiä tehtäviä, tallentaa hakuja, päivittää tehtäviä ja ratkaista tehtäviä rekisteröidyssä tehtävärekisterissä. NetBeansilla on myös tiimipalvelinintegraatio Kenai-infrastruktuuria käyttäville sivustoille.
Sikäli kuin voin selvittää, NetBeansilta puuttuu JavaScript-profilointi, vaikka se voi profiloida Java-sovelluksia ja EJB-moduuleja. Ja vaikka NetBeans pystyy muokkaamaan Java- ja PHP-tiedostoja, se ei voi korjata JavaScriptiä.
Kaiken kaikkiaan NetBeans on kunnollinen kilpailija asiakaspuolen JavaScript-, HTML5- ja CSS3-kehitykseen, varsinkin jos teet myös Java-, PHP- tai C ++ -kehitystä palvelimella. Jos sinulla ei ole WebStormin budjettia ja et pidä Microsoftista, huomaat, että NetBeans tekee työn, kunhan sinulla ei ole kovaa kiirettä.
Hinta: ilmainen. Alusta: Windows, Solaris, MacOS, Linux.
Microsoft Visual Studio 2017
Tarkastellessani Visual Studio 2017: tä keskustelin tuotteesta kokonaisuudessaan vain muutamalla viitteellä JavaScriptiin. Käännän korostuksen tässä.
Kaiken kaikkiaan Visual Studio 2017 toimii erittäin hyvin JavaScript IDE: nä, vaikka se onkin parempi .Net IDE, eikä se ole yhtä hyvä kuin WebStorm for JavaScript. Vaikka se toimii myös hyvin JavaScript-editorina, se on parempi C # -editori, eikä se ole yhtä hyvä tai nopea kuin Sublime Text for JavaScript.
Kuten alla olevasta kuvakaappauksesta näet, Visual Studio 2017 tekee hyvää työtä JavaScript-syntaksin värityksen ja koodin taittamisen kanssa. Se tekee hyvää työtä myös JavaScript-koodinavigoinnilla: Napsauta hiiren kakkospainikkeella funktion tai jäsenen nimeä, ja voit helposti siirtyä määritelmään tai löytää kaikki viitteet. Kun olet tarkastellut määritelmää, voit palata takaisin käyttöliittymän yläosassa olevaan paluunuoleen.
Voit helposti lisätä katkelmia ja ympäröi valintasi sopivalla koodilla, kuten merkkijonomuuttujien HTML- tai URL-koodauksella. JavaScriptin, HTML: n ja CSS: n lisäksi voit muokata Markdown-tiedostoja ja nähdä renderoidun Markdownin, ja voit työskennellä TypeScriptin kanssa.
Lisäksi voit tietysti koodata millä tahansa .Net-kielellä, C ++ - ja Python-kielillä. Ja kuten Visual Studiossa on ollut pitkään, voit työskennellä tietokantojen kanssa suoraan IDE: stä. Visual Studio on erityisen vahva, kun työskentelet SQL Server -tietokantojen kanssa. Voit päästä eroon Visual Studion käytöstä SQL Server Management Studion sijaan suurimmaksi osaksi kehittäjänä haluamiasi tietokantatoimintoja.
Visual Studio 2017 tukee virheenkorjausta melkein missä tahansa selaimessa, jonka haluat heittää, mukaan lukien mobiililaitteiden ja emulaattoreiden selaimet. Sillä on myös kaksi omaa selainta: tavallinen sisäinen verkkoselain, joka on (yllätys!) Internet Explorer -versio, ja Page Inspector, joka näyttää renderoidun sivun sekä kaikki lähteet ja tyylit. Vaikka sivutarkastaja tekee paljon potentiaalisesti aikaa vieviä, käänteisen suunnittelun juttuja asettaakseen itsensä sivulle, kun olet siinä, voit pysyä siellä tarvitsematta taistella Visual Studion, selaimen ja selaimen kehitystyökalujen kanssa .
Visual Studio 2017: n suorituskyky on yleensä melko hyvä, jos annat sille tarpeeksi muistia ja suorittimen tehoa, mutta se vaatii yleensä huomattavia resursseja. Visual Studio 2017: ssä on erinomainen suorituskyvyn diagnostiikka sovelluksille, mutta kaiken kaikkiaan ne eivät ole niin hyödyllisiä tavalliselle JavaScript-koodille, joka yleensä toimii syvällä selaimen sisällä. Visual Studiossa on erityinen JavaScript-toimintojen ajoitus, HTML-käyttöliittymän reagointi ja JavaScript-muistityökalut, mutta ne koskevat vain JavaScript-pohjaisia Universal Windows Platform -projekteja, ei Web-projekteja, jotka satunnaisesti käyttävät Javascriptia.
Visual Studio 2017 sisältää erinomaiset Node.js-sovellusten muokkaukset, IntelliSense, profiloinnin, NPM-integraation, TypeScript-tuen, virheenkorjauksen paikallisesti ja etänä (Windows, MacOS, Linux) sekä virheenkorjauksen Azure Web Appsissa ja Azure Cloud Servicesissä. Sillä on myös tuki CSS: lle, HTML: lle, JavaScriptille, TypeScriptille, CoffeeScriptille ja vähemmän. Tähän sisältyy JSHintin suorittaminen kirjoittaessasi, jolloin voit minimoida JavaScript-tiedostot kontekstivalikosta ja kääntää CoffeeScript-tiedostot automaattisesti tallennuksen yhteydessä, jolloin luotu JavaScript näkyy esikatselussa.
