Mac OSX環境で、スマートフォンアプリ開発初心者が、Cordova(PhoneGap)と、AngularJSベースのIonic Frameworkを使い、JavaScriptでiPhone/ Android両対応のネイティブ+HTML5 ハイブリッドモバイルアプリを開発し、iTunes App StoreおよびGoogle Playで公開するまでを何稿かに分けてカバーします。

ではまず、Cordova(PhoneGap)から。

Cordova開発環境を整える

事前準備

XCode最新版

予め、Mac用のIDE（統合開発環境）であるXcode最新版をインストールします。iOSシミュレータを使う、配布パッケージを作る時に必要になります。App Storeもしくは、Webからの.dmgダウンロードでインストールできます。
Xcodeをインストールする方法【iOSアプリの統合開発環境】 | TechAcademyマガジン : http://techacademy.jp/magazine/1409

Android Studio (Optional)

Androidでの開発を希望する場合は、Android Studioを導入します。
Download Android Studio and SDK Tools | Android Developers : http://developer.android.com/sdk/index.html

こちらのポストでMacでの詳細設定方法を説明します。
IonicでAndroid開発準備

node.js

nodeをインストールします。homebrewなどのパッケージ管理ソフトを使う、Webから直接ダウンロードする、お好きな方法で良いでしょう。
node.js : http://nodejs.jp/nodejs.org_ja/docs/v0.10/

node.jsはサーバサイドでJavaScriptを使うプラットフォームです。転じて、ブラウザ上だとセキュリティ上の制約上できないことがnode.jsでは実現できることから、Webサーバとしての用途のみならず、ハードウェアI/Oとの連携他、さまざまなことができます。

Cordovaのインストール

npmでcordovaをインストールします。npmはnode.js用のライブラリ管理ソフトです。Cordovaはnode.jsのライブラリとして提供されます。

$ npm install -g cordova

早速、Cordovaでサンプルプロジェクトを生成してみます。

$ cordova create test-project 
$ cd test-project

iOSプラットフォーム追加し、iOSエミュレータ連携ツールを入れます。

$ cordova platforms add ios
$ npm install -g ios-sim

アプリをビルドし、実行します。

$ cordova build ios
$ cordova emulate ios

iOSエミュレータが立ち上がり、サンプルアプリ画面が立ち上がれば成功です。

参考

私は初回導入時、自環境がXcode5だったためエラーとなりました。
App StoreからXCode6へバージョンアップするも、それもエラーで途中停止。
iOS Dev Center - Apple Developer : https://developer.apple.com/devcenter/ios/index.action
から.dmg版をダウンロード、インストールすることで、やっと正常起動しました。

1. Cordova(PhoneGap)準備、iOSエミュレータ起動まで - 新年だし、ハイブリッドアプリ開発環境を準備する