You are browsing the archive for HTML5.

Will Angular 2 make front-end development great again?

10.11.2016 in Yleinen by Toni Ylärinne

Angular 2.0 julkaistiin 15.9.2016 vihdoinkin. Angular 2 on herättänyt paljon kysymyksiä Web Front End -kehittäjäyhteisössä siitä asti, kun ensimmäiset speksit Angular 2 -tiimin puolelta saatiin ulos. Kyseessä on kokonaan uudelleen kirjoitettu versio hyvin suositusta Web Front End Frameworkistä. Suoraa näppärää päivitystapaa 1.X versiosta 2.0 versioon ei ole. Tosin Angular 1.5 -sovelluskehityksessä voidaan ottaa huomioon muutamia seikkoja, jotka hieman vähentävät koodin refaktorointia versioon 2 siirryttäessä. Kuvaavaa on, että erittäin olennaista version 1 peruskäsitettä controlleria ei Angular 2 versiosta löydy. Angular 2 on component-pohjainen ratkaisu.  Read the rest of this entry →

Front End Web Developerin työkalupakki

17.3.2015 in HTML5, Oppiminen, Sovelluskehitys by Toni Ylärinne

Ajaxin tulon jälkeen web front end -kehityksessä ei paljon tapahtunut, nyt web-kehitys on taas tehnyt isoja harppauksia viime vuosina HTML5:den myötä. Asiakkaat tarpeissa on modernin näköiset responsiiviset web-sitet, joiden käytettävyys on aikaisempia selkeämpi parempi. Yhä useampi web-siten käyttäjä tulee sitelle mobiililaitteella. HTML5 on uusien API:en myötä tuonut paljon uusia mahdollisuuksia tehdä asioita selaimessa, joista ennen ei voinut kuin haaveilla tai ratkaisut sai ehkä toteutettua erilaisten hackien kautta. Mitä tekniikoita ja kirjastoja ajantasalla oleva front end -koodarin pitää nykyisin sitten osata? Read the rest of this entry →

Mauri Merosen ensiarviot Googlen uudesta Web Designerista

4.10.2013 in HTML5, Yleinen by Toni Ylärinne

Google julkaisi pari päivää sitten uuden ilmaisen Web Designer -tuotteen beta-version, jolla voidaan toteuttaa HTML5-bannereita. Sovelton uusi kouluttaja Mauri Meronen kirjoitti aiheesta jutun Creative-killan puolella ja se voi kiinnostaa myös kehittäjiäkin:

http://kilta.sovelto.fi/creative/digimarkkinointi/google-web-designer-vai-google-banner-designer/

HTML5 Mobile Apps – onko niistä johonkin?

15.1.2013 in HTML5, Sovelluskehitys, Yleinen by Toni Ylärinne

Elämme nyt vahvasti mobiilikautta. Kosketusnäytölliset älypuhelimet ja tabletit ovat syrjäyttäneet monessa tilanteessa perinteiset tietokoneet. Yhä useammin perinteiselle web-sivustolle saapuva surfaaja käyttää mobiililaitetta. Esimerkiksi Facebookin käytöstä suurin osa on nykyisin mobiilikäyttöä. Mobiililaitteet, valmistajien app storeineen, ovat myös muuttaneet käyttäjien toimintaa sovellusten asentamisessa. Mobiililaitteisiin asennetaan maksullisia ja ilmaisia sovelluksia enemmän kuin koskaan asennettiin perinteisiin tietokoneisiin. Millaisia vaihtoehtoja sitten meillä on tehdä mobiilisovelluksia?

Suosituin tapa mobiilisovelluskehitykselle on tällä hetkellä ns. natiivi-sovellukset, jossa app koodataan tietylle päätelaitteelle ja mahdollisesti vielä sen tietylle käyttöjärjestelmän versiolle. Tämä tarkoittaa sitä, että jos haluan nykypäivänä pitää tyytyväisen edes jonkunlaisen osan suomalaisista mobiilikäyttäjistä, minun tarvitsee toteuttaa sovellukseni erikseen ainakin iPhonelle, iPadille, Androidin eri versioille, Windows Phone 7.5/8:lle, Windows RT:lle ja Symbianille. Onko tämä aina järkevää?

Syitä miksi toteuttaisit mobiilisovellukset natiivisti laitteelle?

  • Sovelluksesi käyttäjillä on kaikilla saman alustan laite. Organisaation sisällä voisi näin ollakin. BYOD (Bring Your Own Device) on kuitenkin tuonut meille sen, että harvoin tällaista tilannetta enää on.
  • Sinulla on runsaasti resursseja, osaamista ja rahaa tehdä sovellus useammalle alustalle (iPhone, iPad, Android, Windows Phone, Windows RT tai jotain muuta) ja ylläpitää niiden versioiden kehittyessä useampaa koodipohjaa.
  • Sinulla vahva luottamus, että käyttäjä asentaa ja käyttää sovellustasi. Kuinka montaa eri mobiilisovellusta sinä käytät itse säännöllisesti?
  • Liiketoimintamallisi hyötyy app store -jakelukanavasta. Sovellus on helposti myytävissä erialustojen omissa app storeissa. App Storet mahdollistaa myös kätevästi In-App Purchaset, jolloin sovelluksen ladannut pystyy ostamaan lisäsisältöä ja uusia ominaisuuksia natiiviin sovellukseensa.
  • Sovelluksesi tekniset vaatimukset, kuten suorituskyky ja laitetietoihin pääsy ovat sellaisia, ettei se kunnolla onnistu HTML5:llä.

Mitä HTML5 sitten mahdollistaisi?

Mobiiliselainten HTML5 -tuki alkaa olla jo hieno. Tärkeimpänä ominaisuutena HTML5 tarjoaa meille tavan toteuttaa yhdellä koodipohjalla toimivan sovelluksen, joka toimii kaikilla moderneilla mobiililaitteilla. Lähestymistapoja on kaksi. Se perinteinen web sivusto -ratkaisu, jonne käyttäjä tulee url-osoitteen kautta ja HTML5 ja CSS3:n ominaisuuksia hyödyntäen toteutetaan Responsive Web Design, jolla sivuston käyttöliittymä saadaan skaalatuksia, niin että jokaisella päätelaitteella ja näyttökoolla saadaan parhain käyttökokemus. Perinteisen web sivuston lisäksi HTML5:llä voidaan nykypäivänä toteuttaa myös natiivisovellusten kaltaisia appejä. HTML5 AppCachellä voit kasata sovelluksesi tarvitsemat html-, css3-, javascript-tiedostot ja muut tarvittavat resurssit, ja ne saadaan tallennettua päätelaitteeseen myös offline käyttöä varten. Web Storage API:lla saat tallennettua hyödynnettävää tietoa suoraan päätelaitteeseen. Geolocation API:lla saadaa päätelaitteen paikkatiedot luettua ja Web Sockets mahdollistaa tarvittaessa Server Side Pushit laitteeseen. Yksi HTML5 App:n hyvä puoli, jota ei kannata turhaan väheksyä, on app storen validointiprosessin kiertäminen. Natiivi sovellusten validointiprosessi voi kestää pitkään, sen voi joutua tekemään useasti, ennen kuin saat sovelluksen julkaistua ja uuden version julkaisu aiheuttaa uuden validointiprosessin. Tämä voi olla hyvin turhauttavaa.

Hybridi HTML5/natiivi App

Mitä meiltä sitten HTML5:stä puuttuu? Emme pääse moneen mobiililaitteen ominaisuuteen käsiksi. Esimerkiksi kameran käyttö ei onnistu, ei päästä käsiksi käyttäjän media-kirjastoihin, kontaktitietoihin, kalenteriin tai kiihtyvyysanturitietoon. W3C on ratkaisemassa näitä asioita Device APIs Working Groupissa , mutta tällä hetkellä tukea ei vielä mobiililaitteistamme löydy. Jos näitä ominaisuuksia sovelluksessa tarvitaan, yksi vaihtoehto voisi olla hybridi-sovelluksen toteuttaminen. HTML5:llä toteutettu sovellus pakataan natiivin sovelluksen sisälle. Ja natiivisovellus voi tarjota ne ominaisuudet, joita HTML5 ei tarjoa. PhoneGab tarjoaa kehittäjälle hyvän frameworkin tällaisten hybridi-sovellusten toteuttamiselle oli sitten kohdelaite iOS, Android, Windows Phone tai Windows 8. Hybridi-sovellus myös mahdollistaa sovelluksen myymisen app storen kautta.

Vaihtoehtoja mobiilisovelluskehitykselle on siis paljon. Natiivit sovellukset tulevat näyttelemään vielä isoa osaa mobiili app -kehityksestä, mutta HTML5 tuntuu varmalta hevoselta veikata sitä, millä tulevaisuudessa tullaan vihdoin toteuttamaan päätelaiteriippumattomia älypuhelin- ja tabletti-sovelluksia.