"Native" Apps with APEX and PhoneGap

3,862 views

Published on

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,862
On SlideShare
0
From Embeds
0
Number of Embeds
10
Actions
Shares
0
Downloads
84
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • This is your opening slide.
  • "Native" Apps with APEX and PhoneGap

    1. 1. #Kscope Creating a “native” App with Oracle Application Express Christian Rokitta www.themes4apex.com
    2. 2. About Me 17 years 17 years 2 years 3 months
    3. 3. 3
    4. 4. Smartphone Usage Statistics http://ansonalex.com/infographics/smartphone-usage-statistics-2012-infographic/
    5. 5. Smartphone Usage Statistics 5 http://ansonalex.com/infographics/smartphone-usage-statistics-2012-infographic/
    6. 6. Top Places To Loose Your Phone 6
    7. 7. Usage Web vs Apps 7
    8. 8. Smartphone OS Market Share 8
    9. 9. Web Versus Native Native: • An application specifically designed to run on a device’s operating system and machine firmware • It typically needs to be adapted/adjusted for different devices Web: • An application in which all or some parts of the software are downloaded from the Web each time it is run • It can usually be accessed from all web-capable mobile devices
    10. 10. Pros and Cons Native Benefits • Performance • Seamless User Interface • Seamless Installation • Distribution • Improved Brand Web Benefits • Interoperability and Vendor Independence • Streamlined Maintenance and Upgrade Path • Shorter Time-to-Market • Leverige Existing Skills
    11. 11. Native Web App? Hybride!
    12. 12. Building Apps with HTML, CSS and Javascript SQL & PL/SQLSQL & PL/SQL
    13. 13. Using APEX & jQuery Mobile • Integrated in 4.2 • HTML5-based user interface • Supports all popular mobile device platforms • Easy to learn, mark-up based system
    14. 14. PhoneGap
    15. 15. Why PhoneGap? Mobile development is a mess. Building applications for each device (iPhone, Android, Windows Mobile ...) requires different frameworks and languages. Build your app once with web-standards, based on HTML5, PhoneGap leverages web technologies developers already know best... HTML and JavaScript. 16
    16. 16. PhoneGap Build your app once with web-standards Wrap it with PhoneGap Get access to native APIs Deploy to multiple platforms
    17. 17. app = webview + PhoneGap framework 18
    18. 18. Getting Started with PhoneGap • Install Eclipse • Install Android/iOS SDK • Set up Project o New Eclipse Project o Copy PhoneGap libs/js/xml o Edit java/xml/html files • Deploy to Simulator • Deploy to Device JSJS HTMLHTML http://www.phonegap.com
    19. 19. Integrating PhoneGap and APEX 1. Index.html -> APEX page  redirect (JavaScript onLoad!?) 2. Add PhoneGap JS library in APEX Page Template  Mobile enabled Template (jQM)
    20. 20. <!DOCTYPE HTML> <html> <head> <title>FifApex</title> <script ... src="cordova-1.8.0.js"></script> <script type="text/javascript" charset="utf-8"> // Call onDeviceReady when PhoneGap is loaded. // document.addEventListener("deviceready", onDeviceReady, false); // PhoneGap is loaded and it is now safe to make calls PhoneGap methods // function onDeviceReady() { window.location.href='http://m.fifapex.net/apex/f?p=2013:1'; } </script> </head> <body> <h1>loading ...</h1> </body> </html> Redirect (Android)
    21. 21. Domain Whitelist • Domain whitelisting is a security model that controls access to outside domains. • The default security policy is to block all network access. • The application developer can then delcare access to specific network domains and subdomains. 22
    22. 22. Whitelisting Platform Dependent • Android has full support for the whitelisting syntax. The whitelisting rules are found in res/xml/cordova.xml and declared with the element <access origin="..." /> • Windows Phone: whitelisting unsupported By default, all domains are accessible. • iOS : Domain protocols are not supported e.g. http:// and https://; Wildcards on iOS (*) are more flexible Xcode: it is found at AppName/Supporting Files/Cordova.plist, Add a new String value under the ExternalHosts key 23
    23. 23. PhoneGap API
    24. 24. hybrid : “almost” native 25 no JS background execution!  native plug-in
    25. 25. Feature Matrix Overview 26
    26. 26. Questions
    27. 27. 1 license Red Gate Deployment Suite for Oracle 28 FifFifAPEXAPEX
    28. 28. Contact Information Blog: http://rokitta.blogspot.com LinkedIn: http://nl.linkedin.com/in/rokit Website: http://www.rokit.nl themes4apex: http://www.themes4apex.nl FifApex: http://m.fifapex.net Twitter: @crokitta Email: christian@rokitta.nl

    ×