最佳實踐:開始用Cordova + Ionic + AngularJS 開發你的 App

jopen 10年前發布 | 66K 次閱讀 Cordova 移動開發
 

本文是一篇關于我本人在使用 Cordova + Ionic 以及 AngularJS 開發移動App的過程中的經驗的總結,它不是一篇基礎入門教程,而是和大家探討一下關于如何更好的使用這些技術開發一個更好的App,文章會每天抽一點時間完成,如果您有什么問題或者想與我交流的經驗,歡迎隨時在本文下方評論或者郵件給我:54778899 [at] qq.com。

聲明:這是一篇中立的文章,我無意于挑起孰好孰壞的爭論,這只是一篇經驗分享文,至于為什么選擇這種技術,因為我會這個,感覺還不錯。

Cordova, Ionic, AngularJS 都是什么?

Cordova

Cordova是一款開放源代碼的App開發框架,旨在讓開發者使用HTML、Javascript、CSS等Web APIs開發跨平臺的移動平臺應用程序,其原名稱之為 PhoneGap,Adobe 收購Nitobi 公司后,PhoneGap 商標保留,代碼貢獻給了 Apache 基金會,而Apache 將其命名為 Apache Callback,其后發布新版本時,定名為 Apache Cordova。

Cordova是一個行動設備的API接口集,利用JavaScript存取這些接口可以調用諸如攝影機、羅盤等硬件系統資源。配合上一些基于 HTML5、CSS3技術的UI框架,如jQuery Mobile、Dojo Mobile或Sencha Touch,開發者得以快速地開發跨平臺App而不需要編寫任何的原生代碼。

注意到因為Cordova本身仍是一個原生程式,為App打包時依然需要用到這些系統平臺的SDK。

本文將結合 Ionic 前端框架進行開發

Ionic

Ionic是一個新的、可以使用HTML5構建混合移動應用的用戶界面框架,它自稱為是“本地與HTML5的結合”。該框架提供了很多基本的移動用戶界面范例,例如像列表(lists)、標簽頁欄(tab bars)和觸發開關(toggle switches)這樣的簡單條目。它還提供了更加復雜的可視化布局示例,例如在下面顯示內容的滑出式菜單。

Ionic宣稱他們極度強調性能,并且通過限制DOM交互、完全移除jQuery以及使用像translate(z)這種特定的硬件加速的CSS濾鏡觸發移動設備上GPU——與由動力不足的移動瀏覽器提供的交互相比這種方式提供了硬件加速的交互——等方式使速度最大化。

AngularJS

AngularJS是建立在這樣的信念上的:即聲明式編程應該用于構建用戶界面以及編寫軟件構建,而指令式編程非常適合來表示業務邏輯。[1] 框架采用并擴展了傳統HTML,通過雙向的數據綁定來適應動態內容,雙向的數據綁定允許模型和視圖之間的自動同步。因此,AngularJS使得對DOM 的操作不再重要并提升了可測試性。

設計目標:

  • 將應用邏輯與對DOM的操作解耦。這會提高代碼的可測試性。
  • 將應用程序的測試看的跟應用程序的編寫一樣重要。代碼的構成方式對測試的難度有巨大的影響。
  • 將應用程序的客戶端與服務器端解耦。這允許客戶端和服務器端的開發可以齊頭并進,并且讓雙方的復用成為可能。
  • 指導開發者完成構建應用程序的整個歷程:從用戶界面的設計,到編寫業務邏輯,再到測試。

Angular遵循軟件工程的MVC模式,并鼓勵展現,數據,和邏輯組件之間的松耦合。通過 依賴注入(dependency injection) ,Angular為客戶端的Web應用帶來了傳統服務端的服務,例如獨立于視圖的控制。因此,后端減少了許多負擔,產生了更輕的Web應用。

開發環境

我所使用的開發環境包括下面這些:

工作站:一臺13寸的 MacBook Pro Retina + iPad Mini

使用Mac開發前端有很多優勢,對于我來講,最大的優勢就在于我還是一個Linux用戶,很多的Linux習慣在Windows下面總是會有一些不適應,再者,OS X的系統穩定性以及各種各樣優秀的App,也讓它一直都成為我的工作利器。

我沒有像很多牛逼的大神們購買多塊屏幕,我只有一臺iPad Mini,然后還有一個叫作 Duet 的App,它可以讓我把 iPad 作為我的 Mac 的第二塊屏幕,一般不需要,但是它真的能提高我的工作效率,而且可以直接使用到 iPad 的觸摸屏,這對于移動開發來講,很好。

我還有一臺 Lenovo 的 Yoga 3,裝了 Ubuntu,不過很少用,顯示有點兒別扭,但是,比起其它的PC機,這臺還是很不錯了,大家也可以試試。

開發工具

以前是Notepad++ 的忠實用戶,然后還有 Coda、TextMate、BBEdit、SublimeText 等等的,現在用的(而且可能以后會一直使用的)——WebStorm。

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!