Ionic Framework, introduzione

7 settembre 2015

Ionic è un framework che consente di sfruttare al meglio le tecnologie Web per creare applicazioni mobile con look and feel simile a quelle native e in questo ambito si rivela tra le soluzioni di maggior successo. Ma per capire meglio dove si colloca Ionic Framework nel panorama dello sviluppo mobile, dobbiamo fare un breve riepilogo dell’attuale stato dell’arte.

Tipologie di applicazioni mobile

In ambito mobile possiamo individuare tre tipologie di applicazioni:

TipologiaDescrizione
App nativeSono applicazioni scritte e compilate per una specifica piattaforma utilizzando i linguaggi di programmazione e librerie supportati dal particolare sistema operativo mobile (es. Java per Android)
App webIn questa categoria ricadono le pagine Web ottimizzate per dispositivi mobili sfruttando le tecnologie Web, in particolare HTML5, JavaScript e CSS3
App ibrideSono applicazioni che cercano di sfruttare il meglio delle due categorie precedenti: sono scritte con tecnologie Web ma vengono eseguite localmente all’interno di un’applicazione nativa e possono interagire con il dispositivo.

Le applicazioni native hanno dalla loro parte il vantaggio di poter sfruttare a pieno le caratteristiche della piattaforma mobile e le funzionalità del disposivto, di essere generalmente più efficienti e di avere un aspetto grafico integrato con quello dell’interfaccia grafica del sistema operativo.

Tuttavia, sviluppare un’app che possa essere eseguita sulle più comuni piattaforme mobile significa sviluppare applicazioni diverse con linguaggi differenti.

Le applicazioni Web, sfruttando tecnologie standard, consentono di condividere lo stesso codice tra piattaforme mobile diverse. Dal momento però che si tratta sostanzialmente di siti Web ottimizzati per il mobile, le loro funzionalità non sono disponibili quando un dispositivo è offline. Inoltre, le applicazioni Web non possono accedere alle funzionalità del dispositivo, come ad esempio il file system, ed il loro aspetto grafico è generalmente non integrato con quello della piattaforma.

Le applicazioni ibride sfruttano il meglio dell’approccio nativo e di quello Web, consentendo di utilizzare lo stesso codice basato sulle tecnologie Web per le diverse piattaforme mobile. Tuttavia anche le applicazioni ibride possono soffrire dello stesso problema delle applicazioni Web: la mancata integrazione dell’aspetto grafico con la specifica piattaforma mobile.

Apache Cordova & Co.

Nello sviluppo di applicazioni mobile ibride Cordova è senza dubbio uno dei framework più noti insieme al suo derivato PhoneGap. Si tratta sostanzialmente di framework di sviluppo che consentono di generare applicazioni native per le diverse piattaforme mobile che incorporano applicazioni Web.

Grazie a questi strumenti, è possibile creare la logica e interfaccia utente dell’applicazione sfuttando HTML, CSS e JavaScript, accedere alla funzionalità della piattaforma mobile tramite apposite API e creare pacchetti per ciascuna piattaforma.

>> Leggi ora la Guida Apache Cordova di HTML.it!

Ionic, il “Bootstrap delle app ibride”

In questo contesto Ionic Framework si pone come un supporto per la creazione di interfacce grafiche per applicazioni ibride. Infatti, come abbiamo già detto, uno dei problemi principali delle applicazioni Web e ibride è la mancata o difficile integrazione dell’aspetto grafico di un’app con il layout grafico della piattaforma ospite. Il risultato può essere un aspetto totalmente difforme da quello atteso in una certa piattaforma mobile.

Il framework è realizzato dal team Drifty e gli stessi autori affermano che Ionic può essere considerato “il Bootstrap per le applicazioni ibride”: come Bootstrap ha significato un punto di riferimento per la creazione di siti e applicazioni Web responsivi, Ionic vuole essere il punto di riferimento per la creazione di applicazioni mobile ibride con un aspetto il più possibile vicino ai componenti della piattaforma nativa.

I loro autori hanno raccolto le migliori best practice per lo sviluppo di interfacce mobile con tecnologie Web e le hanno codificate in questo framework, evitando quindi che ogni sviluppatore riparta da zero nello sviluppo dell’interfaccia di una nuova applicazione.

AngularJS

Da un punto di vista tecnico, il framework utilizza AngularJS come motore per definire i componenti dell’interfaccia grafica. In sostanza, Ionic è costituito da un insieme di direttive Angular riutilizzabili ed eventualmente espandibili per disegnare l’interfaccia grafica con un approccio dichiarativo.

La conoscenza di AngularJS è quindi un requisito importante per sfruttare al meglio questo framework. La nostra guida ad AngularJS può essere d’aiuto in questo.

SASS per la gestione del look’n’feel

L’aspetto grafico predefinito è ispirato al look and feel di iOS7, ma è possibile effettuare delle personalizzazioni effettuando l’override del CSS e/o impostando variabili e mixin di SASS.

>> Leggi ora la Guida SASS di HTML.it!

Il debug all’interno di un browser

Come avremo modo di vedere, lo sviluppo di applicazioni ibride con Ionic è semplificato dalla disponibilità di un vero e proprio ambiente di sviluppo che consente di creare lo scheletro iniziale di un’applicazione, di compilarla per una piattaforma mobile e di effettuare il debug all’interno di un browser.

A ciò si aggiunge la licenza MIT che consente a chiunque di utilizzare liberamente il framework e i suoi sorgenti.

Link utili

Tutte le lezioni

 

1 2 3... 29

Se vuoi aggiornamenti su Ionic Framework, introduzione inserisci la tua e-mail nel box qui sotto:
 
X
Se vuoi aggiornamenti su Ionic Framework, introduzione

inserisci la tua e-mail nel box qui sotto:

Ho letto e acconsento l'informativa sulla privacy

Acconsento al trattamento dei dati per attività di marketing