Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
How PhoneGap really works
Search
Ilya Pukhalski
February 12, 2013
Programming
5
990
How PhoneGap really works
PhoneGap (PhoneGap API's, PhoneGap plugins, PhoneGap Build) from behind
Ilya Pukhalski
February 12, 2013
Tweet
Share
More Decks by Ilya Pukhalski
See All by Ilya Pukhalski
There's a bot for that
pukhalski
1
280
50 Shades of Flux
pukhalski
3
350
Why Mobile Web Still Sucks
pukhalski
3
500
Responsive Typography: Wrap-Up
pukhalski
8
370
Next Level SVG
pukhalski
1
1.5k
XFramework: the story so far
pukhalski
0
450
XFramework: build cross-platform responsive web apps easily
pukhalski
3
860
Mobile Cross-Platform Development
pukhalski
2
290
Rest in PS: рабочий процесс современного веб-дизайнера
pukhalski
12
1.5k
Other Decks in Programming
See All in Programming
Prompt Cachingは本当に効果的なのか検証してみた.pdf
ttnyt8701
0
530
仮想ファイルシステムを導入して開発環境のストレージ課題を解消する
segadevtech
2
550
私のEbitengineの第一歩
qt_luigi
0
450
LangGraphでのHuman-in-the-Loopの実装
os1ma
3
1.1k
意外とフォントが大事だった話 / Font Issues on Internationalization
fumi23
0
110
エンジニア1年目で複雑なコードの改善に取り組んだ話
mtnmr
3
2k
Architecture Decision Record (ADR)
nearme_tech
PRO
1
690
API Platform for Laravel
dunglas
1
440
The Sequel to a Dream of Ruby Parser's Grammar
ydah
1
220
GenU導入でCDKに初挑戦し、悪戦苦闘した話
hideg
0
170
Rechartsで楽にゴリゴリにカスタマイズする!
10tera
1
170
GraphQL あるいは React における自律的なデータ取得について
quramy
11
3k
Featured
See All Featured
Code Review Best Practice
trishagee
62
16k
How to name files
jennybc
75
98k
Imperfection Machines: The Place of Print at Facebook
scottboms
263
13k
Practical Orchestrator
shlominoach
185
10k
We Have a Design System, Now What?
morganepeng
48
7.1k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
38
9.2k
Bash Introduction
62gerente
608
210k
A Philosophy of Restraint
colly
202
16k
Side Projects
sachag
451
42k
Building a Scalable Design System with Sketch
lauravandoore
459
32k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
1
55
Transcript
Ilya Pukhalski, EPAM SEC 2013 PHONEGAP How really works
@witchfinderx 2 Ilya Pukhalski, EPAM Mobile Competency Center
WHAT WILL WE DISCUSS? 3
— That mobile mobile world... — What is PhoneGap? -
A brief history of PhoneGap - How PhoneGap works - PhoneGap APIs - Plugins - Cons and limitations — PhoneGap Build — The future is closer than you think 4
THAT MOBILE MOBILE WORLD... 5
6 June, 2007
7 +
8 July 10, 2008
9 One of the main world problems today
Everything is WEB 10
11 What's in common?
12 All of them have a browser
PHONEGAP 13
PhoneGap is an open source framework that enables to build
cross-platform hybrid mobile applications using web technologies (HTML, CSS, JavaScript). 14
PhoneGap 2.3.0 15
HISTORY OF PHONEGAP 16
iPhoneDevCamp 2008 17 PhoneGap 1.0 2009 Migration to Apache Cordova
2012 IBM get involved into development late 2009 PhoneGap Build official launch late 2012
HOW PHONEGAP WORKS 18
19
20
21
22
None
24
25 PhoneGap Build Process
PHONEGAP API'S 26
27 — Accelerometer — Camera — Compass (excl. iPhone 3/3G,
BlackBerry OS 5+ and Symbian) — Contacts (excl. WebOS) — File (excl. WebOS, Symbian, Bada) — Geolocation — Media (excl. BlackBerry OS 5+, WebOS, Symbian, Bada) — Network — Notification — Storage (excl. Bada)
28
29 API call example `navigator' is a global namespace for
all API calls
HELLO WORLD 30
Including cordova.js
32 Adding listener on "deviceready"event
33 showAlert(); will display a native notification
34 Show notification as soon as device is ready
PLUGINS 35
36
37 HelloWorld.js
38 PhoneGap Bridge exec call
39 PhoneGap Bridge exec call Cordova.exec bridge CDV-HelloWorld.js
40 CLI for plugin boilerplate
41 CLI for plugin boilerplate
42 iOS native code #import <Cordova/CDVPlugin.h> @interface HelloWorld : CDVPlugin
@end #import "HelloWorld.h" @implementation HelloWorld @end HelloWorld.h HelloWorld.m Inheritance
43 Adding methods #import <Cordova/CDVPlugin.h> @interface HelloWorld : CDVPlugin -
(void)add:(CDVInvokedUrlCommand*)command; @end #import "HelloWorld.h" @implementation HelloWorld - (void)add:(CDVInvokedUrlCommand*)command { } @end HelloWorld.h HelloWorld.m Instance method Instance method
44 Retrieving arguments #import "HelloWorld.h" @implementation HelloWorld - (void)add:(CDVInvokedUrlCommand*)command {
double a = [[command.arguments objectAtIndex:0] doubleValue]; double b = [[command.arguments objectAtIndex:1] doubleValue]; double result = a + b; } @end HelloWorld.m Retrieve arguments; Addition.
45 Sending the result #import "HelloWorld.h" @implementation HelloWorld - (void)add:(CDVInvokedUrlCommand*)command
{ double a = [[command.arguments objectAtIndex:0] doubleValue]; double b = [[command.arguments objectAtIndex:1] doubleValue]; double result = a + b; CDVPluginResult* pluginResult = [CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsDouble:result]; [self writeJavascript: [pluginResult toSuccessCallbackString:command.callbackId]]; } @end HelloWorld.m Send result back
46 Adding plugin mapping to Cordova.plist
47 Calling our plugin from JS
CONS & LIMITATIONS 48
— Fast changing inconsistent API — Lacks and inaccuracies in
documentation — Some device specific API's are still unavailable for some OS — Dealing with cross-platform web development issues 49
PHONEGAP BUILD 50
51 PhoneGap Build is a cloud based service built on
the top of PhoneGap framework.
— PhoneGap Build is a cloud service — PhoneGap Build
API can help in establishing CI — No need to have different environment OS and SDK's to build an application 52 PhoneGap Build Pros
THE FUTURE IS CLOSER THAN YOU THINK 53
Some API's are already accessible 54
55 Device Specific API's accessibility: Accelerometer
Device Specific API's accessibility: File API (incl. camera uploads)
Average support is ~70%
58 https://vimeo.com/55486684 Sencha Fastbook
QUESTIONS? 59
@witchfinderx 60
@witchfinderx 60