PhoneGap HelloWord with Eclipse
For this sample we will use:
- Eclipse IDE for Java EE Developers
- PhoneGap Build Service
- jQueryMobile for simple Interface
- GitHub for Share Project and Upload to PhoneGap Build Service
First of all we assume you have Eclipse IDE for Java EE Developers “Up and Running”. Download from here:
http://www.eclipse.org/downloads/
NOTE: At this time, we will not Build a Debuggable App in Android SDK or iOS SDK. This is a Pure HTML5 App, with its limitations for Platform Specific Debugging.
Now we are ready to create our HelloWord App
- Eclipse IDE for Java EE Developers
- PhoneGap Build Service
- jQueryMobile for simple Interface
- GitHub for Share Project and Upload to PhoneGap Build Service
First of all we assume you have Eclipse IDE for Java EE Developers “Up and Running”. Download from here:
http://www.eclipse.org/downloads/
NOTE: At this time, we will not Build a Debuggable App in Android SDK or iOS SDK. This is a Pure HTML5 App, with its limitations for Platform Specific Debugging.
Now we are ready to create our HelloWord App
- Create an Eclipse Static Web Project
File > New > Static Web Project
we configure web content in a www folder instead of standard WebContent. This Is not necessary but reading here you can understand https://build.phonegap.com/docs/preparing-your-app - At the end you have a “ready to run” project, now put your html, js, css sources.
To build UI with jQuery Mobile we need to include necessary files from jQuery and jQuery Mobile
We also include cordova.js from PhoneGap
You can download my sample Project from GitHub git://github.com/mattocchi/PhonegapHelloWord.git
Our App File is index.html and you can find this sample here:
https://github.com/mattocchi/PhonegapHelloWord/blob/master/www/index.html
This is a simple test with two Pages and buttons to move between pages, but you can create more complex interfaces with jQuery Mobile using http://codiqa.com/
NOTE: With Eclipse Juno I have a problem with validation of jQuery Mobile Scripts, and we need to esclude it, I do this:
Another important file is config.xmlIt contains all information for PhoneGap Build Service, and you can tell and configure many aspects. You can understand it here https://build.phonegap.com/docs/config-xml - After you create your own index.html app file you are ready to run the project pointing index.html file with your mouse, right click and “run as” > “run on server”
NOTE: I’m using Chrome Browser to show app made with jQuery Mobile - You are ready to build you PhoneGap App with Build Service.
Register and Create a New App at https://build.phonegap.com
To understand why iOs App is not ready, you can read here https://build.phonegap.com/docs/ios-builds
For Android note that your Builded (and downloadable) .apk is not Signed and you cannot publish on Market until you sign it.
Commenti