WWW-ohjelmointi

Javascript-kirjastot

Javascript-ohjelmien tekoon on tarjolla lukuisia avointa lähdekoodia olevia ja vapaasti käytettäviä kirjastoja, joita käyttämällä ohjelmoijan ei tarvitse tehdä aivan kaikkia toiminnallisuuksia itse. Esimerkiksi käyttöliittymän yhtenäisen ulkoasun luomiseen on useita vaihtoehtoisia kirjastoja.

Esimerkiksi JS Bin-sivustolla on valikon “Add library”-kohdassa lisättävissä laaja kirjo erilaisiin kirjastoihin viittaavia <script>-tagia.

jQuery-ui

jQuery-ui on jQueryn pohjalle laajennuksena rakennettu käyttöliittymäkirjasto. Kirjasto sisältää laajan kokoelman erilaisia “widgettejä”, eli käyttöliittymäkomponentteja, efektejä sekä interaktiivisia toiminnallisuuksia. Widgettien kokoelmaan kuuluu muun muassa nappulat, dialogi-ikkunat, valikot, liukusäätimet, välilehtisysteemit, “sisältöhaitarit” sekä automaattisesti täydennettävät syöttökentät. Nämä kaikki ovat teemoitettavissa yhdenmukaisella ulkoasulla.

jQuery-ui tarjoaa myös työkalut omien interaktiivisten käyttöliittymien rakentamiseen raahattavilla ja pudotettavilla elementeillä.

Tarjolla oleviin toimintoihin voi tutustua jQuery-ui:n demosivulla

jQuery Mobile

jQuery Mobile on erityisesti mobiililaitteiden käyttöön tarkoitettu jQueryyn pohjautuva käyttöliittymäkirjasto. Sitä käyttäen voi tehdä helposti hyvän näköisiä ja teemoitettavia responsiivisia, eli mobiililaitteen pienelle näytölle automaattisesti skaalautuvia, käyttöliitymiä.

Käyttöliittymäkomponentteja esittelevä jQuery Mobilen demosivusto.

Bootstrap

Bootstrap on alun perin Twitterin omaan sisäiseen käyttöön kehitetty käyttöliittymäkirjasto. Bootstrap koostuu ennen kaikkea käyttöliittymälle yhtenäisen tyylin antavista CSS-säännöistä sekä HTML-pohjista, joilla näitä CSS-määrittelyitä voidaan käyttää.

Lisäksi Bootstrapin mukana tulee joukko jQuery-lisäosina toteutettuja Javascript-komponentteja, joilla voidaan toteuttaa interaktiivisempia käyttöliittymän osia, kuten popup-ikkunoita ja kuvakaruselleja.

Bootstrap-komponenttien esittelyä

AngularJS

AngularJS on erityisesti web-sovellusten tekemiseen suunnattu kirjasto. Se soveltuu erityisesti tilanteisiin, joissa käyttöliittymäkomponenttien pitää dynaamisesti päivittyä niihin tehtyjen muutosten seurauksina. Esimerksi tilanteisiin, joissa yhden näytöllä olevan liukusäätimen arvon muuttaminen vaikuttaa yhteen tai useampaan muuhun näytöllä olevaan komponenttiin.

AngularJS keskittyy ennemminkin käyttöliittymäkomponenttien ja Javascript-objektien väliseen toiminnallisuuteen kuin käyttöliittymän ulkoasuun. Ulkoasun voi puolestaan muodostaa esimerkiksi Bootstrapilla.

AngularJS:n opiskelusivusto