前言：
目前移動端分為三大主流：純原生、混合開發、web App，隨著手機硬件的升級，公司們似乎偏好于web頁面開發，而混合開發相對純web App似乎更受大公司青睞，所謂混合開發俾人理解為，原生代碼（iOS：OC，Android：java）+ web。OK搞清楚了公司需求的大方向，下面就要確定到底用什么框架來開發web頁面，開發web頁面，目前最火的也就是ionic 和 react native 了吧，這兩者要怎么抉擇呢？
下面有他們的優劣的對比：
IONIC是目前最有潛力的一款 HTML5 手機應用開發框架。通過 SASS 構建應用程序，它提供了很多 UI 組件來幫助開發者開發強大的應用。 它使用 JavaScript MVVM 框架和 AngularJS 來增強應用。
提供數據的雙向綁定，使用它成為 Web 和移動開發者的共同選擇。Ionic是一個專注于用WEB開發技術，基于HTML5創建類似于手機平臺原生應用的一個開發框架。Ionic框架的目的是從web的角度開發手機應用，基于PhoneGap的編譯平臺，可以實現編譯成各個平臺的應用程序。
React Native 使你能夠使用基于 JavaScript 和 React 一致的開發體驗在本地平臺上構建世界一流的應用程序體驗。React Native 把重點放在所有開發人員關心的平臺的開發效率上——開發者只需學習一種語言就能輕易為任何平臺高效地編寫代碼。Facebook 在多個應用程序產品中使用了 React Native，并將繼續為 React Native 投資。
native就是使用使用原生java objective-c 開發， 各玩各的,無法跨平臺。
優劣對比
ionic ：
優勢：
ios 和 android 基本上可以共用代碼，純web思維，開發速度快，簡單方便，一次編碼，到處運行，如果熟悉web開發，則開發難度較低。
文檔很全，系統級支持封裝較好，所有UI組件都是有html模擬，可以統一使用。
可實現在線更新 允許加載動態加載web js
文檔多，開發者多，視頻教程多 容易學習 遇到問題容易解決 技術成熟
劣勢：
占用內存高一些（不過手機內存都大了不影響），不適合做游戲類型app， web技術無法解決一切問題，對于比較耗性能的地方無法利用native的思維實現優勢互補，如高體驗的交互，動畫等。
react-native ：
優勢：
1、雖然不能做到一處編碼到處運行，但是基本上即使是兩套代碼，也是相同的jsx語法，使用js進行開發。用戶體驗，高于html，開發效率較高 2、flexbox 布局 據說比native的自適應布局更加簡單高效
可實現在線更新 2015.7.28 AppStore審核政策調整：允許運行于JavascriptCore的動態加載代碼
更貼近原生開發
劣勢：
1、（引）對開發人員要求較高，不是懂點web技術就行的，當官方封裝的控件、api無法滿足需求時 就必然需要懂一些native的東西去擴展，擴展性仍然遠遠不如web，也遠遠不如直接寫Native code。
2、（引）官方說得很隱晦：learn once, write anywhere。人家可沒說run anywhere。事實上，從官方的api來看SliderIOS，SwitchIOS..等等這些控件，之后勢必會出現SliderAndroid，SwitchAndroid...，也就是很可能針對不同的平臺會需要寫多套代碼。
3、發展還不成熟，目前很多ui組件只有ios的實現，android的需要自己實現。
（引）從Native到Web，要做很多概念轉換，勢必造成雙方都要妥協。比如web要用一套CSS的閹割版，Native通過css-layout拿到最終樣式再轉換成native原生的表達方式（比如iOS的Constraint\origin\Center等屬性），再比如動畫。
另外，若Android和iOS都要做相同的封裝，概念轉換就更復雜 5、文檔還不夠完整 學習曲線偏高
4.文檔少 學習起來困難
native ：
優勢：
最好的體驗以及功能實現。
完善成熟的開發文檔以及demo。
劣勢：
android開發學習曲線較高。
各個平臺分開開發 很難有iOS,android雙平臺高手。
開發成本高 開發周期長
經過你多方考究：如果最終選擇React Native 那么請君留步，專看其他技術文章。。。。
如果是決定ionic開發，那么咱們就一起愉快的來往下玩耍，
廢話不多說，開始搞起。。。。再說一句廢話：我使用的是Mac
1、配置開發環境
1> Ionic開發是依賴于Nodejs環境的，所以下載安裝：http://nodejs.org/
2> 安裝成功后打開終端(PowerShell)，輸入命令node -v和npm -v有對應的版本號就代表成功了
3> npm install -g cordova ionic 過程可能有點慢。。。
4> ionic start MyIonic blank 通過終端創建一個空ionic項目，MyIonic為項目名稱
ionic start MyIonic tabs 創建一個帶tabs的項目
如果項目里面部分模塊需要用到ionic，最好先創建blank項目
5> 因為創建的時候默認添加了iOS平臺，如果要對Android平臺支持，輸入一下命令：
ionic platform add android 添加Android平臺
ionic platform add ios 添加iOS平臺
ionic platform list 查看是否添加成功
Installed platforms:
android 6.0.0
ios 4.1.1
Available platforms:
amazon-fireos ~3.6.3 (deprecated)
blackberry10 ~3.8.0
browser ~4.1.0
firefoxos ~3.6.3
osx ~4.0.1
webos ~3.7.0
注：輸入命令過程中如果碰到：
Error: EACCES: permission denied, open '/Users/XXXX/.config/configstore/bower-github.json'
You don't have access to this file.
解決：命令行前加 sudo
2、創建項目完成
查看自己所創建項目文件：
補充：config.xml 是ionic項目的一些配置文件，后期自定義插件時需要跟他打交道，這里就不多說了。。。
插件文件夾：
下面主要說下我們主要用到的www文件夾：
文件說明：
css:存放html中控件的style樣式：例如：width、 height、color、font-size
img: 顧名思義存放ionic項目中用到的圖片
index.html ionic項目的主通道
js: 存放js代碼塊
lib: 存放ionic本身的庫文件，當然你也可以添加一些其他庫，比如一些cordova庫
templates: 自己手動創建的文件夾，存放一些html文件
其他兩個.json .js文件是一些配置文件，不用管，也不要動
下面說下怎樣將做 混合開發 以iOS為例，在原有原生的基礎上，怎樣將你的ionic代碼放到你的項目中，將圈住的文件放到iOS項目中：
我項目中的效果：
既然是混合，肯定避免不了web 與 原生的交互，相互之間的傳值可以通過自定義插件，也可以通過橋接，個人對比下，寫橋接比較好方便，自己摸打滾爬了兩個月，感覺這里面的坑還是很多的。。。
今天先到這里吧，有時間了會把我碰到坑的解決方法，給大家共享出來，避免你們再走同樣的彎路，ionic網上的資料不太多，特別是針對混合開發的，有問題大家可以留言討論，OK 下班了。。。
