SlideShare a Scribd company logo
1 of 22
Download to read offline
Android App Development
 using HTML5 Technology
                     APPMAZINC
          Mobile Apps Camp 2012
Summary
   Intro Android Development
   Android SDK Installation
   Intro HTML5
   Intro jQuery Mobile
   Intro Webservice (XML, JSON)
   PhoneGap (Apache Cordova)
   Make RSS Reader App with PhoneGap
Intro Android Development
   Android Development
       Java
       HTML5
       Native (C/C++)
       Adobe AIR
       Python
       Unity
   Develop on Mac, Windows, Linux and even on Android it
    self (AIDE: Android Java IDE)
Android SDK Installation
   Java SDK
   Eclipse
   Android SDK
   ADT Plug-in

   HTML5
       PhoneGap
       jQueryMobile
HTML5
   Markup language for structuring and presenting content
    for the WWW, and is a core technology of the Internet
       HTML created in 1990, HTML4 1997
       HTML5 is intended to subsume not only HTML4, but XHTML
        1 and DOM LEVEL 2 HTML
   HTML5 adds many new syntactic features
       Canvas, Drag-and-Drop, Web Storage, …
       Geolocation, Web SQL db, File API, …
HTML5
HTML5 for Mobile
jQuery Mobile
   A unified, HTML5-based user interface system for all popular
    mobile device platforms, built on the rock-solid jQuery and
    jQuery UI Foundation.




   Instead of writing unique apps for each mobile device/OS, the
    jQuery mobile framework allows you to design a single highly-
    branded web site or application that will work on all popular
    smartphone, tablet & desktop platforms.
jQuery Mobile
jQuery Mobile Docs
jQuery Mobile
jQuery Mobile
jQueryMobile
<html>
<head>
<script type=“text/javascript” src=“jquery-1.8.2.min.js” />
<script type=“text/javascript” src=“jquery.mobile-1.2.0.min.js” />
<link rel=“stylesheet” href=“jquery.mobile-1.2.0.min.css” />
</head>
<body>
<h2>Simple List</h2>
<ul data-role=“listview” data-inset=“true”>
<li><a href=“index.html”>Element #1</a></li>
<li><a href=“#”>Element #2</a></li>
</ul>
</body>
</html>
Web Service
   A web service is a method of communication between
    two electronic device over the World Wide Web
       Extensible Markup Language (XML)
           SOAP
           XML-RPC
       Representational State Transfer (REST)
           HTTP GET/POST/PUT/DELETE
   JSON (Java Script Object Notation), is a text based open-
    standard designed for human-readable data interchange.
XML
<?xml version=“1.0” ?>
<rss>
<channel>
<title>my RSS</title>
<description>sample RSS</description>
<item>
<title>article1</title>
<link>http://rss.test.com/article1.html</link>
<description>article content of article1</description>
</item>
<item>
<title>article2</title>
<link>http://rss.test.com/article2.html</link>
<description>article content of article2</description>
</item>
</channel>
</rss>
JSON
 {
      "rss": {
         "channel": {
             "title": "my RSS",
             "description": "sample RSS",
             "item": [
 {
                 "title": "article1",
                 "link": "http://rss.test.com/article1.html",
                 "description": "article content of article1"
 },
 {
                 "title": "article2",
                 "link": "http://rss.test.com/article2.html",
                 "description": "article content of article2"
 }
 ]
          }
      }
 }
PhoneGap (Apache Cordova)
   Open source framework for quickly building cross-
    platform mobile apps using HTML5, JavaScript, CSS.
   PhoneGap code was contributed to Apache Software
    Foundation(ASF) under the name Apache Cordova.
PhoneGap
PhoneGap
   Setup new Project > specify new app project
   Create Activity > Blank Activity
   Create new Directories (at project root dir):
       /libs
       assets/www
   Copy cordova-2.0.0.js to assets/www
   Copy cordova-2.0.0.jar to /libs
       verify cordova-2.0.0.jar at eclipse java build path
   Copy cordova/lib/android/xml to /res
PhoneGap
   Edit Activity file (.java)
       Add import org.apache.cordova.*;
       Change class’ extends from Activity to DroidGap
       Replace the setContentView() line with
        super.loadUrl(“file:///android_asset/www/index.html”);
   Edit AndroidManifest.xml
   Create index.html and put to assets/www
   Deploy to simulator
Appmazinc App Challenge by Qualcomm
   Android mobile application challenge focusing on Vuforia
    (Augmented Reality) and FastCV (Computer Vision) SDK
   Prizes: 1st winner Rp12.000.000,-
            2nd winner Rp 8.000.000,-
            3rd winner Rp 5.000.000,-
   All winners will be assisted to have business development
    with Qualcomm local brand partners.
7Langit
   @7Langit team at Appmazinc workshop 2012
       TitiRusdi
       Oon Arfiandwi
       TulusWijayanto
       DyahAyu
       KurniawanHaikal

More Related Content

What's hot

Building html5 apps using Cordova
Building html5 apps using Cordova Building html5 apps using Cordova
Building html5 apps using Cordova David Voyles
 
Creating mobile apps - an introduction to Ionic (Engage 2016)
Creating mobile apps - an introduction to Ionic (Engage 2016)Creating mobile apps - an introduction to Ionic (Engage 2016)
Creating mobile apps - an introduction to Ionic (Engage 2016)Mark Leusink
 
Phonegap android
Phonegap androidPhonegap android
Phonegap androidumesh patil
 
Building data driven mobile apps with phone gap and webapi
Building data driven mobile apps with phone gap and webapiBuilding data driven mobile apps with phone gap and webapi
Building data driven mobile apps with phone gap and webapiDerek Smith
 
レッツ!Google Apps ScriptでTDD(仮)
レッツ!Google Apps ScriptでTDD(仮)レッツ!Google Apps ScriptでTDD(仮)
レッツ!Google Apps ScriptでTDD(仮)Kei Sawada
 
Microservices for the Masses with Spring Boot and JHipster - RWX 2018
Microservices for the Masses with Spring Boot and JHipster - RWX 2018Microservices for the Masses with Spring Boot and JHipster - RWX 2018
Microservices for the Masses with Spring Boot and JHipster - RWX 2018Matt Raible
 
Bootiful Development with Spring Boot and Vue - RWX 2018
Bootiful Development with Spring Boot and Vue - RWX 2018Bootiful Development with Spring Boot and Vue - RWX 2018
Bootiful Development with Spring Boot and Vue - RWX 2018Matt Raible
 
Domo Arigato Mr. Roboto - Open Source Bridge 2009
Domo Arigato Mr. Roboto - Open Source Bridge 2009Domo Arigato Mr. Roboto - Open Source Bridge 2009
Domo Arigato Mr. Roboto - Open Source Bridge 2009sullis
 
Mobile application development
Mobile application developmentMobile application development
Mobile application developmentumesh patil
 
Flutter workshop @ bang saen 2020
Flutter workshop @ bang saen 2020Flutter workshop @ bang saen 2020
Flutter workshop @ bang saen 2020Anuchit Chalothorn
 
Bootiful Development with Spring Boot and Angular - RWX 2018
Bootiful Development with Spring Boot and Angular - RWX 2018Bootiful Development with Spring Boot and Angular - RWX 2018
Bootiful Development with Spring Boot and Angular - RWX 2018Matt Raible
 
Hybrid app development frameworks
Hybrid app development frameworksHybrid app development frameworks
Hybrid app development frameworksSquash Apps Pvt Ltd
 
Tiggzi at DC jQuery Meetup
Tiggzi at DC jQuery MeetupTiggzi at DC jQuery Meetup
Tiggzi at DC jQuery MeetupMax Katz
 
Building android and i os apps with visual studio
Building android and i os apps with visual studioBuilding android and i os apps with visual studio
Building android and i os apps with visual studioLohith Goudagere Nagaraj
 
Titanium Alloy Framework
Titanium Alloy FrameworkTitanium Alloy Framework
Titanium Alloy FrameworkTechday7
 

What's hot (20)

Building html5 apps using Cordova
Building html5 apps using Cordova Building html5 apps using Cordova
Building html5 apps using Cordova
 
Creating mobile apps - an introduction to Ionic (Engage 2016)
Creating mobile apps - an introduction to Ionic (Engage 2016)Creating mobile apps - an introduction to Ionic (Engage 2016)
Creating mobile apps - an introduction to Ionic (Engage 2016)
 
Phonegap android
Phonegap androidPhonegap android
Phonegap android
 
Building data driven mobile apps with phone gap and webapi
Building data driven mobile apps with phone gap and webapiBuilding data driven mobile apps with phone gap and webapi
Building data driven mobile apps with phone gap and webapi
 
レッツ!Google Apps ScriptでTDD(仮)
レッツ!Google Apps ScriptでTDD(仮)レッツ!Google Apps ScriptでTDD(仮)
レッツ!Google Apps ScriptでTDD(仮)
 
Microservices for the Masses with Spring Boot and JHipster - RWX 2018
Microservices for the Masses with Spring Boot and JHipster - RWX 2018Microservices for the Masses with Spring Boot and JHipster - RWX 2018
Microservices for the Masses with Spring Boot and JHipster - RWX 2018
 
Bootiful Development with Spring Boot and Vue - RWX 2018
Bootiful Development with Spring Boot and Vue - RWX 2018Bootiful Development with Spring Boot and Vue - RWX 2018
Bootiful Development with Spring Boot and Vue - RWX 2018
 
Domo Arigato Mr. Roboto - Open Source Bridge 2009
Domo Arigato Mr. Roboto - Open Source Bridge 2009Domo Arigato Mr. Roboto - Open Source Bridge 2009
Domo Arigato Mr. Roboto - Open Source Bridge 2009
 
Mobile application development
Mobile application developmentMobile application development
Mobile application development
 
Flutter workshop @ bang saen 2020
Flutter workshop @ bang saen 2020Flutter workshop @ bang saen 2020
Flutter workshop @ bang saen 2020
 
iOS App Using cordova
iOS App Using cordovaiOS App Using cordova
iOS App Using cordova
 
Bootiful Development with Spring Boot and Angular - RWX 2018
Bootiful Development with Spring Boot and Angular - RWX 2018Bootiful Development with Spring Boot and Angular - RWX 2018
Bootiful Development with Spring Boot and Angular - RWX 2018
 
IONIC - Hybrid Mobile App Development
IONIC - Hybrid Mobile App DevelopmentIONIC - Hybrid Mobile App Development
IONIC - Hybrid Mobile App Development
 
Flutter Workshop 2021 @ ARU
Flutter Workshop 2021 @ ARUFlutter Workshop 2021 @ ARU
Flutter Workshop 2021 @ ARU
 
Hybrid app development frameworks
Hybrid app development frameworksHybrid app development frameworks
Hybrid app development frameworks
 
Tiggzi at DC jQuery Meetup
Tiggzi at DC jQuery MeetupTiggzi at DC jQuery Meetup
Tiggzi at DC jQuery Meetup
 
Building android and i os apps with visual studio
Building android and i os apps with visual studioBuilding android and i os apps with visual studio
Building android and i os apps with visual studio
 
React Native
React NativeReact Native
React Native
 
Ionic framework
Ionic frameworkIonic framework
Ionic framework
 
Titanium Alloy Framework
Titanium Alloy FrameworkTitanium Alloy Framework
Titanium Alloy Framework
 

Similar to Android App Development using HTML5 Technology

Apache Cordova In Action
Apache Cordova In ActionApache Cordova In Action
Apache Cordova In ActionHazem Saleh
 
[JavaLand 2015] Developing JavaScript Mobile Apps Using Apache Cordova
[JavaLand 2015] Developing JavaScript Mobile Apps Using Apache Cordova[JavaLand 2015] Developing JavaScript Mobile Apps Using Apache Cordova
[JavaLand 2015] Developing JavaScript Mobile Apps Using Apache CordovaHazem Saleh
 
[JMaghreb 2014] Developing JavaScript Mobile Apps Using Apache Cordova
[JMaghreb 2014] Developing JavaScript Mobile Apps Using Apache Cordova[JMaghreb 2014] Developing JavaScript Mobile Apps Using Apache Cordova
[JMaghreb 2014] Developing JavaScript Mobile Apps Using Apache CordovaHazem Saleh
 
Hybrid Mobile Apps - Meetup
Hybrid Mobile Apps - MeetupHybrid Mobile Apps - Meetup
Hybrid Mobile Apps - MeetupSanjay Patel
 
Developing Native Mobile Apps Using JavaScript, ApacheCon NA 2014
Developing Native Mobile Apps Using JavaScript, ApacheCon NA 2014Developing Native Mobile Apps Using JavaScript, ApacheCon NA 2014
Developing Native Mobile Apps Using JavaScript, ApacheCon NA 2014Hazem Saleh
 
Cross Platform Mobile Apps with the Ionic Framework
Cross Platform Mobile Apps with the Ionic FrameworkCross Platform Mobile Apps with the Ionic Framework
Cross Platform Mobile Apps with the Ionic FrameworkTroy Miles
 
Introduction to Apache Cordova (Phonegap)
Introduction to Apache Cordova (Phonegap)Introduction to Apache Cordova (Phonegap)
Introduction to Apache Cordova (Phonegap)ejlp12
 
Angularjs Tutorial for Beginners
Angularjs Tutorial for BeginnersAngularjs Tutorial for Beginners
Angularjs Tutorial for Beginnersrajkamaltibacademy
 
Cross Platform Mobile Apps with the Ionic Framework
Cross Platform Mobile Apps with the Ionic FrameworkCross Platform Mobile Apps with the Ionic Framework
Cross Platform Mobile Apps with the Ionic FrameworkTroy Miles
 
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias WessendorfHTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias WessendorfJAX London
 
phonegap with angular js for freshers
phonegap with angular js for freshers    phonegap with angular js for freshers
phonegap with angular js for freshers dssprakash
 
GWT Training - Session 1/3
GWT Training - Session 1/3GWT Training - Session 1/3
GWT Training - Session 1/3Faiz Bashir
 
Phonegap for Android
Phonegap for AndroidPhonegap for Android
Phonegap for AndroidMuthu Kumar
 
Industrial Training in PhoneGap Application
Industrial Training in PhoneGap ApplicationIndustrial Training in PhoneGap Application
Industrial Training in PhoneGap ApplicationArcadian Learning
 
Cross-Platform Development using Angulr JS in Visual Studio
Cross-Platform Development using Angulr JS in Visual StudioCross-Platform Development using Angulr JS in Visual Studio
Cross-Platform Development using Angulr JS in Visual StudioMizanur Sarker
 
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...Codemotion Tel Aviv
 
Made for Mobile - Let Office 365 Power Your Mobile Apps
Made for Mobile - Let Office 365 Power Your Mobile AppsMade for Mobile - Let Office 365 Power Your Mobile Apps
Made for Mobile - Let Office 365 Power Your Mobile AppsSPC Adriatics
 
[Devoxx Morocco 2015] Apache Cordova In Action
[Devoxx Morocco 2015] Apache Cordova In Action[Devoxx Morocco 2015] Apache Cordova In Action
[Devoxx Morocco 2015] Apache Cordova In ActionHazem Saleh
 
Beginning MEAN Stack
Beginning MEAN StackBeginning MEAN Stack
Beginning MEAN StackRob Davarnia
 

Similar to Android App Development using HTML5 Technology (20)

Apache Cordova In Action
Apache Cordova In ActionApache Cordova In Action
Apache Cordova In Action
 
[JavaLand 2015] Developing JavaScript Mobile Apps Using Apache Cordova
[JavaLand 2015] Developing JavaScript Mobile Apps Using Apache Cordova[JavaLand 2015] Developing JavaScript Mobile Apps Using Apache Cordova
[JavaLand 2015] Developing JavaScript Mobile Apps Using Apache Cordova
 
[JMaghreb 2014] Developing JavaScript Mobile Apps Using Apache Cordova
[JMaghreb 2014] Developing JavaScript Mobile Apps Using Apache Cordova[JMaghreb 2014] Developing JavaScript Mobile Apps Using Apache Cordova
[JMaghreb 2014] Developing JavaScript Mobile Apps Using Apache Cordova
 
Hybrid Mobile Apps - Meetup
Hybrid Mobile Apps - MeetupHybrid Mobile Apps - Meetup
Hybrid Mobile Apps - Meetup
 
Developing Native Mobile Apps Using JavaScript, ApacheCon NA 2014
Developing Native Mobile Apps Using JavaScript, ApacheCon NA 2014Developing Native Mobile Apps Using JavaScript, ApacheCon NA 2014
Developing Native Mobile Apps Using JavaScript, ApacheCon NA 2014
 
Cross Platform Mobile Apps with the Ionic Framework
Cross Platform Mobile Apps with the Ionic FrameworkCross Platform Mobile Apps with the Ionic Framework
Cross Platform Mobile Apps with the Ionic Framework
 
Introduction to Apache Cordova (Phonegap)
Introduction to Apache Cordova (Phonegap)Introduction to Apache Cordova (Phonegap)
Introduction to Apache Cordova (Phonegap)
 
Angularjs Tutorial for Beginners
Angularjs Tutorial for BeginnersAngularjs Tutorial for Beginners
Angularjs Tutorial for Beginners
 
Cross Platform Mobile Apps with the Ionic Framework
Cross Platform Mobile Apps with the Ionic FrameworkCross Platform Mobile Apps with the Ionic Framework
Cross Platform Mobile Apps with the Ionic Framework
 
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias WessendorfHTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
HTML alchemy: the secrets of mixing JavaScript and Java EE - Matthias Wessendorf
 
phonegap with angular js for freshers
phonegap with angular js for freshers    phonegap with angular js for freshers
phonegap with angular js for freshers
 
GWT Training - Session 1/3
GWT Training - Session 1/3GWT Training - Session 1/3
GWT Training - Session 1/3
 
Phonegap for Android
Phonegap for AndroidPhonegap for Android
Phonegap for Android
 
Industrial Training in PhoneGap Application
Industrial Training in PhoneGap ApplicationIndustrial Training in PhoneGap Application
Industrial Training in PhoneGap Application
 
Cross-Platform Development using Angulr JS in Visual Studio
Cross-Platform Development using Angulr JS in Visual StudioCross-Platform Development using Angulr JS in Visual Studio
Cross-Platform Development using Angulr JS in Visual Studio
 
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
 
Made for Mobile - Let Office 365 Power Your Mobile Apps
Made for Mobile - Let Office 365 Power Your Mobile AppsMade for Mobile - Let Office 365 Power Your Mobile Apps
Made for Mobile - Let Office 365 Power Your Mobile Apps
 
Html5
Html5Html5
Html5
 
[Devoxx Morocco 2015] Apache Cordova In Action
[Devoxx Morocco 2015] Apache Cordova In Action[Devoxx Morocco 2015] Apache Cordova In Action
[Devoxx Morocco 2015] Apache Cordova In Action
 
Beginning MEAN Stack
Beginning MEAN StackBeginning MEAN Stack
Beginning MEAN Stack
 

Recently uploaded

How to release an Open Source Dataweave Library
How to release an Open Source Dataweave LibraryHow to release an Open Source Dataweave Library
How to release an Open Source Dataweave Libraryshyamraj55
 
Graphene Quantum Dots-Based Composites for Biomedical Applications
Graphene Quantum Dots-Based Composites for  Biomedical ApplicationsGraphene Quantum Dots-Based Composites for  Biomedical Applications
Graphene Quantum Dots-Based Composites for Biomedical Applicationsnooralam814309
 
SIM INFORMATION SYSTEM: REVOLUTIONIZING DATA MANAGEMENT
SIM INFORMATION SYSTEM: REVOLUTIONIZING DATA MANAGEMENTSIM INFORMATION SYSTEM: REVOLUTIONIZING DATA MANAGEMENT
SIM INFORMATION SYSTEM: REVOLUTIONIZING DATA MANAGEMENTxtailishbaloch
 
GraphSummit Copenhagen 2024 - Neo4j Vision and Roadmap.pptx
GraphSummit Copenhagen 2024 - Neo4j Vision and Roadmap.pptxGraphSummit Copenhagen 2024 - Neo4j Vision and Roadmap.pptx
GraphSummit Copenhagen 2024 - Neo4j Vision and Roadmap.pptxNeo4j
 
TrustArc Webinar - How to Live in a Post Third-Party Cookie World
TrustArc Webinar - How to Live in a Post Third-Party Cookie WorldTrustArc Webinar - How to Live in a Post Third-Party Cookie World
TrustArc Webinar - How to Live in a Post Third-Party Cookie WorldTrustArc
 
Trailblazer Community - Flows Workshop (Session 2)
Trailblazer Community - Flows Workshop (Session 2)Trailblazer Community - Flows Workshop (Session 2)
Trailblazer Community - Flows Workshop (Session 2)Muhammad Tiham Siddiqui
 
Keep Your Finger on the Pulse of Your Building's Performance with IES Live
Keep Your Finger on the Pulse of Your Building's Performance with IES LiveKeep Your Finger on the Pulse of Your Building's Performance with IES Live
Keep Your Finger on the Pulse of Your Building's Performance with IES LiveIES VE
 
Automation Ops Series: Session 2 - Governance for UiPath projects
Automation Ops Series: Session 2 - Governance for UiPath projectsAutomation Ops Series: Session 2 - Governance for UiPath projects
Automation Ops Series: Session 2 - Governance for UiPath projectsDianaGray10
 
Technical SEO for Improved Accessibility WTS FEST
Technical SEO for Improved Accessibility  WTS FESTTechnical SEO for Improved Accessibility  WTS FEST
Technical SEO for Improved Accessibility WTS FESTBillieHyde
 
Top 10 Squarespace Development Companies
Top 10 Squarespace Development CompaniesTop 10 Squarespace Development Companies
Top 10 Squarespace Development CompaniesTopCSSGallery
 
My key hands-on projects in Quantum, and QAI
My key hands-on projects in Quantum, and QAIMy key hands-on projects in Quantum, and QAI
My key hands-on projects in Quantum, and QAIVijayananda Mohire
 
UiPath Studio Web workshop series - Day 1
UiPath Studio Web workshop series  - Day 1UiPath Studio Web workshop series  - Day 1
UiPath Studio Web workshop series - Day 1DianaGray10
 
Oracle Database 23c Security New Features.pptx
Oracle Database 23c Security New Features.pptxOracle Database 23c Security New Features.pptx
Oracle Database 23c Security New Features.pptxSatishbabu Gunukula
 
Introduction to RAG (Retrieval Augmented Generation) and its application
Introduction to RAG (Retrieval Augmented Generation) and its applicationIntroduction to RAG (Retrieval Augmented Generation) and its application
Introduction to RAG (Retrieval Augmented Generation) and its applicationKnoldus Inc.
 
Q4 2023 Quarterly Investor Presentation - FINAL - v1.pdf
Q4 2023 Quarterly Investor Presentation - FINAL - v1.pdfQ4 2023 Quarterly Investor Presentation - FINAL - v1.pdf
Q4 2023 Quarterly Investor Presentation - FINAL - v1.pdfTejal81
 
UiPath Studio Web workshop series - Day 4
UiPath Studio Web workshop series - Day 4UiPath Studio Web workshop series - Day 4
UiPath Studio Web workshop series - Day 4DianaGray10
 
UiPath Studio Web workshop Series - Day 3
UiPath Studio Web workshop Series - Day 3UiPath Studio Web workshop Series - Day 3
UiPath Studio Web workshop Series - Day 3DianaGray10
 
AI Workshops at Computers In Libraries 2024
AI Workshops at Computers In Libraries 2024AI Workshops at Computers In Libraries 2024
AI Workshops at Computers In Libraries 2024Brian Pichman
 
Extra-120324-Visite-Entreprise-icare.pdf
Extra-120324-Visite-Entreprise-icare.pdfExtra-120324-Visite-Entreprise-icare.pdf
Extra-120324-Visite-Entreprise-icare.pdfInfopole1
 

Recently uploaded (20)

How to release an Open Source Dataweave Library
How to release an Open Source Dataweave LibraryHow to release an Open Source Dataweave Library
How to release an Open Source Dataweave Library
 
Graphene Quantum Dots-Based Composites for Biomedical Applications
Graphene Quantum Dots-Based Composites for  Biomedical ApplicationsGraphene Quantum Dots-Based Composites for  Biomedical Applications
Graphene Quantum Dots-Based Composites for Biomedical Applications
 
SIM INFORMATION SYSTEM: REVOLUTIONIZING DATA MANAGEMENT
SIM INFORMATION SYSTEM: REVOLUTIONIZING DATA MANAGEMENTSIM INFORMATION SYSTEM: REVOLUTIONIZING DATA MANAGEMENT
SIM INFORMATION SYSTEM: REVOLUTIONIZING DATA MANAGEMENT
 
GraphSummit Copenhagen 2024 - Neo4j Vision and Roadmap.pptx
GraphSummit Copenhagen 2024 - Neo4j Vision and Roadmap.pptxGraphSummit Copenhagen 2024 - Neo4j Vision and Roadmap.pptx
GraphSummit Copenhagen 2024 - Neo4j Vision and Roadmap.pptx
 
TrustArc Webinar - How to Live in a Post Third-Party Cookie World
TrustArc Webinar - How to Live in a Post Third-Party Cookie WorldTrustArc Webinar - How to Live in a Post Third-Party Cookie World
TrustArc Webinar - How to Live in a Post Third-Party Cookie World
 
Trailblazer Community - Flows Workshop (Session 2)
Trailblazer Community - Flows Workshop (Session 2)Trailblazer Community - Flows Workshop (Session 2)
Trailblazer Community - Flows Workshop (Session 2)
 
Keep Your Finger on the Pulse of Your Building's Performance with IES Live
Keep Your Finger on the Pulse of Your Building's Performance with IES LiveKeep Your Finger on the Pulse of Your Building's Performance with IES Live
Keep Your Finger on the Pulse of Your Building's Performance with IES Live
 
Automation Ops Series: Session 2 - Governance for UiPath projects
Automation Ops Series: Session 2 - Governance for UiPath projectsAutomation Ops Series: Session 2 - Governance for UiPath projects
Automation Ops Series: Session 2 - Governance for UiPath projects
 
Technical SEO for Improved Accessibility WTS FEST
Technical SEO for Improved Accessibility  WTS FESTTechnical SEO for Improved Accessibility  WTS FEST
Technical SEO for Improved Accessibility WTS FEST
 
Top 10 Squarespace Development Companies
Top 10 Squarespace Development CompaniesTop 10 Squarespace Development Companies
Top 10 Squarespace Development Companies
 
My key hands-on projects in Quantum, and QAI
My key hands-on projects in Quantum, and QAIMy key hands-on projects in Quantum, and QAI
My key hands-on projects in Quantum, and QAI
 
UiPath Studio Web workshop series - Day 1
UiPath Studio Web workshop series  - Day 1UiPath Studio Web workshop series  - Day 1
UiPath Studio Web workshop series - Day 1
 
Oracle Database 23c Security New Features.pptx
Oracle Database 23c Security New Features.pptxOracle Database 23c Security New Features.pptx
Oracle Database 23c Security New Features.pptx
 
Introduction to RAG (Retrieval Augmented Generation) and its application
Introduction to RAG (Retrieval Augmented Generation) and its applicationIntroduction to RAG (Retrieval Augmented Generation) and its application
Introduction to RAG (Retrieval Augmented Generation) and its application
 
Q4 2023 Quarterly Investor Presentation - FINAL - v1.pdf
Q4 2023 Quarterly Investor Presentation - FINAL - v1.pdfQ4 2023 Quarterly Investor Presentation - FINAL - v1.pdf
Q4 2023 Quarterly Investor Presentation - FINAL - v1.pdf
 
SheDev 2024
SheDev 2024SheDev 2024
SheDev 2024
 
UiPath Studio Web workshop series - Day 4
UiPath Studio Web workshop series - Day 4UiPath Studio Web workshop series - Day 4
UiPath Studio Web workshop series - Day 4
 
UiPath Studio Web workshop Series - Day 3
UiPath Studio Web workshop Series - Day 3UiPath Studio Web workshop Series - Day 3
UiPath Studio Web workshop Series - Day 3
 
AI Workshops at Computers In Libraries 2024
AI Workshops at Computers In Libraries 2024AI Workshops at Computers In Libraries 2024
AI Workshops at Computers In Libraries 2024
 
Extra-120324-Visite-Entreprise-icare.pdf
Extra-120324-Visite-Entreprise-icare.pdfExtra-120324-Visite-Entreprise-icare.pdf
Extra-120324-Visite-Entreprise-icare.pdf
 

Android App Development using HTML5 Technology

  • 1. Android App Development using HTML5 Technology APPMAZINC Mobile Apps Camp 2012
  • 2. Summary  Intro Android Development  Android SDK Installation  Intro HTML5  Intro jQuery Mobile  Intro Webservice (XML, JSON)  PhoneGap (Apache Cordova)  Make RSS Reader App with PhoneGap
  • 3. Intro Android Development  Android Development  Java  HTML5  Native (C/C++)  Adobe AIR  Python  Unity  Develop on Mac, Windows, Linux and even on Android it self (AIDE: Android Java IDE)
  • 4. Android SDK Installation  Java SDK  Eclipse  Android SDK  ADT Plug-in  HTML5  PhoneGap  jQueryMobile
  • 5. HTML5  Markup language for structuring and presenting content for the WWW, and is a core technology of the Internet  HTML created in 1990, HTML4 1997  HTML5 is intended to subsume not only HTML4, but XHTML 1 and DOM LEVEL 2 HTML  HTML5 adds many new syntactic features  Canvas, Drag-and-Drop, Web Storage, …  Geolocation, Web SQL db, File API, …
  • 8. jQuery Mobile  A unified, HTML5-based user interface system for all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI Foundation.  Instead of writing unique apps for each mobile device/OS, the jQuery mobile framework allows you to design a single highly- branded web site or application that will work on all popular smartphone, tablet & desktop platforms.
  • 13. jQueryMobile <html> <head> <script type=“text/javascript” src=“jquery-1.8.2.min.js” /> <script type=“text/javascript” src=“jquery.mobile-1.2.0.min.js” /> <link rel=“stylesheet” href=“jquery.mobile-1.2.0.min.css” /> </head> <body> <h2>Simple List</h2> <ul data-role=“listview” data-inset=“true”> <li><a href=“index.html”>Element #1</a></li> <li><a href=“#”>Element #2</a></li> </ul> </body> </html>
  • 14. Web Service  A web service is a method of communication between two electronic device over the World Wide Web  Extensible Markup Language (XML)  SOAP  XML-RPC  Representational State Transfer (REST)  HTTP GET/POST/PUT/DELETE  JSON (Java Script Object Notation), is a text based open- standard designed for human-readable data interchange.
  • 15. XML <?xml version=“1.0” ?> <rss> <channel> <title>my RSS</title> <description>sample RSS</description> <item> <title>article1</title> <link>http://rss.test.com/article1.html</link> <description>article content of article1</description> </item> <item> <title>article2</title> <link>http://rss.test.com/article2.html</link> <description>article content of article2</description> </item> </channel> </rss>
  • 16. JSON { "rss": { "channel": { "title": "my RSS", "description": "sample RSS", "item": [ { "title": "article1", "link": "http://rss.test.com/article1.html", "description": "article content of article1" }, { "title": "article2", "link": "http://rss.test.com/article2.html", "description": "article content of article2" } ] } } }
  • 17. PhoneGap (Apache Cordova)  Open source framework for quickly building cross- platform mobile apps using HTML5, JavaScript, CSS.  PhoneGap code was contributed to Apache Software Foundation(ASF) under the name Apache Cordova.
  • 19. PhoneGap  Setup new Project > specify new app project  Create Activity > Blank Activity  Create new Directories (at project root dir):  /libs  assets/www  Copy cordova-2.0.0.js to assets/www  Copy cordova-2.0.0.jar to /libs  verify cordova-2.0.0.jar at eclipse java build path  Copy cordova/lib/android/xml to /res
  • 20. PhoneGap  Edit Activity file (.java)  Add import org.apache.cordova.*;  Change class’ extends from Activity to DroidGap  Replace the setContentView() line with super.loadUrl(“file:///android_asset/www/index.html”);  Edit AndroidManifest.xml  Create index.html and put to assets/www  Deploy to simulator
  • 21. Appmazinc App Challenge by Qualcomm  Android mobile application challenge focusing on Vuforia (Augmented Reality) and FastCV (Computer Vision) SDK  Prizes: 1st winner Rp12.000.000,- 2nd winner Rp 8.000.000,- 3rd winner Rp 5.000.000,-  All winners will be assisted to have business development with Qualcomm local brand partners.
  • 22. 7Langit  @7Langit team at Appmazinc workshop 2012  TitiRusdi  Oon Arfiandwi  TulusWijayanto  DyahAyu  KurniawanHaikal