Programavimas

Apžvalga: 6 geriausi „JavaScript“ IDE

„JavaScript“ šiandien naudojama daugeliui skirtingų programų. Dažniausiai „JavaScript“ veikia su HTML5 ir CSS kuriant žiniatinklio sąsajas. Tačiau „JavaScript“ taip pat padeda kurti mobiliąsias programas, o „Node.js“ serverių pavidalu rado svarbią vietą užpakalinėje dalyje. Laimei, „JavaScript“ kūrimo įrankiai - tiek redaktoriai, tiek IDE - auga, kad galėtų įveikti naujus iššūkius.

Kodėl verta naudoti IDE, o ne redaktorių? Pagrindinė priežastis yra ta, kad IDE gali derinti ir kartais profilizuoti jūsų kodą. IDE taip pat palaiko ALM sistemas, integruodami jas su tokiais kaip „Git“, „GitHub“, „Mercurial“, „Subversion“ ir „Perforce“, kad valdytų versijas. Tačiau kai daugiau redaktorių prideda kabliukų prie šių sistemų, ALM palaikymas tampa vis mažiau skiriamasis.

„Eclipse 2018“ su „JavaScript“ kūrimo įrankiais

Dar senovėje, kai „Java Swing“ buvo nauja ir įdomi, man patiko naudoti „Eclipse“ Java plėtrai, bet netrukus perėjau prie kitų „Java IDE“. Prieš penkerius ir daugiau metų, kai atlikau „Android“ kūrimą su „Eclipse“, manau, kad ši patirtis yra gera, bet pasikeitusi. Kai bandžiau naudoti „Eclipse Luna“ su JSDT „JavaScript“ kūrimui 2014 m., Ji nuolat rodė klaidingai teigiamas galiojančio kodo, perėjusio „JSHint“, klaidas.

Susijęs vaizdo įrašas: kas yra „JavaScript“? Kūrėjas Brendanas Eichas paaiškina

Brendanas Eichas, „JavaScript“ programavimo kalbos kūrėjas, paaiškina, kaip ši kalba naudojama ir kodėl ji vis dar mėgstama tarp programuotojų dėl paprasto naudojimo.

Laimei, nuo tada prie plokštės žengė keli pardavėjai ir atvirojo kodo projektai. „Eclipse 2018“ su „JavaScript“ kūrimo įrankiais turi tinkamą „JavaScript“ redagavimo priemonę ir „Chrome“ pagrįstą derintuvą, tačiau jis nežino nei apie „TypeScript“, kurį naudoja „Angular“, nei apie „ES6“ ir „JSX“ failus, kuriuos naudoja „React“.

„Eclipse“ visada patiko didžiulė papildinių rinka. Jei naudojate „TypeScript“, apsvarstykite nemokamą „TypeScript 1.0.0“ papildinį. Kalbant apie „Angular“, „TypeScript“ ir ES6, apsvarstykite komercinį „Angular IDE“ („CodeMix“, anksčiau „Webclipse“), o „React“ projektams su JSX failais išbandykite atvirojo kodo „TypeScript IDE“. Jei pridėsite daugiau nei vieną, turėsite išspręsti jų ginčą dėl to, kuris turėtų redaguoti „TypeScript“ failus, tačiau tai nėra didelė problema.

„CodeMix“ įrankiai yra apmokestinami kaip „Visual Studio Code“ išmaniųjų pridėjimas prie „Eclipse“. Skirtingai nuo daugumos „Eclipse“ papildinių, „CodeMix“ „Angular IDE“ nėra nemokama, tačiau 45 dienų nemokama bandomoji versija. Atsižvelgiant į tai, kad „Visual Studio Code“ yra nemokama, svarsčiau, kad prieš atsiskaitant už „Angular IDE“.

Kaina: nemokama; „CodeMix“ kampinis IDE, 29 USD (asmeninis) arba 48 USD (komercinis) per metus. Platforma: „Windows“, „MacOS“ ir „Linux“.

„ActiveState Komodo IDE“

Aš buvau „Komodo IDE“ vartotojas ir gerbėjas nuo tada, kai jis buvo pirmą kartą pristatytas 2001 m. Nors naujesni produktai, tokie kaip „Visual Studio Code“ ir „WebStorm“, kai kuriose srityse jį pranoko, jis vis dar yra geras redaktorius ir IDE.

„Komodo IDE“ suteikia išplėstinį „JavaScript“ redagavimą, sintaksės paryškinimą, naršymą ir derinimą, tačiau jame nėra „JavaScript“ kodo tikrinimo. Tam visada galite paleisti „JSHint“ apvalkale.

„Komodo“ palaiko daugybę programavimo ir žymėjimo kalbų. Komodo IDE turi platų programavimo ir žymėjimo kalbos palaikymo spektrą, įskaitant pertvarkymą, derinimą ir profiliavimą. Tai labai geras pasirinkimas kuriant atviro kodo kalbas.

„Komodo“ turi kodo pertvarkymo modulį visoms kalboms, kurioms teikia kodo intelektą: PHP, Perl, Python, Ruby, Tcl, JavaScript ir Node.js. Deja, šio požiūrio pobūdis „mažiausiai bendras vardiklis“ riboja galimybes pervardyti kintamuosius ir klasės narius bei išgauti kodą į metodą. Nepaisant to, tai yra vieni naudingiausių atvejų.

Komodo IDE gali redaguoti stulpelius ir kelis pasirinkimus. Tai užtikrina beveik vienodą „Sublime Text“ ir „TextMate“, kiek tai susiję su masiniais redagavimais. Kol darome palyginimą, „Komodo“ yra labiau IDE, o „Sublime Text“ - daug greitesnis. Kol diskutuojame apie našumą, Komodo greitis pastebimai pagerėjo, palyginti su senesnėmis versijomis, atliekant ekrano piešimą, paiešką ir sintaksės tikrinimą.

„Komodo IDE“ turi keletą funkcijų, kurių trūksta daugumai konkuruojančių produktų. Vienas iš jų yra HTTP inspektorius, kuris puikiai tinka derinant „Ajax“ skambučius. Kitas yra „Rx“ (reguliarioji išraiška arba „regex“) įrankių rinkinys, kuris yra puikus būdas sukurti ir išbandyti įprastas „JavaScript“, „Perl“, PHP, „Python“ ir „Ruby“ išraiškas.

Bendradarbiavimas yra dar vienas „Komodo IDE“ diferenciatorius - galvokite apie tai kaip apie „Google“ dokumentus kodui. Galite sukurti seansus failų grupėms, pridėti kontaktų prie sesijų kaip bendradarbiai, tada vienu metu dirbti su tais pačiais failais, beveik sinchronizuojant realiuoju laiku.

Bendradarbiavimas nepakeičia šaltinio kodo valdymo, tačiau yra naudingas priedas. „Komodo IDE“ integruoja šaltinio kodo valdymą naudodama CVS, „Subversion“, „Perforce“, „Git“, „Mercurial“ ir „Bazaar“. Palaikomos tik pagrindinės versijų valdymo operacijos. Išplėstinės operacijos, tokios kaip šakojimas, turi būti atliekamos naudojant atskirą šaltinio kodo valdymo klientą.

Nors „Komodo“ neturi savo „JavaScript“ dokumento formato, šiam tikslui naudojasi geriausiu nemokamu atviruoju šaltiniu. Iš dėžutės numatytasis „JavaScript“ failų formatavimas yra „JS Beautifier“, tačiau dar devynios parinktys yra pasiekiamos išskleidžiamajame meniu.

„Komodo IDE“ palaiko kliento „JavaScript“ derinimą „Chrome“ ir gali derinti „Node.js“ tiek lokaliai, tiek nuotoliniu būdu. Taip pat derinamas „Perl“, „Python“, PHP, „Ruby“, „Tcl“ ir „XSLT“.

„Komodo IDE“ yra DOM peržiūros priemonė, leidžianti peržiūrėti XML ir HTML dokumentus kaip sulankstomus medžius. Tai taip pat leidžia atlikti XPath paieškas, kad filtruotų medį.

„Komodo“ kodo profiliavimas ir vieneto testavimo moduliai nepalaiko „JavaScript“. Tačiau „JavaScript“ ir „Node.js“ palaiko „Komodo“ kodo intelekto modulis, įgyvendinantis kodų naršymą, automatinį užbaigimą ir skambučių patarimus.

„Komodo IDE“ gali skelbti failų grupes per FTP, SFTP, FTPS ar SCP. „Komodo“ taip pat gali sinchronizuoti failus ir aptikti galimus publikavimo konfliktus, dėl kurių galite perrašyti kitų žmonių pakeitimus.

Apskritai, „Komodo“ yra geras, bet ne puikus „JavaScript IDE“ ir geras, bet ne puikus „JavaScript“ redaktorius. Tačiau tai gali gerai patenkinti jūsų poreikius, ypač jei dirbate ir su „Perl“, „Python“, PHP, „Ruby“, „Tcl“ arba „XSLT“.

Kaina: 295 USD ir 87 USD per metus už atnaujinimus ir palaikymą. Platforma: „Windows“ (7 ar naujesnė), „MacOS“ (10.9 ar naujesnė), „Linux“.

„Apache NetBeans“

„NetBeans“ labai gerai palaiko „JavaScript“, HTML5 ir CSS3 žiniatinklio projektuose, be to, ji palaiko „Cordova“ / „PhoneGap“ sistemą, skirtą kurti „Java“ pagrindu sukurtas mobilias programas. „NetBeans“ nėra greičiausias IDE bloke, tačiau jis yra vienas iš išsamesnių. Ir, žinoma, kaina yra tinkama: „NetBeans“ galima nemokamai įsigyti pagal atvirojo kodo licenciją.

„NetBeans“ „JavaScript“ redaktorius suteikia sintaksės paryškinimą, automatinį užbaigimą ir kodo sulankstymą, beveik taip, kaip jūs tikėjotės. „JavaScript“ redagavimo funkcijos taip pat veikia naudojant „JavaScript“ kodą, įdėtą į PHP, JSP ir HTML failus. „jQuery“ palaikymas yra įtrauktas į redaktorių. „NetBeans 8.2“ turi naują ar patobulintą „Node.js“ ir „Express“, „Gulp“, „Grunt“, „AngularJS“, „Knockout.js“, „Jade“, „Mocha“ ir „Selenium“ palaikymą.

Kodo analizė vykdoma fone, kai redaguojate, pateikdami įspėjimus ir užuominas. Derinimas veikia įterptojoje „WebKit“ naršyklėje ir „Chrome“ su įdiegta „NetBeans“ jungtimi. Derintojas gali nustatyti DOM, linijos, įvykio ir XMLHttpRequest pertraukimo taškus, o jis rodys kintamuosius, laikrodžius ir skambučių kaminą. Integruotame naršyklės žurnalo lange rodomos naršyklės išimtys, klaidos ir įspėjimai.

„NetBeans“ gali sukonfigūruoti ir atlikti vieneto testavimą naudodamas JSTestDriver - JAR (Java archyvo) failą, kurį galite atsisiųsti nemokamai. Derinant vieneto bandymus, automatiškai įgalinamas, jei „Chrome“ su „NetBeans Connector“ nurodote kaip vieną iš „JsTestDriver“ naršyklių, kai „Services“ lange sukonfigūruojate „JsTestDriver“.

Kai derinate žiniatinklio programą „Chrome“ naudodami „NetBeans Connector“ ir redaguojate CSS naudodami „Chrome“ kūrėjų įrankius, „NetBeans“ užfiksuos pakeitimus ir išsaugos juos CSS failuose. Tačiau jei jūsų CSS failai buvo sugeneruoti iš „Less“ arba „Sass“ stiliaus lapų, turėsite rankiniu būdu atnaujinti šaltinio lapą, nes CSS failai yra tik sukompiliuoti.

Įdėtoje „WebKit“ naršyklėje ir „Chrome“ su įdiegta „NetBeans Connector“ galite naudoti „NetBeans“ tinklo monitorių, kad peržiūrėtumėte užklausų antraštes, atsakymus ir skambučių paketus REST ryšiui. Ryšiams su „WebSocket“ rodomos antraštės ir teksto rėmeliai. Apskritai „NetBeans“ suteikia šiek tiek geresnę „Chrome“ derinimo patirtį, nei jūs gaunate „Firefox“ su „Firebug“.

„NetBeans“ integruoja šaltinio kodo valdymą su „Git“, „Subversion“, „Mercurial“ ir CVS. „Git“ palaikymą papildo grafinis „Diff“ žiūrovas ir lentynų sistema IDE. „NetBeans“ spalvomis koduoja failų „Git“ būseną, leidžia peržiūrėti kiekvieno failo taisymo istoriją ir rodo kiekvienos versijos valdomų failų eilutės taisymo ir autoriaus informaciją. „NetBeans“ turi panašias integracijas su „Subversion“, „Mercurial“ ir CVS, bet aš išbandžiau tik „Git“.

„NetBeans“ integruoja problemų stebėjimą su Jira ir Bugzilla. „NetBeans“ užduočių lange galite ieškoti užduočių, išsaugoti paieškas, atnaujinti užduotis ir išspręsti užduotis savo registruotoje užduočių saugykloje. „NetBeans“ taip pat turi komandos serverio integraciją svetainėms, naudojančioms Kenai infrastruktūrą.

Kiek galiu nustatyti, „NetBeans“ neturi jokio „JavaScript“ profiliavimo, nors jis gali profiluoti „Java“ programas ir EJB modulius. Nors „NetBeans“ gali modifikuoti „Java“ ir PHP, jis negali „JavaScript“.

Apskritai, „NetBeans“ yra tinkamas kliento „JavaScript“, HTML5 ir CSS3 kūrimo varžovas, ypač jei serveryje taip pat kuriate „Java“, PHP ar C ++. Jei neturite „WebStorm“ biudžeto ir nemėgstate „Microsoft“, pastebėsite, kad „NetBeans“ atlieka šį darbą, jei tik jūs labai neskubate.

Kaina: nemokama. Platforma: „Windows“, „Solaris“, „MacOS“, „Linux“.

„Microsoft Visual Studio 2017“

Peržiūrėdamas „Visual Studio 2017“ aptariau visą produktą, pateikdamas tik keletą nuorodų į „JavaScript“. Čia pakeisiu akcentą.

Apskritai, „Visual Studio 2017“ labai gerai veikia kaip „JavaScript IDE“, nors tai yra geresnė .Net IDE ir nėra tokia gera, kaip „WebStorm“, skirta „JavaScript“. Nors jis taip pat labai gerai veikia kaip „JavaScript“ redaktorius, jis yra geresnis C # redaktorius ir nėra toks geras ar greitas kaip „Sublime Text for JavaScript“.

Kaip matote toliau pateiktoje ekrano kopijoje, „Visual Studio 2017“ daro gerą darbą su „JavaScript“ sintaksės dažymu ir kodo sulankstymu. Jis taip pat gerai dirba naudodamas „JavaScript“ kodo naršymą: Dešiniuoju pelės mygtuku spustelėkite funkciją arba nario vardą, ir jūs galite lengvai pereiti prie apibrėžimo arba rasti visas nuorodas. Baigę žiūrėti apibrėžimą, galite paspausti rodyklę atgal sąsajos viršuje, kad grįžtumėte ten, kur buvote.

Galite lengvai įterpti fragmentus ir apgaubti savo pasirinkimą atitinkamu kodu, pvz., HTML ar URL eilutės kintamųjų kodavimu. Be „JavaScript“, HTML ir CSS, galite redaguoti „Markdown“ failus ir matyti pateiktą „Markdown“ bei dirbti su „TypeScript“.

Be to, jūs, žinoma, galite koduoti bet kuria .Net kalba, C ++ ir Python. Kaip jau seniai buvo „Visual Studio“, su duomenų bazėmis galite dirbti tiesiai iš IDE. „Visual Studio“ yra ypač stipri dirbant su „SQL Server“ duomenų bazėmis. Galite išvengti „Visual Studio“, o ne „SQL Server Management Studio“, naudodamiesi daugeliu duomenų bazės operacijų, kurias norite atlikti kaip kūrėjas.

„Visual Studio 2017“ palaiko derinimą beveik visose naršyklėse, kurias norite mesti, įskaitant naršykles mobiliuosiuose įrenginiuose ir emuliatoriuose. Ji taip pat turi dvi savo naršykles: paprastą vidinę žiniatinklio naršyklę, kuri yra (nustebimas!) „Internet Explorer“ versija, ir „Page Inspector“, rodančią pateiktą puslapį kartu su visais šaltiniais ir stiliais. Nors „Page Inspector“ atlieka daug potencialiai daug laiko reikalaujančių, atvirkštinės inžinerijos dalykų, kad nustatytų save puslapiui, patekę į jį galėsite likti ten, neturėdami žongliruoti „Visual Studio“, naršykle ir naršyklės kūrėjo įrankiais. .

„Visual Studio 2017“ našumas paprastai yra gana geras, jei suteikiate pakankamai atminties ir procesoriaus galios, tačiau tam paprastai reikia daug išteklių. „Visual Studio 2017“ turi puikią programų diagnostiką, tačiau iš esmės jos nėra tokios naudingos įprastam „JavaScript“ kodui, kuris paprastai veikia giliai naršyklėje. „Visual Studio“ turi konkretų „JavaScript“ funkcijos laiką, HTML vartotojo sąsajos reagavimą ir „JavaScript“ atminties įrankius, tačiau jie taikomi tik „JavaScript“ pagrįstiems „Universal Windows“ platformos projektams, o ne žiniatinklio projektams, kuriuose naudojama „JavaScript“.

„Visual Studio 2017“ apima puikų „Node.js“ programų redagavimą, „IntelliSense“, profiliavimą, NPM integravimą, „TypeScript“ palaikymą, derinimą vietoje ir nuotoliniu būdu („Windows“, „MacOS“, „Linux“) ir derinimą „Azure Web Apps“ ir „Azure Cloud Services“. Jis taip pat palaiko CSS, HTML, „JavaScript“, „TypeScript“, „CoffeeScript“ ir mažiau. Tai apima „JSHint“ paleidimą rašant, leidžiant sumažinti „JavaScript“ failus iš kontekstinio meniu ir automatiškai kaupiant „CoffeeScript“ failus, rodant sugeneruoto „JavaScript“ peržiūrą.