Android app development hybrid approach for beginners - Tools Installations and Settings in Windows 8

16/4/2015 http://blog.kerul.net 1
Installation, Settings & Deployment
(Hybrid approach using HTML5, jQuery,
Apache Cordova and Android SDK)
Khirulnizam Abd Rahman
blog.kerul.net

About Khirulnizam
 Lecturer of Computer Science, Faculty of Information
Science and Technology, Selangor International
Islamic University College (KUIS) – since 2000.
 Certified HRDF Trainer
 Codes in blog.kerul.net
 Avid Android developer since 2010 – MDeC ICONApp
2010.
 Grants MDeC ICON 2010,2011; MDeC ICONdap
2013.
 Apps in Google Play
 SmartSolat (prototype) – 2014 bit.ly/smartsolat
 M-Mathurat – 200K ( bit.ly/m-mathurat )
 Peribahasa Dictionary – 20K ( bit.ly/pbahasa)
 mDictionary – open-sourced ( bit.ly/m-dictionary )

Hybrid Approach

Hybrid Approach – consists
of
 HTML + jQuery (JavaScript, CSS)
 Apache Cordova (HTML to Android
Project)
 Android Studio– to generate APK

What are tools needed to
develop Android App Hybrid?
 HTML knowledge
 jQuery (JavaScript + CSS framework)
 PHP&MySQL (Online DB)
 NodeJS
 Apache Ant
 Apache Cordova
 Latest JDK
 Android Studio
 Android SDK

Apache ANT
 Apache Ant is a Java library and
command-line tool
 to drive processes described in build
files as targets and extension points
dependent upon each other.
 The main known usage of Ant is the
build of Java applications.

NodeJS
 Node.js contains a built-in library to
allow applications to act as a Web
server without software such as Apache
HTTP

Apache Cordova
 Previously known as PhoneGap
 use HTML5 and CSS3 for their rendering,
and JavaScript for logic
 HTML5 provides better support for GPS,
camera, video, etc.
 includes basic plugins that allow access to
the device's hardware’s.
 embeds HTML5 code inside a native
WebView on the device, using a foreign
function interface to access the native
resources of the device.

Agenda Day 4
16/4/2015 ANDROID APP DEVELOPMENT (Hybrid) - blog.kerul.net 9

Installation of Android
Studio
 Install JDK (needed to run Android
Studio)
 Install the Android Studio
 Inside Android Studio is included
Android SDK
 Needed to convert web apps into
Android project

Android Studio
 Download from
http://developer.android.com/sdk/index.html

Inside Android Studio
bundle
 Android Studio IDE
 Android SDK tools
 Android 5.0 (Lollipop) Platform
 Android 5.0 emulator system image with
Google APIs

Installation of Cordova
 Install Apache ANT – extract the binary
provided (or download from
http://ant.apache.org/bindownload.cgi)
 Install NodeJS -
http://nodejs.org/download/

Environment Variables
 Right-click on MyComputer ->
Properties

Environment Variables
 Set JAVA_HOME
 Set ANT_HOME
 Set ANDROID_HOME
 Set the path to Android SDK platforms
and platform_tools
 Testing

Set JAVA_HOME

Set ANT_HOME

Set Path

Set path
Add to end of the existing PATH
;%JAVA_HOME%bin;
%ANT_HOME%bin;
%ANDROID_HOME%tools;
%ANDROID_HOME%platform-tools

Cmd line
 To run ant commands
 Search for CMD, right-click and Run as
administrator

Test running ant

Download Cordova
 Update nodejs
npm update
 Install Apache Cordova
npm install –g cordova

Generate Android Project

Open Android project in
Android Studio

Change ic_launcher
 Res/drawable

 Turn ON the AVD
Test APK on Emulator

 Complete guide: http://blog.kerul.net/2015/04/android-
studio-to-generate-signed-apk.html16/4/2015 http://blog.kerul.net 33
Sign APK

 Preparation
 Signed APK
 Icon 512x512
 2 apps screenshots
 Banner 1024 w x 500 h
 Apps descriptions
 https://play.google.com/apps/publish/
 Complete guide:
http://blog.kerul.net/2015/04/publishing-
apps-to-google-play.html
Upload to Google Play

All the best
 Check your apps tomorrow

Android app development hybrid approach for beginners - Tools Installations and Settings in Windows 8

Recommended

More Related Content

What's hot (20)

Viewers also liked (9)

Similar to Android app development hybrid approach for beginners - Tools Installations and Settings in Windows 8 (20)

More from Khirulnizam Abd Rahman (17)

Recently uploaded (20)

Android app development hybrid approach for beginners - Tools Installations and Settings in Windows 8