Google Gears, jQuery ja RIA

Todo Application icon128x128Tarkoitus oli testata erästä mahdollista sovelluskehitysprojektia varten vaihtoehtoisia tapoja toteuttaa pelkästään selaimessa ajettava sovellus, jota voisi käyttää myös koneen ollessa ilman verkkoyhteyttä. RIA sovelluksen tekniikoiksi valikoitui Google Gears ja jQuery.

Google Gears selainlaajennus tarjoaa integroidun relaatiotietokannan (SQLite) sekä mahdollisuuden pysyvään tiedostojen offline-tallennukseen, jonka ansiosta sovellus on mahdollista ajaa selaimessa verkkoyhteyden tilasta riippumatta. Sovelluksen käyttämät tiedostot tallentuvat Gearsin sovellushakemistoon. Verkkoyhteyden ollessa päällä, sovellus hakee tiedostojen uusimmat versiot, jos nämä ovat päivittyneet. jQuery tarjoaa monipuolisen ja laadukkaan JavaScript Frameworkin mm. käyttöliittymäkehitykseen sekä koko joukon valmiita käyttöliittymäelementtejä (jQuery UI ThemeRoller).

Kokeilussa syntyi Todo Application, jonka käyttöliittymäelementit ovat dynaamisesti muuttuvia ja tiedot tallentuvat tietokantaan. Käyttäjän on lisäksi mahdollista nappia painamalla lisätä sovellus esimerkiksi omalle työpöydälleen, jolloin sovellus on aina tarvittaessa helposti käsillä.

Sovellusta voi kokeilla osoitteessa www.jonkkari.com/todo. Sovellus tarvitsee toimiakseen Google Gears -laajennuksen selaimeen. Laajennus on saatavissa ainakin seuraaviin selaimiin: Firefox, Safari, Opera ja Internet Explorer. Sovelluksen käyttöliittymä on testattu paremmin Firefoxissa, joten en takaa sen näkymistä oikein muilla selaimilla.

Todo Application Screenshot 1

Todo Application Screenshot 2

  

Todo Application Screenshot 3

This entry was posted in Ohjelmointi, RIA and tagged , , , , , , . Bookmark the permalink.

One Response to Google Gears, jQuery ja RIA

  1. Pingback: Teemu Jönkkäri » HTML5 demo – tehtävälistasovellus

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>