App web

on Applicazioni Web

Creare una app per iOS e Android con HTML, AngularJs e PhoneGap

Da mesi ho ho scoperto PhoneGap, uno strumento per trasformare un’applicazione web in un’app nativa per iOS e Android.

App web

L’idea di PhoneGap è di incapsulare un’applicazione web in un browser chromeless, cioè senza bordo, in modo da farla sembrare un’app nativa. Sta poi nell’abilità del web designer di disegnare l’interfaccia utente in modo intelligente e funzionale per gli smartphone. Usando tecnologie web standard come HTML5, CSS3 e JavaScript per lo sviluppo cross-platform evitiamo così di sviluppare la stessa app con i linguaggi nativi di ciascuna piattaforma.

PhoneGap non fa altro che creare un’app per iOS (o Android) che lancia un browser con pagina iniziale l’applicazione web che andiamo a costruire. Ci mette inoltre a disposizione alcune API che ci permettono di far uso dei sensori del dispositivo, come il GPS, l’accelerometro, la fotocamera, la bussola, lo stato della rete, ecc, che possiamo richiamare tramite chiamate Javascript.

Per creare un’applicazione a tutti gli effetti dobbiamo servirci della cosidetta Single Page Architecture, ovvero che non fa uso del classico paradigma client-server usando richieste HTTP per il cambio pagina, ma tutto deve essere gestito a livello client via Javascript.

Questo limite diventa una virtù perchè possiamo far uso dei tanto in voga framework Javascript. Il mio preferito è AngularJs, un framework Javascrip MVC, supportato da Google e davvero molto potente.

Per quanto riguarda l’interfaccia grafica, possiamo utilizzare Ratchet e Twitter Bootstrap anche insieme. Ratchet ci mette a disposizione alcuni componenti che emulano i widget nativi di iOS, mentre con Bootstrap possiamo creare il resto dell’interfaccia, sfruttando le capacità responsive di questo ottimo framework.

Nel prossimo articolo mi addentrerò nei dettagli dello sviluppo di un’app di esempio. Intanto installatevi PhoneGap sul vostro sistema.

scrivi un commento

Commento

Ricevi un avviso se ci sono nuovi commenti. Oppure iscriviti senza commentare.

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.

  1. Ciao,
    attendo con impazienza il prossimo articolo!
    Avevo installato PhoneGap prima delle ferie, ma a parte averci giocherellato non ho trovato il tempo e l’interesse per approfondire il prodotto che è sicuramente interessante. Alla fine ho concluso che è meglio un bel sito HTML5 (cioè pensato come web app e non come classico sito sfogliabile) che n applicazioni derivate con PhoneGap, l’unica cosa che perderei è l’accesso diretto ad alcune parti dell’hardware. Tu cosa ne pensi?
    Aggiungo che mi risulta che permetta di rilasciare app anche per altri ambienti mobile (tra cui Windows Phone) oltre iOs e Android.
    La cosa che non ho ancora capito è che bisogno c’è di installare Node.js e non mi son ancora chiari alcuni aspetti della compilazione che avvengono via web …

    • La forza di Phonegap è quella di mettere a disposizione tutti i sensori del dispositivo a servizio dell’applicazione web. Quindi geolocalizzazione, compasso, accelerometro, fotocamera, notifiche (beep e vibrazione) e contatti. Se la tua applicazione non necessita di queste risorse, va benissimo un’applicazione html5 responsive.

      Inoltre la forza di Phonegap risiede nella creazione di applicaizioni cross-platform, ovvero che girano sulle più conosciute piattaforme mobile: iOS, Android, Blackberry, Windows Phone, Windows 8.

      Node.js è indispensabile perchè è in bundle con il gestore a pacchetti NPM, base su cui è distribuito phonegap.

Webmention

  • Le librerie necessarie per un progetto PhoneGap - Parte 3 - Dynamick Settembre 20, 2013

    […] mostro quali sono le librerie necessarie da includere nel progetto. Vi ricordo di leggere l’introduzione e la seconda parte di questo […]