{"id":257,"date":"2016-06-26T15:08:11","date_gmt":"2016-06-26T13:08:11","guid":{"rendered":"http:\/\/localhost:8888\/wordpress\/?p=257"},"modified":"2016-06-26T20:56:30","modified_gmt":"2016-06-26T18:56:30","slug":"javascript-editorin-valinta","status":"publish","type":"post","link":"https:\/\/www.pilvikoodari.net\/?p=257","title":{"rendered":"JavaScript editorin valinta"},"content":{"rendered":"<p><strong>Editorin valinta &#8211; kriteerit ja valinnan vaikeus<\/strong><\/p>\n<p>Editorin\/koodausymp\u00e4rist\u00f6n valinta on osittain mielipidekysymys. Valittaessa JavaScriptille sopivaa editoria, tarjolla on useita ehdokkaita. Editoria valitessa kriteereiksi voisi asettaa ainakin seuraavia ominaisuuksia:<\/p>\n<ul>\n<li><strong>Koodin t\u00e4ydennys<\/strong> eli code complete -ominaisuudet. Helpottaa koodausta huomattavasti kun editori ehdottaa sopivaa t\u00e4ydennyst\u00e4 ja n\u00e4ytt\u00e4\u00e4 samalla helpin kyseisest\u00e4 asiasta.<\/li>\n<li><strong>Navigointiominaisuudet<\/strong>. Haluatko p\u00e4\u00e4st\u00e4 navigoimaan tiedostojen ja funktioiden v\u00e4lill\u00e4 sujuvasti?<\/li>\n<li><strong>Koodin oikeellisuustarkistus<\/strong>. Jos koodissa on syntaksivirhe, on k\u00e4tev\u00e4\u00e4 jos editori n\u00e4ytt\u00e4\u00e4 kohdan heti punaisella.<\/li>\n<li><strong>&#8221;Marking of Occurrences&#8221;<\/strong> eli jos valitsee koodista esim. muuttujan, editori korostaa muuttujan muut esiintym\u00e4t koodista. T\u00e4m\u00e4 t\u00e4rke\u00e4 ominaisuus l\u00f6ytyykin jo k\u00e4yt\u00e4nn\u00f6ss\u00e4 jokaisesta editorista.<\/li>\n<li><strong>Refaktorointiominaisuudet<\/strong>. Jos n\u00e4ihin on tottunut, ilman on vaikea p\u00e4rj\u00e4t\u00e4. Nopeuttaa ty\u00f6t\u00e4 ja auttaa parantelemaan koodia lennossa jolloin koodista tulee selke\u00e4mp\u00e4\u00e4.<\/li>\n<li><strong>Debuggausominaisuudet<\/strong>. JavaScriptinkin kanssa debuggaus on mahdollista ja saattaa helpottaa ohjelmointia huomattavasti.<\/li>\n<li><strong>Integraatio versionhallintaan.<\/strong> Onko tarpeen esim. suora integraatio GitHubiin?<\/li>\n<li>Ty\u00f6kalun\u00a0<strong>keveys<\/strong>. Pient\u00e4 projektia tai yht\u00e4 tiedostoa muokatessa riitt\u00e4\u00e4 kevyt editori mutta laajan projektin hallinta sujuu paremmin kunnollisella IDE ty\u00f6kalulla. Oikea ty\u00f6kalu oikeassa paikassa.<\/li>\n<li><strong>JSON tuki<\/strong>. K\u00e4tev\u00e4 jos haluaa k\u00e4sitell\u00e4 JSON teksti\u00e4 editorissa.<\/li>\n<li><strong>Tukeeko\u00a0niit\u00e4 frameworkkeja\/moduuleita joita tulet projektissa k\u00e4ytt\u00e4m\u00e4\u00e4n<\/strong>? Jos kyseess\u00e4 on vaikkapa AngularJS -projekti, olisi editorissa hyv\u00e4 olla tuki AngularJS:lle. Node.js tuki?<\/li>\n<li><strong>Hinta<\/strong>. Ilmaiseksi on saatavilla varsin hyvi\u00e4 ty\u00f6kaluja mutta jos p\u00e4\u00e4set valitsemaan vapaasti ja esim. ty\u00f6nantaja maksaa lisenssin, valikoima laajenee ja tarjolle tulee ammattimaisempia ominaisuuksia.<\/li>\n<\/ul>\n<p><strong>Tuumasta toimeen ja editoria etsim\u00e4\u00e4n<\/strong><\/p>\n<p>Asetamme nyt editorille seuraavat vaatimukset\/odotukset:<\/p>\n<ul>\n<li>ilmainen<\/li>\n<li>JavaScript navigointi, syntaksin tarkistus, code complete yms ominaisuudet<\/li>\n<li>file Explorer tarvitaan integroidusti<\/li>\n<li>debuggaustuki plussaa<\/li>\n<li>integraatio versionhallintaan\u00a0plussaa<\/li>\n<\/ul>\n<p>Seuraavassa muutamia ehdokkaita. Muitakin varmasti on mutta n\u00e4m\u00e4 nousivat t\u00e4ll\u00e4 kertaa esiin.<\/p>\n<p><span style=\"text-decoration: underline;\">IDE kehitysymp\u00e4rist\u00f6t<\/span><\/p>\n<ul>\n<li>Eclipse\n<ul>\n<li>JSDT eli JavaScript Development Tools tarjoaa hyv\u00e4n setin JavaScript -ominaisuuksia Eclipseen<\/li>\n<li>Core ominaisuudet: <a href=\"http:\/\/wiki.eclipse.org\/JSDT\" target=\"_blank\">http:\/\/wiki.eclipse.org\/JSDT<\/a><\/li>\n<li>JSDT mainoslause: Eclipse project <i>aimed to build the most accurate JavaScript IDE<\/i> while keeping it <i>very fast<\/i><\/li>\n<li>Uusin versio 3.8 julkaistu hiljattain (22.6.2016)<\/li>\n<li>JSDT webbisivu: <a href=\"http:\/\/www.eclipse.org\/webtools\/jsdt\/\" target=\"_blank\">http:\/\/www.eclipse.org\/webtools\/jsdt\/<\/a>\u00a0T\u00e4rkeimm\u00e4t ominaisuudet lueteltu t\u00e4m\u00e4n sivun linkkien takana.<\/li>\n<li>JSDT projektisivu jossa my\u00f6s download: <a href=\"https:\/\/projects.eclipse.org\/projects\/webtools.jsdt\" target=\"_blank\">https:\/\/projects.eclipse.org\/projects\/webtools.jsdt<\/a><\/li>\n<li><strong>valitaan jatkoon koska tutumpi ymp\u00e4rist\u00f6 kirjoittajalle kuin NetBeans<\/strong><\/li>\n<\/ul>\n<\/li>\n<li>NetBeans\n<ul>\n<li>hyv\u00e4t ominaisuudet JavaScriptin koodaamiseen<\/li>\n<li>kehittyv\u00e4 ja monipuolinen<\/li>\n<li>l\u00f6ytyy hyvi\u00e4 tutoriaaleja miten p\u00e4\u00e4see alkuun<\/li>\n<li><em>The following JavaScript frameworks are supported: jQuery, JSON, Knockout, Ext Js, AngularJS, JsDoc, ExtDoc, and ScriptDoc<\/em>.<\/li>\n<li>Node.js tuki l\u00f6ytyy my\u00f6s<\/li>\n<li>Tietoa HTML5 ominaisuuksista: <a href=\"https:\/\/netbeans.org\/features\/html5\/\" target=\"_blank\">https:\/\/netbeans.org\/features\/html5\/ <\/a><\/li>\n<li><strong>hyv\u00e4 vaihtoehto!? Ei kuitenkaan jatkoon ainakaan viel\u00e4. Hyv\u00e4 AngularJS editori?<\/strong><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<div><span style=\"text-decoration: underline;\">Kevyet editorit<\/span><\/div>\n<ul>\n<li>Notepad++\n<ul>\n<li>heikohko tuki JavaScript koodaukseen?<\/li>\n<li>joitakin plugineita saatavilla mutta ei vaikuta lupaavalta<\/li>\n<li>JSON viewerin\u00e4 ok?<\/li>\n<li><strong>ei jatkoon<\/strong><\/li>\n<\/ul>\n<\/li>\n<li>Sublime Text\n<ul>\n<li>versio 3 on t\u00e4ll\u00e4 hetkell\u00e4 Beta vaiheessa<\/li>\n<li>evaluointik\u00e4yt\u00f6ss\u00e4 ilmainen, ei kiinte\u00e4\u00e4 aikarajaa evaluointik\u00e4yt\u00f6lle<\/li>\n<li>js ominaisuudet plugineilla<\/li>\n<li>uusia ominaisuuksia kehitetty mutta silti melko rajallinen toiminnallisuus?<\/li>\n<li><a href=\"https:\/\/www.sublimetext.com\/3\" target=\"_blank\">https:\/\/www.sublimetext.com\/3<\/a><\/li>\n<li><strong>ei jatkoon<\/strong><\/li>\n<\/ul>\n<\/li>\n<li>atom.io\n<ul>\n<li>code complete yms. ominaisuuksia<\/li>\n<li>v\u00e4lilehdet<\/li>\n<li>file system browser ikkunan reunassa<\/li>\n<li>kevyt ja moderni<\/li>\n<li><em>Atom is a desktop application built with HTML, JavaScript, CSS, and Node.js integration<\/em><\/li>\n<li><a href=\"https:\/\/atom.io\/\" target=\"_blank\">https:\/\/atom.io\/<\/a><\/li>\n<li><b>kokeilemisen arvoinen mutta ei kuitenkaan jatkoon<\/b><\/li>\n<\/ul>\n<\/li>\n<li>Visual Studio Code\n<ul>\n<li>Microsoftin uusi kevyt editori, jossa melko hyv\u00e4 JavaScript tuki<\/li>\n<li>kevyt ja kehittyv\u00e4, tuore<\/li>\n<li>moderni ulkoasu<\/li>\n<li>t\u00e4ysin ilmainen ja open source vaikka Microsoftin tuote<\/li>\n<li>simppeli file explorer tiedostojen v\u00e4lill\u00e4 siirtymiseen<\/li>\n<li>navigointi, syntaksin tarkistus, code complete, Marking of Occurrences, yms. perustoiminnot<\/li>\n<li>debuggaus<\/li>\n<li>git tuki<\/li>\n<li>ladattavissa erilaisia laajennoksia<\/li>\n<li><a href=\"https:\/\/code.visualstudio.com\/\" target=\"_blank\">https:\/\/code.visualstudio.com\/<\/a><\/li>\n<li><strong>valitaan jatkoon<\/strong><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<div>N\u00e4ill\u00e4 ty\u00f6kaluilla aloitetaan: pienenpiin projekteihin <strong>Visual Studio Code<\/strong> ja isompiin projekteihin <strong>Eclipse + JSDT<\/strong>. Aika n\u00e4ytt\u00e4\u00e4, riitt\u00e4v\u00e4tk\u00f6 n\u00e4iss\u00e4 ominaisuudet mutta uskoisin ett\u00e4 n\u00e4ill\u00e4 p\u00e4\u00e4see hyvin vauhtiin!<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Editorin valinta &#8211; kriteerit ja valinnan vaikeus Editorin\/koodausymp\u00e4rist\u00f6n valinta on osittain mielipidekysymys. Valittaessa JavaScriptille sopivaa editoria, tarjolla on useita ehdokkaita. Editoria valitessa kriteereiksi voisi asettaa ainakin seuraavia ominaisuuksia: Koodin t\u00e4ydennys eli code complete -ominaisuudet. Helpottaa koodausta huomattavasti kun editori ehdottaa sopivaa t\u00e4ydennyst\u00e4 ja n\u00e4ytt\u00e4\u00e4 samalla helpin kyseisest\u00e4 asiasta. Navigointiominaisuudet. Haluatko p\u00e4\u00e4st\u00e4 navigoimaan tiedostojen ja funktioiden &#8230; <a title=\"JavaScript editorin valinta\" class=\"read-more\" href=\"https:\/\/www.pilvikoodari.net\/?p=257\" aria-label=\"Lue lis\u00e4\u00e4 aiheesta JavaScript editorin valinta\">Lue lis\u00e4\u00e4<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11,10,4,12],"tags":[],"class_list":["post-257","post","type-post","status-publish","format-standard","hentry","category-github","category-json","category-microsoft","category-tyokalut"],"_links":{"self":[{"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=\/wp\/v2\/posts\/257","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=257"}],"version-history":[{"count":19,"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=\/wp\/v2\/posts\/257\/revisions"}],"predecessor-version":[{"id":276,"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=\/wp\/v2\/posts\/257\/revisions\/276"}],"wp:attachment":[{"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=257"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=257"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.pilvikoodari.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=257"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}