== 1. AngularJS:n esittely ja työkalun asentaminen == ---- '''1.1 Yleisesittely''' Tällä wikisivulla olisi tarkoitus yleisesitellä Googlen kehittämä AngularJS -niminen frameworkki, jota on maailmalla mainostettu monin superlatiivein ja ylistyssanoin. Kuten frameworkin nimestä voidaan päätellä, AngularJS keskittyy lähinnä javascriptiin, se mahdollistaa periaatteessa vain yhden javascript-kirjaston avulla hyvinkin monipuolisia toimintoja ja tehtäviä voitavan suorittaa asiakaspäässä, selaimessa. AngularJS:n käyttö tarjoaa yksittäisen javascript-kirjastonsa ansiosta helpotusta sovelluskehittäjille, sillä nykysovelluskehityksessä on ja on ollut tavanomaista käyttää hyvinkin monia, useita javascript-plugineja suorittamaan tiettyjä tehtäviä. AngularJS:llä kehitettävät sovellukset ovat luonteeltaan ns. '''yksisivupohjaisia sovelluksia''' [http://en.wikipedia.org/wiki/Single-page_application (Single Page Applications)], mikä lyhyesti ilmaistuna tarkoittaa sitä, että sovelluksessa toimii yksi yksittäinen sivu, jolle ladataan sisältöjä eri reittejä pitkin Angular-ohjaimen ohjaamana. Reitit ja ohjaimet tulevat myöhemmin käsittelyyn. AngularJS toinen vahvuus liittyy ns. '''Model View Controller''' [http://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller MVC] -mallin hyödyntämiseen, jonka avulla voidaan sovelluksen näkymät (views), logiikka (model) ja ohjaus (controller) erottaa toisistaan. Oheinen kuva havainnollistaa MVC-mallin toimintaperiaatetta. [[Image(http://www.jansipke.nl/wp-content/uploads/mvc.png)]] Kuva osoitteesta http://www.jansipke.nl/model-view-controller-mvc-with-jsp-and-jstl/. Kuvan ideana on esittää MVC-mallin toimintaa yleisellä tasolla. Kontrolleri eli ohjain määrää aina sen, minkälaista dataa mallista (model) haetaan ja laitetaan näkymään (viewiin) tulostumaan. MVC-mallin ansiosta AngularJS -sovellukset ovat luonnostaan hyvin modulaarisia ja helposti ylläpidettäviä. Wikin myöhemmissä luvuissa esitellään entiteetit tarkemmin. AngularJS tarjoaa DOM-manipuloinnin avuksi jqLiten, joka on eräänlainen miniversio jquerystä, jota on mahdollista käyttää rinnan jqueryn kanssa. Lisäksi AngularJS:stä löytyy yksikkötestaamisen avuksi erilaisia sisäänrakennettuja työkaluja, joista lisätietoja voi katsoa mm. [http://docs.angularjs.org/guide/unit-testing täältä.] ---- '''1.2 Työkalun asentaminen''' Tarvittavan javascript-kirjaston saat ladattua menemällä osoitteeseen http://angularjs.org/ Valitse sieltä kohta Download ja valitse mieleisesi asennuspaketti. Tämän jälkeen, kun luot uuden html-dokumentin, saat angular.min.js kirjaston käyttöön sisällyttämällä html-dokumentin mielellään loppuosaan (optimaalisempaa kuin dokumentin head-osuuteen) {{{ }}} tagin. Seuraavassa yksinkertainen esimerkki angularJS:iä käyttävästä html-dokumentista. {{{ First App

AngularJS esimerkki

{{name}}
}}} [https://trac.cc.jyu.fi/projects/web-sovellukset/wiki/2014/angularjs/part2 Seuraava luku]