build your first mobile app with html5 & an api...
TRANSCRIPT
![Page 1: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/1.jpg)
Build your first mobile appwith HTML5 & an API Backend1. No Audio right now — we’ll get started by 3:05pm PacificTake this time to send us a quick GoToWebinar message to let us know which city you’re from and if you’re a designer, front-end developer, backend-developer, architect, manager, etc. :)
2. Reminder: you need to have PhoneGap + XCode, ADT or Visual Studio installed.Android guide: j.mp/phonegap-android-guideiOS, Windows Phone guide: j.mp/phonegap-26-getstarted
3. We will send you a video recording + slides by email
![Page 2: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/2.jpg)
Tim Anglade@[email protected]
![Page 3: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/3.jpg)
Formerly:Software at NASDAQCS lecturer in MSc.CTO of startupInv. Expert at W3C
![Page 4: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/4.jpg)
I work for Apigee
![Page 5: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/5.jpg)
We help power eBayBest Buy, Walgreens, Gilt Groupe, NewEgg, Cars.com, Dell, Getty Images, GraceNote, Shazam, HomeAway, Pearson, cheezburger
![Page 6: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/6.jpg)
We’ve organized this training in LA, San Jose, Austin, Denver, Amsterdam, Atlanta, Houston, Detroit…
![Page 7: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/7.jpg)
Apigee is always free for developersFree Hosted Accounts25GB storage limit,no API/bandwidth limitCommercial use OKFree OSS versiongit.io/usergrid
![Page 8: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/8.jpg)
Paid plans available for large companies if you need to deploy this on your own servers or SLAs, 4 nines, multi-region, phone support, more storage, etc.
![Page 9: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/9.jpg)
Where is everybody from today?What do you do?
![Page 10: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/10.jpg)
Everybody good withHTML Basics,Variables,Functions,etc. ?
![Page 11: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/11.jpg)
HTML5 30 minBuild a UI 45Add Live Data 45PhoneGap 45Q&A, Next Steps 15
![Page 12: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/12.jpg)
Buildinga simple list app
![Page 13: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/13.jpg)
HTML5
![Page 14: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/14.jpg)
use relatively few:data-attributeshistory
![Page 16: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/16.jpg)
Other approachesNativeMonoTouchRubyMotion etc.
![Page 17: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/17.jpg)
jQueryand jQuery Mobile
![Page 18: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/18.jpg)
Section 1Start with the UI
![Page 19: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/19.jpg)
Build something that looks like thisj.mp/apigee-mockup
![Page 20: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/20.jpg)
The nice guys at Codiqa let me offer you unlimited trial:j.mp/codiqa-trial-unlimited
![Page 22: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/22.jpg)
Section 2Add live data
![Page 23: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/23.jpg)
Why do we need a backend?
![Page 24: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/24.jpg)
Many options here too…
![Page 25: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/25.jpg)
We’re going to usean API Backend today!
![Page 26: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/26.jpg)
It’s like a database that you call directly from your client code.
![Page 27: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/27.jpg)
It’s a cloud service that makes it easy tostore your data, retrieve it & query it.
![Page 28: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/28.jpg)
It’s a like a Dropbox or iCloud to synchronize all your app data across users and devices
![Page 29: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/29.jpg)
ServerInfrastructure
AppCode SDK API
![Page 30: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/30.jpg)
Even in API Backends,there are plenty of alternatives!
![Page 31: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/31.jpg)
Apigee App Servicesvs. Usergrid
![Page 32: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/32.jpg)
Let’s take a look at Apigeej.mp/apigee-sign-up
![Page 33: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/33.jpg)
Add some data
![Page 34: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/34.jpg)
SDKs available for…JS, node.js, iOS, Android, Ruby, Rails,C#, Python, PHP, Java, WP8, etc.
![Page 36: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/36.jpg)
Add some view code
![Page 38: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/38.jpg)
Section 3Run on mobile!
![Page 39: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/39.jpg)
A look at PhoneGapPhoneGap Build, Trigger.io, etc.
![Page 40: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/40.jpg)
Apache Cordovavs.Adobe PhoneGap
![Page 41: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/41.jpg)
Androidj.mp/phonegap-android-guideiOS, Windows Phonej.mp/cordova-26-getstarted
![Page 42: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/42.jpg)
Add your HTML
![Page 43: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/43.jpg)
Run!
![Page 44: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/44.jpg)
What runs where?
![Page 45: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/45.jpg)
PhoneGap Build
![Page 46: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/46.jpg)
Congrats!
![Page 47: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/47.jpg)
What else could you do next?
![Page 48: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/48.jpg)
Write DataMultiple PagesPush NotificationsFile StorageSocial GraphLocal capabilities3rd-party integrationLegacy integrationCode execution
![Page 49: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/49.jpg)
Ask for help!Announce projects!j.mp/app-craftSign up now :)
![Page 50: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/50.jpg)
Great for prototyping,works at scale too!
![Page 51: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/51.jpg)
When you use Apigee, every piece of data you store gets saved in 3 different data centers around the US (soon 3 copies in Europe too)
![Page 52: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/52.jpg)
A top 10 US retaileruses it for everye-commerce call made to its app or website (over 50M users, thousands of calls per second).
![Page 53: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/53.jpg)
One of the 10 largest private companies in the US used it to create an internal info management system for its 50k employees
![Page 54: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/54.jpg)
A large luxury brand based in the UK mandates all contractors use it to build catalogs, campaign sites and apps for them
![Page 55: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/55.jpg)
Apigee is free for developersFree Hosted Accounts25GB storage limit,no API/bandwidth limitCommercial use OKFree OSS versiongit.io/usergrid
![Page 56: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/56.jpg)
Paid plans available for large companies if you need to deploy this on your own servers or SLAs, 4 nines, multi-region, phone support, more storage, etc.
![Page 57: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/57.jpg)
SDKs available for…JS, node.js, iOS, Android, Ruby, Rails,C#, Python, PHP, Java, WP8, etc.
![Page 58: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/58.jpg)
Ask for help!Announce projects!j.mp/app-craftSign up now :)
![Page 59: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/59.jpg)
Get more trainingAdvanced class?Training for your company? Still [email protected]
![Page 60: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/60.jpg)
Apigee is hiring (all around the world)j.mp/apigee-cs-jobs
![Page 61: Build your first mobile app with HTML5 & an API Backendpages.apigee.com/rs/apigee/images/app-in-3-hours-webcast.pdf · Build your first mobile app with HTML5 & an API Backend 1](https://reader031.vdocument.in/reader031/viewer/2022022520/5b1c92477f8b9a8c5a8b53ab/html5/thumbnails/61.jpg)
Congrats!If you liked it,post it on Twitter/LinkedIn :)@apigee @timangladej.mp/app-craft