You have probably heard about PhoneGap development as an cross-platform tool to create mobile apps for different OSs, but what is really PhoneGap?
Well, it is an open source framework for building cross platform mobile applications. It is easy to write mobile applications using HTML,CSS and JavaScript. Now you don't have to worry about Objective C, java and other native languages to build Mobile Applications. PhoneGap is a very user friendly tool to build mobile applications. It is built on Apache Cordova and it has support for JS frameworks like: Sencha, backbone.js, Jquery Mobile and many others.
If what you're aiming for is a functionality-drive mobile app and you don't mind to rely a lot on internet connectivity then give PhoneGap a try and stop worrying about Objective C, Java and all other native programming languages for mobile app development.
PhoneGap provides support for using web standards to create native applications that runs on various different mobile platforms: iPhone, Android, Blackberry, Windows Phone.
PhoneGap provides many plugins used to interact with the hardware's device like:
Also it provides third party plugins which are ready use. You can create your know plugin also in native language to extend functionality.
Here is the list of plugins available.
PhoneGap wraps a web view with a native code. It is a web based solution while Appcelerator's Titanium is a JavaScript driven approach for native code creation. Web view used by PhoneGap is same as native web view for a respective platform. Said in other words, PhoneGap provides an easy way to create simple mobile apps that don't rely heavily on complex animations and other UX elements and mostly serve the purpose of being functional and do constant queries through the web. Titanium can provide with a much richer and native user experience, however the approach is quite different from one another.
For example: for iOS, it's Objective C UIWebView class
Installation of PhoneGap:
First of all you can download PhoneGap SDK from their webpage.
Unzip it and you can see different platform specific folders inside.
I will start with an iOS app because it takes fewer steps to get it ready
You will need the next tools:
Get details on compatibility versions for xcode vs. PhoneGap library.
Example:
1) Create directory for new project
2) Run the following command to create new Application:
a) To create project:
$ ./path/to/cordova-ios/bin/create /path/to/new_project packageName ProjectName
Example:
$ ./path/to/cordova-ios/bin/create /path/to/new_project com.test.helloWorld “HelloWorld”
b) To build project:
$ /path/to/new_project/cordova/build
c) Run App on an Emulator
$ /path/to/new_project/cordova/run
You can also run application -using xcode-
Just enter into project directory. Open xcode project (.xcodeproj)
Now here we have the project structure:
test
Explanation:
Project structure contains following folders--
Run Application:
If you want to make an Android app the set up is somehow different than it is for iOS, but no worries, there's an easy way to do it.
You will need the next tools:
Example:
Steps to create Android Phonegap App:
1) Check if you have the Android SDK’s tools and platform-tools folders in your PATH!
IF not, edit /.bash_profile
ADD:
export PATH=”/Users/developeri/android-sdk-macosx/tools/”:$PATHto your ~/.bash_profile
2) Create a project using following command:
$ /path/to/cordova-android/bin/create /path/to/new_project packageName ProjectName
Example:
$ ./path/to/cordova-android/bin/create /path/to/new_project com.test.helloWorld “HelloWorld”
3) To build project:
$ /path/to/new_project/cordova/build
4) Run App on an Emulator:
$ /path/to/new_project/cordova/run
— You can also run application using Eclipse—
Open eclipse -> Import project –> Android –> Existing Android Code Into Workspace.
Once the project has been imported, Run application from eclipse.
There is another way also to create application instead of using command line (using eclipse)
Follow this link to see how.
Sometimes its complicated to create a new Android App project and manually add everything. Don't worry; here we have solution for it.
AppLaud – It's the Eclipse plugin to create PhoneGap application.
How to add AppLaud plugin in eclipse?
Go to Help -> Install New Software –> enter download site
Click enter and follow the prompt window.
After installation finishes, you can see PhoneGap icon on the top:
Click on PhoneGap Icon to create new Android PhoneGap Application.
You can use built-in phonegap or specify already installed phonegap library as shown below:
Click 'Next' and follow the prompt.
Once the project is created, run Application. For more information on Applaud, click here.
There are different setups for different platforms. Here is the link for all platforms Guide.
There's always some issues that depends on the version of SDK, plugins, etc. For this example in specific we have the next know issues. If you get ERROR:
Please download, build and install version 1.5 or latest from here into your path. Or 'brew install ios-sim' using homebrew.
SOLUTION : Install ios-sim using following command— sudo npm install ios-sim –g
SOLUTION:This target might include its own product.
Reference:
Jyoti G. has a bachelor's degree in Information Technology From Chandigarh , India, with 3 years of working experience on Web and Mobile with additional experience on .NET. Now she specializes in Mobile Development (cross platform technologies), like phoneGap, Appcelerator Titanium.