1. Sviluppare Applicazioni Mobile Native in HTML e JavaScript Fabio Franzini Consulente, Programmatore e MCT Trainer su piattaforma .NET www.fabiofranzini.com fabio@fabiofranzini.com @franzinifabio

2. Evoluzione del Web per Mobile Evoluzione del “Mobile Web” Albori: WAP, cHTML, mHTML Phone’s WEB Browser WAP: puah!!

3. Mobile Web Oggi Smart Phones Sistemi Operativi Mobile completi iPhone OS, Android, Simbian OS, Blackberry, Windows Mobile, WebOS, Maemo, ecc.. Cross-platform Web Browser (Webkit!!) 3G, WiFi

4. Sviluppare oggi per il Mobile Web Powerfull Web Browser Web 2.0 Social Geo-localization Ecc..

5. Vantaggi HTML CSS JavaScript Deploy semplice Ecc..

8. Native App e App. Store

9. Ok, ma… iPhone: Objective-C Android, Blackberry: Java Nokia Symbian: C / JavaScript Sony Ericsson: Java Window Mobile: .NET / C++ / VB

10. …quindi!!

11. Native App VS Web App

12. Ok, capito!! Ma allora?

13. Native App Cross-Platform HTML, CSS, JavaScript, Images, ecc.. + API native del telefono (Geo-localizzazione, Contatti, Accelerometro, Fotocamera, Vibrazione, ecc ..) = Wrapper sul Web Browser con supportoalle API del telefono.

14. Un esempio? PhoneGap

15. Cos’è PhoneGap PhoneGap è uno strumento di sviluppo open source, realizzato da Nitobi, per la costruzione veloce e facile di Applicazioni Mobile con JavaScript

16. PhoneGap in dettaglio 1/2 E’ un container con wrapper sul Web Browser del dispositivo Espone un insieme di API del dispositivo, astraendo le medesime, e le rendedisponibilitramite JavaScript

17. PhoneGap in dettaglio 2/2 In base alla piattaforma con la quale dovrà interfacciarsi, l’implementazione sarà di sviluppata in: Objective C, Java e così via; L’implementazione è fornita dallo stesso framework, il runtime si appoggia sul Web Browser e sulle estensioni per quella piattaforma. Il risultato è un pacchetto composto di due elementi principali: il runtime si occupa di dialogare direttamente con il dispositivo le parti statiche (HTML, JavaScript, ecc) offrono l’interfaccia verso l’utente.

18. PhoneGap in dettaglio

19. Piattaforme supportate iPhone / iPad?? Android Blackberry Palm ~ Symbian ~ Windows Mobile ~

20. iPhone??? http://bit.ly/7wmgsv “The recent changes to Apple’s iPhone developer agreement, this has ZERO impact on PhoneGap!” “Apps built with PhoneGap will continue to be reviewed based on their own merits and NOT dismissed/rejected because they use PhoneGap.”

21. Features Accelerometro Audio Camera Contacts File IO SMS Settings

22. Features Supportate

24. document.getElementById("platform").innerHTML = device.platform;

25. Alert

26. navigator.notification.alert(“Mio Messaggio", “Attenzione", "Ok");

27. Vibration

28. navigator.notification.vibrate(1000);

29. Media

30. var media = Media.new("hammer_time.wav", win, fail);

31. media.play();

33. Esempio di API 3/3 GetCurrentAcceleration function getAccel() { var win = function(a) { document.getElementById('x').innerHTML = a.x; document.getElementById('y').innerHTML = a.y; document.getElementById('z').innerHTML = a.z; }; var fail = function(){}; navigator.accelerometer.getCurrentAcceleration(win, fail); }

34. Framework di supporto? XUI jQuery jQuery UI jQTouch QuelloCheVolete.js

35. Alcuni numeri iPhone App = 364 kb Html, CSS, JavaScript, Media = 124 kb Stessa Web App + PhoneGap = 240 kb

36. Applicazioni già sviluppate

37. Applicazioni già sviluppate http://phonegap.com/projects

38. Vantaggi di PhoneGap Sviluppo con semplice conoscenza di HTML, CSS, JavaScript Creazione di Applicazioni Native!!! Multi Piattaforma!!!! Applicazioni accettate dall’Apple AppStore!!!! ;-)

39. Svantaggi di PhoneGap Documentazione in costruzione Non realmente all’altezza per applicazioni con uso massivo di grafica (almeno per adesso).

40. è l’unico runtime? No, ma… PhoneGap Nokia WRT Appcelerator Nokia S60 iPhone Android Blackberry Windows Mobile

41. PhoneGap Demo

42. Domande??Tuttochiaro??

43. Ciao, allaprossima!! ;-) Fabio Franzini www.fabiofranzini.com fabio@fabiofranzini.com @franzinifabio