SlideShare a Scribd company logo
Developing Mobile
Application
(Android/IOS/Windows)
using Phonegap
Building Apps with HTML,CSS & JavaScript
fahim000bd@gmail.com
1
Agenda:
What is PhoneGap?
 PhoneGap Architecture .
Pre-requisite of using PhoneGap
 Building an App.
Upload apk/ipa into Play Store/itunes.
 Summary .
fahim000bd@gmail.com
2
PhoneGap..
PhoneGap is an open source
framework for quickly building
cross-platform mobile apps
using HTML5, Javascript and
CSS. Wrap your app
with PhoneGap Deploy to
mobile platforms!! It’s actually
a tool for building mobile apps
using Web technologies.
fahim000bd@gmail.com
3
Why Phonegap?
If you think of adopting different
platforms while building an app
and PhoneGap is just one of them. It is
widely preferred by mobile development
agencies to build mobile apps because it
has rich features and an open source
technology.
It combines HTML5, CSS3 and
JavaScript to create mobile apps with
great innovative features. A mobile
development agency offering mobile
apps development services include
this technology to build mobile apps for
numerous platform.
fahim000bd@gmail.com
4
How Phonegap Works:
fahim000bd@gmail.com
5
Cont…
 Build App with Web standards: Developers already know how
to make a web technologies using html5,css & javascript.
 Wrap that with Phonegap: Using this phonegap build,one can
get access to native API’s
 Deploy to Multiple platforms: Phonegap actually uses standard
based web technologies to bridges web application & mobile
devices.
fahim000bd@gmail.com
6
Before PhoneGap Build
 Creating config.xml file on the project for configuring Phonegap.
Example:
 Create a resource folder in www directory & resize the icon as well as
the screen banner manually.
 The Icon image must have been resizing as six generalized densities.
Such as ldpi , mdpi , hdpi , xhdpi , xxhdpi , xxxhdpi . That will be
mentioned at config.xml file as the previous example.
fahim000bd@gmail.com
7
Cont…
Freshers needs to Create Phonegap & Github account before
using phonegap:
 Github Account: Freshers needs to sign up a account in github.
https://github.com/
 Phonegap Build: Account is mendatory for Phonegap Building.
https://build.phonegap.com
After Creating two of that account,One can get easily access in
Phonegap.
fahim000bd@gmail.com
8
PhoneGap Build
 All of the project should remain in a folder & would be zipped.
 The zipped file needs to be uploaded at www.build.phonegap.com
fahim000bd@gmail.com
9
Cont…
After uploading the file, Phonegap will automatically generate the web
application into a android,ios,windows device supported program. Now
download the apk/xap/ipa,install it to your device & ENJOY!!!
fahim000bd@gmail.com
10
Upload APP in store:
For Android Application if u want to upload your app for rest
of the user of the world,you have to upload the apk in play
store.To know how you have to upload the apk in play store
you can watch this vedio
One can easily upload his app at play store.But for Phonegap
apk,there has some bindings. Playstore looks for signed apk,but
apk collected from phonegap is not realesed.
fahim000bd@gmail.com
11
To upload the apk in store, Bindigs/error of phonegap apk
needs to be solved
 You must create a signing key and upload it to PhoneGapBuild to
use.
 To get Signed apk, Machine/Device must be setted with java
environment.
 Then needs to create a java keystore file using java keytool.
 After Creating keystore, We need to add it at Phonegap & rebuild
the code to get updated apk,which will be realesed apk.
SIGN APK
fahim000bd@gmail.com
12
Keystore Creation:
To Create a Keystore for Signing your build using a java utility called "keytool“, A
Command Promt needs to be opened.
fahim000bd@gmail.com
13
Command Promt:
Next Steps Upload that to PhoneGap Build.
Unlock the keystore for 1 hour by entering your keystore password
Now rebuild the app
This will create a release version of the .apk that can be uploaded to Google Play
 Find keytool (it comes with java). I found mine at: C:Program
FilesJavajre6bin
 Open command prompt and enter the following commands
 cd C:Program FilesJavajre6bin
(use whatever dir you found the keytool in)
 keytool -genkey -v -keystore C:DIRAPPNAME.keystore -alias APPNAME -
keyalg RSA -keysize 2048 -validity 10000
(Change DIR and APPNAME to something appropriate)
 Enter the keystore password (remember this
 Answer the questions about yourself: your name, organization, location, etc.
 DONE: The keystore will be created for your app
fahim000bd@gmail.com
14
Upload APP in store:
 Now This signed apk is ready to publish in play store.
 Create a playstore account (Which will cost 25$) or if you have a playstore
account ,can upload the apk.
 This Vedio will help one how to upload apk in Playstore.
fahim000bd@gmail.com
15
Resources
 Configering: http://docs.phonegap.com/phonegap-build/configuring/
 Phonegap Build: https://www.youtube.com/watch?v=Sq2EDVJr_v8
 Keystore Creating: https://www.youtube.com/watch?v=I5ilyZMO33o
 Upload in Playstore: https://www.youtube.com/watch?v=-f3PM04J6uc
fahim000bd@gmail.com
16
Lets Try..
Thank You..!.
fahim000bd@gmail.com
17

More Related Content

What's hot

warblecamp - twical
warblecamp - twical warblecamp - twical
warblecamp - twical
Angus Fox
 

What's hot (20)

Hello PhoneGap
Hello PhoneGapHello PhoneGap
Hello PhoneGap
 
Ember.js - Harnessing Convention Over Configuration
Ember.js - Harnessing Convention Over ConfigurationEmber.js - Harnessing Convention Over Configuration
Ember.js - Harnessing Convention Over Configuration
 
How to make Twitter app with PhoneGap/Cordova
How to make Twitter app with PhoneGap/CordovaHow to make Twitter app with PhoneGap/Cordova
How to make Twitter app with PhoneGap/Cordova
 
ApacheCon 2011
ApacheCon 2011ApacheCon 2011
ApacheCon 2011
 
Heading towards the great release of angular 8.0 development observe the uno...
Heading towards the great release of angular 8.0 development  observe the uno...Heading towards the great release of angular 8.0 development  observe the uno...
Heading towards the great release of angular 8.0 development observe the uno...
 
Develop Windows 8 & Windows Phone apps using crucial Google APIs
Develop Windows 8 & Windows Phone apps using crucial Google APIsDevelop Windows 8 & Windows Phone apps using crucial Google APIs
Develop Windows 8 & Windows Phone apps using crucial Google APIs
 
DevOps + MongoDB Serverless = 
DevOps + MongoDB Serverless = DevOps + MongoDB Serverless = 
DevOps + MongoDB Serverless = 
 
Essentials of developing_tizen_web_application_en_1.0
Essentials of developing_tizen_web_application_en_1.0Essentials of developing_tizen_web_application_en_1.0
Essentials of developing_tizen_web_application_en_1.0
 
The Ring programming language version 1.5.4 book - Part 4 of 185
The Ring programming language version 1.5.4 book - Part 4 of 185The Ring programming language version 1.5.4 book - Part 4 of 185
The Ring programming language version 1.5.4 book - Part 4 of 185
 
Create a Profitable News App using Ionic 4 and Angular
Create a Profitable News App using Ionic 4 and Angular								Create a Profitable News App using Ionic 4 and Angular
Create a Profitable News App using Ionic 4 and Angular
 
Facebook F8
Facebook F8Facebook F8
Facebook F8
 
Building CI/CD Pipelines for MongoDB Realm Apps
Building CI/CD Pipelines for MongoDB Realm AppsBuilding CI/CD Pipelines for MongoDB Realm Apps
Building CI/CD Pipelines for MongoDB Realm Apps
 
Phone gap
Phone gapPhone gap
Phone gap
 
Firebase crashlytics integration in iOS swift (dSYM File Required Problem Res...
Firebase crashlytics integration in iOS swift (dSYM File Required Problem Res...Firebase crashlytics integration in iOS swift (dSYM File Required Problem Res...
Firebase crashlytics integration in iOS swift (dSYM File Required Problem Res...
 
Continuous Delivery for Mobile platforms (iOS and a bit of Android)
Continuous Delivery for Mobile platforms (iOS and a bit of Android)Continuous Delivery for Mobile platforms (iOS and a bit of Android)
Continuous Delivery for Mobile platforms (iOS and a bit of Android)
 
ReactJS
ReactJSReactJS
ReactJS
 
Building an App for Mobile and Web with Expo
Building an App for Mobile and Web with ExpoBuilding an App for Mobile and Web with Expo
Building an App for Mobile and Web with Expo
 
warblecamp - twical
warblecamp - twical warblecamp - twical
warblecamp - twical
 
DeveloperWeek2018 - Let's Build a Chatbot
DeveloperWeek2018 - Let's Build a ChatbotDeveloperWeek2018 - Let's Build a Chatbot
DeveloperWeek2018 - Let's Build a Chatbot
 
Android instant app
Android instant appAndroid instant app
Android instant app
 

Similar to Developing Mobile Application using Phonegap

PERTEMUAN 3_INTRO TO ANDROID APP DEV.pdf
PERTEMUAN 3_INTRO TO ANDROID APP DEV.pdfPERTEMUAN 3_INTRO TO ANDROID APP DEV.pdf
PERTEMUAN 3_INTRO TO ANDROID APP DEV.pdf
arfa442827
 
Android SDK and PhoneGap
Android SDK and PhoneGapAndroid SDK and PhoneGap
Android SDK and PhoneGap
Doncho Minkov
 
Windows Phone Mango and PhoneGap
Windows Phone Mango and PhoneGapWindows Phone Mango and PhoneGap
Windows Phone Mango and PhoneGap
Doncho Minkov
 
PhoneGap/PhoneGap Build - Amsterdam Adobe Camp
PhoneGap/PhoneGap Build - Amsterdam Adobe CampPhoneGap/PhoneGap Build - Amsterdam Adobe Camp
PhoneGap/PhoneGap Build - Amsterdam Adobe Camp
Mihai Corlan
 
Dev windows phone_apps_getting_started_guide
Dev windows phone_apps_getting_started_guideDev windows phone_apps_getting_started_guide
Dev windows phone_apps_getting_started_guide
TrioBlack Trioblack
 

Similar to Developing Mobile Application using Phonegap (20)

PhoneGap JavaScript API vs Native Components
PhoneGap JavaScript API vs Native ComponentsPhoneGap JavaScript API vs Native Components
PhoneGap JavaScript API vs Native Components
 
How to build PhoneGap App for Windows Phone?
How to build PhoneGap App for Windows Phone?How to build PhoneGap App for Windows Phone?
How to build PhoneGap App for Windows Phone?
 
Intro to PhoneGap
Intro to PhoneGapIntro to PhoneGap
Intro to PhoneGap
 
Hospital app project (how to upload app)
Hospital app project (how to upload app)Hospital app project (how to upload app)
Hospital app project (how to upload app)
 
How to build your own Android App -Step by Step Guide
How to build your own Android App -Step by Step GuideHow to build your own Android App -Step by Step Guide
How to build your own Android App -Step by Step Guide
 
PERTEMUAN 3_INTRO TO ANDROID APP DEV.pdf
PERTEMUAN 3_INTRO TO ANDROID APP DEV.pdfPERTEMUAN 3_INTRO TO ANDROID APP DEV.pdf
PERTEMUAN 3_INTRO TO ANDROID APP DEV.pdf
 
Android SDK and PhoneGap
Android SDK and PhoneGapAndroid SDK and PhoneGap
Android SDK and PhoneGap
 
201505 beena v0
201505 beena v0201505 beena v0
201505 beena v0
 
Bird.pdf
 Bird.pdf Bird.pdf
Bird.pdf
 
Build run first web application using flutter for web
Build run first web application using flutter for webBuild run first web application using flutter for web
Build run first web application using flutter for web
 
Android Lab Mannual 18SUITSP5.docx
Android Lab Mannual 18SUITSP5.docxAndroid Lab Mannual 18SUITSP5.docx
Android Lab Mannual 18SUITSP5.docx
 
Windows Phone Mango and PhoneGap
Windows Phone Mango and PhoneGapWindows Phone Mango and PhoneGap
Windows Phone Mango and PhoneGap
 
Summary Of Polycom Cast App
Summary Of Polycom Cast AppSummary Of Polycom Cast App
Summary Of Polycom Cast App
 
Getting Acquainted with PhoneGap
Getting Acquainted with PhoneGapGetting Acquainted with PhoneGap
Getting Acquainted with PhoneGap
 
PhoneGap/PhoneGap Build - Amsterdam Adobe Camp
PhoneGap/PhoneGap Build - Amsterdam Adobe CampPhoneGap/PhoneGap Build - Amsterdam Adobe Camp
PhoneGap/PhoneGap Build - Amsterdam Adobe Camp
 
Using PhoneGap Command Line
Using PhoneGap Command LineUsing PhoneGap Command Line
Using PhoneGap Command Line
 
Dev windows phone_apps_getting_started_guide
Dev windows phone_apps_getting_started_guideDev windows phone_apps_getting_started_guide
Dev windows phone_apps_getting_started_guide
 
Final NEWS.pdf
Final NEWS.pdfFinal NEWS.pdf
Final NEWS.pdf
 
Final NewsApp.pdf
Final NewsApp.pdfFinal NewsApp.pdf
Final NewsApp.pdf
 
The Best Alternatives To The Ionic Framework.pdf
The Best Alternatives To The Ionic Framework.pdfThe Best Alternatives To The Ionic Framework.pdf
The Best Alternatives To The Ionic Framework.pdf
 

Recently uploaded

Prosigns: Transforming Business with Tailored Technology Solutions
Prosigns: Transforming Business with Tailored Technology SolutionsProsigns: Transforming Business with Tailored Technology Solutions
Prosigns: Transforming Business with Tailored Technology Solutions
Prosigns
 
Mastering Windows 7 A Comprehensive Guide for Power Users .pdf
Mastering Windows 7 A Comprehensive Guide for Power Users .pdfMastering Windows 7 A Comprehensive Guide for Power Users .pdf
Mastering Windows 7 A Comprehensive Guide for Power Users .pdf
mbmh111980
 
AI/ML Infra Meetup | Improve Speed and GPU Utilization for Model Training & S...
AI/ML Infra Meetup | Improve Speed and GPU Utilization for Model Training & S...AI/ML Infra Meetup | Improve Speed and GPU Utilization for Model Training & S...
AI/ML Infra Meetup | Improve Speed and GPU Utilization for Model Training & S...
Alluxio, Inc.
 

Recently uploaded (20)

Paketo Buildpacks : la meilleure façon de construire des images OCI? DevopsDa...
Paketo Buildpacks : la meilleure façon de construire des images OCI? DevopsDa...Paketo Buildpacks : la meilleure façon de construire des images OCI? DevopsDa...
Paketo Buildpacks : la meilleure façon de construire des images OCI? DevopsDa...
 
GraphAware - Transforming policing with graph-based intelligence analysis
GraphAware - Transforming policing with graph-based intelligence analysisGraphAware - Transforming policing with graph-based intelligence analysis
GraphAware - Transforming policing with graph-based intelligence analysis
 
Prosigns: Transforming Business with Tailored Technology Solutions
Prosigns: Transforming Business with Tailored Technology SolutionsProsigns: Transforming Business with Tailored Technology Solutions
Prosigns: Transforming Business with Tailored Technology Solutions
 
Accelerate Enterprise Software Engineering with Platformless
Accelerate Enterprise Software Engineering with PlatformlessAccelerate Enterprise Software Engineering with Platformless
Accelerate Enterprise Software Engineering with Platformless
 
AI/ML Infra Meetup | Perspective on Deep Learning Framework
AI/ML Infra Meetup | Perspective on Deep Learning FrameworkAI/ML Infra Meetup | Perspective on Deep Learning Framework
AI/ML Infra Meetup | Perspective on Deep Learning Framework
 
WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation
WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital TransformationWSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation
WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation
 
TROUBLESHOOTING 9 TYPES OF OUTOFMEMORYERROR
TROUBLESHOOTING 9 TYPES OF OUTOFMEMORYERRORTROUBLESHOOTING 9 TYPES OF OUTOFMEMORYERROR
TROUBLESHOOTING 9 TYPES OF OUTOFMEMORYERROR
 
Mastering Windows 7 A Comprehensive Guide for Power Users .pdf
Mastering Windows 7 A Comprehensive Guide for Power Users .pdfMastering Windows 7 A Comprehensive Guide for Power Users .pdf
Mastering Windows 7 A Comprehensive Guide for Power Users .pdf
 
Cyaniclab : Software Development Agency Portfolio.pdf
Cyaniclab : Software Development Agency Portfolio.pdfCyaniclab : Software Development Agency Portfolio.pdf
Cyaniclab : Software Development Agency Portfolio.pdf
 
top nidhi software solution freedownload
top nidhi software solution freedownloadtop nidhi software solution freedownload
top nidhi software solution freedownload
 
Abortion ^Clinic ^%[+971588192166''] Abortion Pill Al Ain (?@?) Abortion Pill...
Abortion ^Clinic ^%[+971588192166''] Abortion Pill Al Ain (?@?) Abortion Pill...Abortion ^Clinic ^%[+971588192166''] Abortion Pill Al Ain (?@?) Abortion Pill...
Abortion ^Clinic ^%[+971588192166''] Abortion Pill Al Ain (?@?) Abortion Pill...
 
Using IESVE for Room Loads Analysis - Australia & New Zealand
Using IESVE for Room Loads Analysis - Australia & New ZealandUsing IESVE for Room Loads Analysis - Australia & New Zealand
Using IESVE for Room Loads Analysis - Australia & New Zealand
 
iGaming Platform & Lottery Solutions by Skilrock
iGaming Platform & Lottery Solutions by SkilrockiGaming Platform & Lottery Solutions by Skilrock
iGaming Platform & Lottery Solutions by Skilrock
 
Beyond Event Sourcing - Embracing CRUD for Wix Platform - Java.IL
Beyond Event Sourcing - Embracing CRUD for Wix Platform - Java.ILBeyond Event Sourcing - Embracing CRUD for Wix Platform - Java.IL
Beyond Event Sourcing - Embracing CRUD for Wix Platform - Java.IL
 
A Python-based approach to data loading in TM1 - Using Airflow as an ETL for TM1
A Python-based approach to data loading in TM1 - Using Airflow as an ETL for TM1A Python-based approach to data loading in TM1 - Using Airflow as an ETL for TM1
A Python-based approach to data loading in TM1 - Using Airflow as an ETL for TM1
 
De mooiste recreatieve routes ontdekken met RouteYou en FME
De mooiste recreatieve routes ontdekken met RouteYou en FMEDe mooiste recreatieve routes ontdekken met RouteYou en FME
De mooiste recreatieve routes ontdekken met RouteYou en FME
 
AI/ML Infra Meetup | Improve Speed and GPU Utilization for Model Training & S...
AI/ML Infra Meetup | Improve Speed and GPU Utilization for Model Training & S...AI/ML Infra Meetup | Improve Speed and GPU Utilization for Model Training & S...
AI/ML Infra Meetup | Improve Speed and GPU Utilization for Model Training & S...
 
A Comprehensive Appium Guide for Hybrid App Automation Testing.pdf
A Comprehensive Appium Guide for Hybrid App Automation Testing.pdfA Comprehensive Appium Guide for Hybrid App Automation Testing.pdf
A Comprehensive Appium Guide for Hybrid App Automation Testing.pdf
 
Corporate Management | Session 3 of 3 | Tendenci AMS
Corporate Management | Session 3 of 3 | Tendenci AMSCorporate Management | Session 3 of 3 | Tendenci AMS
Corporate Management | Session 3 of 3 | Tendenci AMS
 
Vitthal Shirke Microservices Resume Montevideo
Vitthal Shirke Microservices Resume MontevideoVitthal Shirke Microservices Resume Montevideo
Vitthal Shirke Microservices Resume Montevideo
 

Developing Mobile Application using Phonegap

  • 1. Developing Mobile Application (Android/IOS/Windows) using Phonegap Building Apps with HTML,CSS & JavaScript fahim000bd@gmail.com 1
  • 2. Agenda: What is PhoneGap?  PhoneGap Architecture . Pre-requisite of using PhoneGap  Building an App. Upload apk/ipa into Play Store/itunes.  Summary . fahim000bd@gmail.com 2
  • 3. PhoneGap.. PhoneGap is an open source framework for quickly building cross-platform mobile apps using HTML5, Javascript and CSS. Wrap your app with PhoneGap Deploy to mobile platforms!! It’s actually a tool for building mobile apps using Web technologies. fahim000bd@gmail.com 3
  • 4. Why Phonegap? If you think of adopting different platforms while building an app and PhoneGap is just one of them. It is widely preferred by mobile development agencies to build mobile apps because it has rich features and an open source technology. It combines HTML5, CSS3 and JavaScript to create mobile apps with great innovative features. A mobile development agency offering mobile apps development services include this technology to build mobile apps for numerous platform. fahim000bd@gmail.com 4
  • 6. Cont…  Build App with Web standards: Developers already know how to make a web technologies using html5,css & javascript.  Wrap that with Phonegap: Using this phonegap build,one can get access to native API’s  Deploy to Multiple platforms: Phonegap actually uses standard based web technologies to bridges web application & mobile devices. fahim000bd@gmail.com 6
  • 7. Before PhoneGap Build  Creating config.xml file on the project for configuring Phonegap. Example:  Create a resource folder in www directory & resize the icon as well as the screen banner manually.  The Icon image must have been resizing as six generalized densities. Such as ldpi , mdpi , hdpi , xhdpi , xxhdpi , xxxhdpi . That will be mentioned at config.xml file as the previous example. fahim000bd@gmail.com 7
  • 8. Cont… Freshers needs to Create Phonegap & Github account before using phonegap:  Github Account: Freshers needs to sign up a account in github. https://github.com/  Phonegap Build: Account is mendatory for Phonegap Building. https://build.phonegap.com After Creating two of that account,One can get easily access in Phonegap. fahim000bd@gmail.com 8
  • 9. PhoneGap Build  All of the project should remain in a folder & would be zipped.  The zipped file needs to be uploaded at www.build.phonegap.com fahim000bd@gmail.com 9
  • 10. Cont… After uploading the file, Phonegap will automatically generate the web application into a android,ios,windows device supported program. Now download the apk/xap/ipa,install it to your device & ENJOY!!! fahim000bd@gmail.com 10
  • 11. Upload APP in store: For Android Application if u want to upload your app for rest of the user of the world,you have to upload the apk in play store.To know how you have to upload the apk in play store you can watch this vedio One can easily upload his app at play store.But for Phonegap apk,there has some bindings. Playstore looks for signed apk,but apk collected from phonegap is not realesed. fahim000bd@gmail.com 11
  • 12. To upload the apk in store, Bindigs/error of phonegap apk needs to be solved  You must create a signing key and upload it to PhoneGapBuild to use.  To get Signed apk, Machine/Device must be setted with java environment.  Then needs to create a java keystore file using java keytool.  After Creating keystore, We need to add it at Phonegap & rebuild the code to get updated apk,which will be realesed apk. SIGN APK fahim000bd@gmail.com 12
  • 13. Keystore Creation: To Create a Keystore for Signing your build using a java utility called "keytool“, A Command Promt needs to be opened. fahim000bd@gmail.com 13
  • 14. Command Promt: Next Steps Upload that to PhoneGap Build. Unlock the keystore for 1 hour by entering your keystore password Now rebuild the app This will create a release version of the .apk that can be uploaded to Google Play  Find keytool (it comes with java). I found mine at: C:Program FilesJavajre6bin  Open command prompt and enter the following commands  cd C:Program FilesJavajre6bin (use whatever dir you found the keytool in)  keytool -genkey -v -keystore C:DIRAPPNAME.keystore -alias APPNAME - keyalg RSA -keysize 2048 -validity 10000 (Change DIR and APPNAME to something appropriate)  Enter the keystore password (remember this  Answer the questions about yourself: your name, organization, location, etc.  DONE: The keystore will be created for your app fahim000bd@gmail.com 14
  • 15. Upload APP in store:  Now This signed apk is ready to publish in play store.  Create a playstore account (Which will cost 25$) or if you have a playstore account ,can upload the apk.  This Vedio will help one how to upload apk in Playstore. fahim000bd@gmail.com 15
  • 16. Resources  Configering: http://docs.phonegap.com/phonegap-build/configuring/  Phonegap Build: https://www.youtube.com/watch?v=Sq2EDVJr_v8  Keystore Creating: https://www.youtube.com/watch?v=I5ilyZMO33o  Upload in Playstore: https://www.youtube.com/watch?v=-f3PM04J6uc fahim000bd@gmail.com 16