Mobile Apps con Apache Cordova - Lo Stretto Digitale

giuseppe.pizzimenti 1,029 views 69 slides Jul 14, 2014
Slide 1
Slide 1 of 69
Slide 1
1
Slide 2
2
Slide 3
3
Slide 4
4
Slide 5
5
Slide 6
6
Slide 7
7
Slide 8
8
Slide 9
9
Slide 10
10
Slide 11
11
Slide 12
12
Slide 13
13
Slide 14
14
Slide 15
15
Slide 16
16
Slide 17
17
Slide 18
18
Slide 19
19
Slide 20
20
Slide 21
21
Slide 22
22
Slide 23
23
Slide 24
24
Slide 25
25
Slide 26
26
Slide 27
27
Slide 28
28
Slide 29
29
Slide 30
30
Slide 31
31
Slide 32
32
Slide 33
33
Slide 34
34
Slide 35
35
Slide 36
36
Slide 37
37
Slide 38
38
Slide 39
39
Slide 40
40
Slide 41
41
Slide 42
42
Slide 43
43
Slide 44
44
Slide 45
45
Slide 46
46
Slide 47
47
Slide 48
48
Slide 49
49
Slide 50
50
Slide 51
51
Slide 52
52
Slide 53
53
Slide 54
54
Slide 55
55
Slide 56
56
Slide 57
57
Slide 58
58
Slide 59
59
Slide 60
60
Slide 61
61
Slide 62
62
Slide 63
63
Slide 64
64
Slide 65
65
Slide 66
66
Slide 67
67
Slide 68
68
Slide 69
69

About This Presentation

Workshops 2014 - Lo Stretto Digitale


Slide Content

MOBILE APPSMOBILE APPS
con APACHE CORDOVA e tecnologie WEBcon APACHE CORDOVA e tecnologie WEB
Workshops 2014 Workshops 2014
MESSINA -MESSINA - Libreria “Colapesce”Libreria “Colapesce”- 12- 12/07/2014/07/2014

GIUSEPPE PIZZIMENTIGIUSEPPE PIZZIMENTI
Sviluppo software professionalmente da 18 anniSviluppo software professionalmente da 18 anni
Programmo per passione da 30 Programmo per passione da 30
Primo pc utilizzato :Primo pc utilizzato :
Programmo con tecnologie web da 20 anniProgrammo con tecnologie web da 20 anni
Si, sono anziano... grazie per averlo notato! Si, sono anziano... grazie per averlo notato!

GIUSEPPE PIZZIMENTIGIUSEPPE PIZZIMENTI
https://twitter.com/gpizzimentihttps://twitter.com/gpizzimenti
https://www.linkedin.com/in/giuseppepizzimentihttps://www.linkedin.com/in/giuseppepizzimenti
https://plus.google.com/u/0/+GiuseppePizzimenti/https://plus.google.com/u/0/+GiuseppePizzimenti/
https://www.facebook.com/giuseppe.pizzimentihttps://www.facebook.com/giuseppe.pizzimenti
http://www.slideshare.net/giuseppe.pizzimentihttp://www.slideshare.net/giuseppe.pizzimenti

09/01/200709/01/2007

12/03/198912/03/1989

20092009
20112011

CAPABILITIESCAPABILITIES
Network ConnectionNetwork Connection
Battery EventsBattery Events
AccelerometerAccelerometer
CompassCompass
GeolocationGeolocation
CameraCamera
Media playbackMedia playback
CaptureCapture
Access files on device or networkAccess files on device or network
NotificationsNotifications
ContactsContacts
GlobalizationGlobalization
Splash screenSplash screen
StorageStorage

https://build.phonegap.com/pluginshttps://build.phonegap.com/plugins

GOOD NEWS (Android edition)GOOD NEWS (Android edition)
http://www.mobilexweb.com/blog/android-4-4-kitkat-browser-chrome-http://www.mobilexweb.com/blog/android-4-4-kitkat-browser-chrome-
webviewwebview

GOOD NEWS (iOS edition)GOOD NEWS (iOS edition)
http://9to5mac.com/2014/06/03/ios-8-webkit-changes-finally-allow-http://9to5mac.com/2014/06/03/ios-8-webkit-changes-finally-allow-
all-apps-to-have-the-same-performance-as-safari/all-apps-to-have-the-same-performance-as-safari/

CHI USA PHONEGAP / CORDOVACHI USA PHONEGAP / CORDOVA
...ecc...ecc......ecc...ecc...
http://www.tricedesigns.com/2012/03/27/who-uses-phonegapapache-http://www.tricedesigns.com/2012/03/27/who-uses-phonegapapache-
cordova/cordova/

PREREQUISITIPREREQUISITI
http://cordova.apache.org/docs/en/edge/guide_cli_index.md.html#The%20Command-Line%20Interfacehttp://cordova.apache.org/docs/en/edge/guide_cli_index.md.html#The%20Command-Line%20Interface
http://cordova.apache.org/docs/en/2.5.0/guide_getting-http://cordova.apache.org/docs/en/2.5.0/guide_getting-
started_android_index.md.htmlstarted_android_index.md.html
http://www.oracle.com/technetwork/java/javase/downloads/http://www.oracle.com/technetwork/java/javase/downloads/
jdk8-downloads-2133151.htmljdk8-downloads-2133151.html
http://ant.apache.org/bindownload.cgihttp://ant.apache.org/bindownload.cgi
http://developer.android.com/sdk http://developer.android.com/sdk
http://nodejs.org/http://nodejs.org/
http://git-scm.com/downloadshttp://git-scm.com/downloads

PREREQUISITIPREREQUISITI
http://www.dominikgorecki.com/2012/12/installing-cordovaphonegap-http://www.dominikgorecki.com/2012/12/installing-cordovaphonegap-
for-android-on-windows-a-suppliment/for-android-on-windows-a-suppliment/

INSTALLAZIONEINSTALLAZIONE
C:\C:\> npm install -g cordova> npm install -g cordova

CREAZIONE PROGETTOCREAZIONE PROGETTO
D:\Users\Giuseppe\Documenti\CordovaProjects>D:\Users\Giuseppe\Documenti\CordovaProjects>
cordova create rubrica it.lostrettodigitale.rubrica Rubricacordova create rubrica it.lostrettodigitale.rubrica Rubrica
cordova platform add androidcordova platform add android
cordova platforms lscordova platforms ls

CREAZIONE PROGETTOCREAZIONE PROGETTO
cordova plugin add org.apache.cordova.devicecordova plugin add org.apache.cordova.device
cordova plugin add org.apache.cordova.dialogscordova plugin add org.apache.cordova.dialogs
cordova plugin add org.apache.cordova.contactscordova plugin add org.apache.cordova.contacts
cordova plugin lscordova plugin ls

CREAZIONE PROGETTOCREAZIONE PROGETTO

CREAZIONE PROGETTOCREAZIONE PROGETTO

CREAZIONE PROGETTOCREAZIONE PROGETTO

LANCIO PROGETTOLANCIO PROGETTO
cordova build cordova build
cordova build android --releasecordova build android --release
cordova emulate androidcordova emulate android
cordova serve android cordova serve android http://localhost:8000/http://localhost:8000/
adb devicesadb devices
cordova run androidcordova run android

LANCIO PROGETTOLANCIO PROGETTO

STRUMENTI AGGIUNTIVISTRUMENTI AGGIUNTIVI
oppureoppure

UIUI
...ecc...ecc......ecc...ecc...

UIUI
http://goratchet.com/http://goratchet.com/

UIUI

UIUI

UIUI

UIUI

UIUI

UIUI

UIUI

AGGIUNGI CONTATTOAGGIUNGI CONTATTO

CERCA CONTATTICERCA CONTATTI

CERCA CONTATTICERCA CONTATTI

CERCA CONTATTICERCA CONTATTI

DEBUGDEBUG
https://developer.chrome.com/devtools/docs/mobile-emulationhttps://developer.chrome.com/devtools/docs/mobile-emulation

DEBUGDEBUG
http://ripple.incubator.apache.org/http://ripple.incubator.apache.org/

DEBUGDEBUG
C:> npm install -g ripple-emulatorC:> npm install -g ripple-emulator
ripple emulateripple emulate

DEBUGDEBUG
http://app.phonegap.com/http://app.phonegap.com/
http://phonegap.com/blog/2014/04/23/phonegap-developer-app/http://phonegap.com/blog/2014/04/23/phonegap-developer-app/

DEBUGDEBUG
http://people.apache.org/~pmuellr/weinre/docs/latest/Home.htmlhttp://people.apache.org/~pmuellr/weinre/docs/latest/Home.html

DEBUGDEBUG
C:/C:/> npm install -g weinre> npm install -g weinre
weinre --boundHost -all- weinre --boundHost -all- http://localhost:8080/http://localhost:8080/
ipconfig ipconfig

DEBUGDEBUG
http://localhost:8080/client/#rubricahttp://localhost:8080/client/#rubrica

DEBUGDEBUG
cordova plugin add org.apache.cordova.consolecordova plugin add org.apache.cordova.console

DEBUGDEBUG

DEBUGDEBUG
adb logcat *:W -v briefadb logcat *:W -v brief

DEBUGDEBUG

Write once, run anywhere ?Write once, run anywhere ?

Write once, (will) run (and distribute) anywhere ?Write once, (will) run (and distribute) anywhere ?

Possiamo sviluppare tutti i tipi di apps?Possiamo sviluppare tutti i tipi di apps?

Possiamo sviluppare molti tipi di apps?Possiamo sviluppare molti tipi di apps?

E' un'esperienza ottimale di sviluppo?E' un'esperienza ottimale di sviluppo?

Si sta evolvendo?Si sta evolvendo?

GRAZIEGRAZIE!!
https://twitter.com/StrettoDigitalehttps://twitter.com/StrettoDigitale - #glsd - #glsd