Monday, 22 July 2013

Apache Cordova 3.0, Mac OS X and iOS Development: Part I - Installation

I've been interested in developing for iOS for quite some time, but the necessity to learn Objective C has postponed by efforts till now. A while back, Ramnath from our IISc Robotics Club mentioned about PhoneGap and the possibility to develop iOS and Android apps using nothing more than HTML/CSS and Javascript. My journey into mobile development begins here.

As a follower of the Apple-cult, I wanted to begin with iOS development and decided to install Apache Cordova/PhoneGap on my MacBook Air.

I used XCode 4.7 on Mac OS X 10.8 Mountain Lion and Cordova 3.0.0. The new rules set by Apple in May 2013 require apps to support iPhone 5 and retina displays. This means, anything created with versions prior to Cordova 2.5.0 would not be published to the App Store. I encountered several issues with this and finally was able to get it working. The following steps worked well for me. Please feel free to contact me for comments or clarifications.

Step 1: Install XCode from the App Store or from the Apple Developer Portals.

Step 2: Make sure that the Locations tab in XCode Preferences looks like this:


Step 3: Launch Terminal.app and enter the following to create a new app called HelloWorld. This is created in the folder iOSApps.


Step 4: Use XCode to open the .xcodeproj file from the directory that was created when the previous step was executed.


Step 5: After it opens with XCode, add $(OBJROOT)/UninstalledProducts/include  to Build Settings -> Header Search Paths in the Target. Choose the iPhone simulator and click on 'Run' at the top left corner to build and launch the simulator.


Step 6: If everything has gone well till now, the iPhone simulator launches with the sample app. 



References:

I found the following resources to be the most helpful.

1. Apache's documentation - The standard resource!
2. Ranjeet's blog - Though it's for Cordova 1.7 and is no longer completely valid, it provided clear insights.
3. Stackoverflow - 1Stackoverflow - 2Stackoverflow - 3 - Addresses a problem that I faced
4. PhoneGap Docs - Valuable info!
5. Wikipedia - The source of all human knowledge :P

No comments:

Post a Comment