Cordova webapp实战开发：（2）认识一下Cordova

昨天写了第一篇 《Cordova webapp实战开发：（1）为何选择 Cordova webapp？》，意料中看到你们对这个主题的兴趣，我新建的PhoneGap App开发 348192525   一会儿就快1百人了。原本心想过几天在写第二篇吧，但昨天已在文中说到，若是点赞超过20就开始写下一篇，我们要说到作到，那就开始第二篇吧。可是第二篇写点什么呢？我看到群中有人问 “ phonegap和cordova是什么关系？”，加入QQ群的时候，也看到一些人写着cordova初学者。正如我也说到，本系列的初衷是帮助你们从0开始作一个全栈型的Web app开发者，因此仍是一步一步慢慢来。对于有经验的老鸟们，大家能够选择调过已经知道的系列文章，或者回复补充。

如何封装一个浏览器成webapp？

在群里，有个朋友问了一个问题“如何封装一个浏览器成webapp？” 

每一个手机就像电脑同样，都带着本身的操做系统。若是你愿意，你能够从头写一个浏览器，把浏览地址隐藏了，这就像你的一个app了，对吧。固然，咱们本身写浏览器，这也太难了，因此咱们确定不是这么作的。其实，咱们只是基于各类手机上Web浏览器内核去作手脚，而Js是Web开发的最佳语言，至于如何封装成一个Web app？说实话，我也没有真正去探究过是如何去作的，由于我对Andorid和iOS原生开发也不熟悉，最主要是如今也没有时间去研究这些了，可是我告诉你的是，经过一些移动开发框架，你只须要专一于写你的前端代码，而后经过一个开发框架的黑盒的操做，编译后就成了一个能够安装的App了。是否很神奇呢：）

不用管它有多神奇了，看看下面这张图，先从架构上整体了解到这个层次就好了。最上面是H5，中间是Web前端框架，以及移动开发框架的API。若是你须要调用手机原生的功能，例如摄像头、录音等，这些工做会由移动开发框架去作，你只须要了解这种框架是如何工做的便可。学会如何使用摄像头，就知道如何使用录音了，触类旁通。

移动开发框架

在准备使用Web App从新编写以前的原生APP前，工信部的人有点怀疑，由于你们都据说HTML5的移动应用太慢，体验太差，这万一作完不行怎么办？我解释了一下，发现没用，因此索性本身就动工了。我想告诉你们的是，只要你不是对性能要求特别高，例如画图之类的App，其实不少应用均可以使用HTML5来作的。昨天我还在一个材料计算器群里和群主说，可使用Web App方式来作，省得群里的人都在等着你的iOS版本出来。群主说他尝试过，可是每次计算要等好几秒，还给我举例说见过12306订火车票的App吗？

我想告诉你们的就是，这里存在不少偏见，由于之前手机性能差，H5也没有这么普及，因此体验很差、效率差强人意，可是如今HTML5愈来愈好，移动硬件性能也愈来愈强，不少应用都已悄然上演了混合式开发的方式。你看看支付宝、淘宝，其实手机App里面都有Web的影子，你发现了吗？

由于移动设备的普及，App也愈来愈多，早就了高价收购Andorid和iOS开发者的现象，而如今由于Web App的兴起，又造价了Web前端的高价，虽不是主要缘由，但确定是其中一个缘由，因此学习移动开发会提高你的身价，固然前提是你真的一我的能搞定。

之前咱们作桌面或Web应用同样，语言和框架都有不少能够选择，那作移动开发框架呢？依然咱们有不少选择，只是我真的很长时间或者没有太多时间专一学习每个，因此下面只能简单介绍一下了。

PhoneGap

PhoneGap是一款开源的手机应用开发平台，它仅仅只用HTML和JavaScript语言就能够制做出能在多个移动设备上运行的应用。 PhoneGap将移动设备自己提供的复杂的API进行了抽象和简化，提供了一系列丰富的API供开发者调用，只要你会HTML和Javascript或 者Java语言，就能够利用PhoneGap提供的API去调用各类功能，制做出在各类手机平台(iPhone，Android ，BlackBerry，Symbian，Palm，Window Phone)上运行的应用。目前phonegap得到Apple,IBM,NOKIA,palm等众多公司的支持。简单来讲使用PhoneGap就是使用HTML,JavaScript和CSS来开发程序，最终经过PhoneGap能够产生对应版本的native 程序。

IONIC

IONIC 是目前最有潜力的一款HTML5手机应用开发框架，它提供了不少UI组件来帮助开发者开发强大的应用。它使用JavaScript MVVM框架和 AngularJS来加强应用。提供数据的双向绑定，使用它成为Web和移动开发者的共同选择。即将发布的AngularJS 2.0将会专一于移动开发，相信IONIC必定会取得不错的成就 。

IONIC的开发团队将尽快开发出一种经过IONIC creator提供开发者快速建立IONIC应用的方式。咱们将很快就会看到一个支持拖拉功能的可视化开发工具，几分钟内开发一个app将再也不只是吹xx。

这里要说一AngularJS，这个框架我在前两年看过，我喜欢这种MVVM框架的东东，当时只是简单学习了一下，若是有时间我可能会把如今急于JQueryMobile和没有框架的Js改成急于IONIC来编写。

......

除了以上一个我实际作过，一个我想学的以外，还有不少Web App开发框架，国内如今网上也能收到好几个，不过我都没怎么用过，这里也就不作介绍了，总之这一小段就是告诉，开发框架有不少，基于我之前本身也作框架（OpenExpressApp）的经验，任何东西都不可能完美，因此咱们不要太苛求了，若是你喜欢这个框架，那就去学习，学习以后若是以为可行，那就找个小项目试试，若是试后以为不错，那就多花些功夫作好，仅此而已。 

你们看此系列blog就知道，我后续全部的博文都是围绕第一个来介绍，因此若是你对第一个不感兴趣，那么可能这个系列就不适合你了，固然，你之后也能够择取系列中一些单独篇章来学习你所须要的。

cordova与phonegap有什么关系？

phoengap

• 官方网址：http://phonegap.com

若是能了解一个框架的兴起仍是一件比较有趣的事。08年一次ios开发者大会上来自Nitobi软件公司的几个家伙突发奇想，提出一个想法，想作一个工具来弥补web和ios开发之间的不足，并提出 Bridging the gap between the web and the iPhone sdk。一开始的目标并非很大，可是作到了如今的written once,run everywhere。咱们不少人作事其实也应该这样，一开始不要把目标弄得那么大，跳一步可以上就好，敏捷我的的造成也是这样，一开始只是分享而已，随着分享越多才成为了一个帮助有成长意识的人去认识自我管理自个人成长体系。若是一会儿目标太大，你会由于难以实现而给本身找理由，这样到头来你什么都没有。

09年他们推出android adk和blackberry sdk，成了移动开发者的福音，就连ibm也加入进来。phonegap继续成长，在2011年10月，整个Nitobi团队被adobe收购，PhoneGap的项目主管Brian LeRoux指出开源PhoneGap的决定在Adobe收购Nitobi以前就作出了，因为Adobe如今拥有PhoneGap商标，他们不得不换个名字，第一个选中的名字是Callback，毫无创意，所以再改一次，产品如今叫Apache Cordova。随后adobe把 phonegap送给了apache软件基金会，接着apache把phonegap更名为cordova，cordova是Nitobi团队当时坐落的街道名称，用此名来记念Nitobi团队的贡献。

因此Apache Cordova是从PhoneGap中抽出的核心代码，是驱动PhoneGap的核心引擎，你看着两个官网风格多差很少。

Cordova

• 官方网址：http://cordova.apache.org/

 

咱们后续的全部文章和代码都是基于Cordova的，若是有谁知道Phonegap和Cordova的具体差别在哪里，能够回复补充一下。

谁在使用PhoneGap

诚实的说，上面的都是在官网看到放上去的，至于真的用的怎么样就不知道了。这样提及来感受我很不负责似的，因此在本系列第一盘中我就告诉了你们，我本身作的敏捷我的App和掌中广材App就是用Cordova作的，并且都已经在各大Andorid市场和iOS AppStore上架了。

 

支持平台

我相信不少人选择这种方式，而不是原生，很看重的一点就是跨平台，也就是一次代码，多个平台复用。没错，我如今主要在Andorid上开发，而后把www目录下的全部文件都拷贝到iOS目录下，而后就OK了。至于你说，wp系列的复用起来如何呢？很抱歉，我没有wp的手机，没有试过。之因此尚未试过，是由于这类客户群数量还比较少，因此咱们也没有投入精力去作这个部分，这不是技术问题，而是产品对技术的定位方面决定的。

可是，从官网咱们能够看到，它对平台的支持是很不错的，我也相信它们能作到iOS和Andorid复用，就能作到其余平台复用，由于从架构原理来看是同样的。

 

预习做业 

真是晕？居然还有预习做业，弄得我就像老师同样。呵呵，不过还真有不少人叫我周老师，多是由于我把敏捷我的的博客当作练习变成习惯了，因此在本篇结尾时，但愿你们在轻松读完本篇以后，作一下几个练习，遇到问题呢能够回复，这样我在写下一篇的时候呢就能够帮你解决问题了，这既锻炼你的学习能力，也可以更及时更好的解决你的问题。

1. 去官网下载Cordova框架（提醒，不是Phonegap）
2. 本身创建一个Andorid项目，并在手机上调试安装成功
3. 在iOS上也调试安装一下。（若是没有iOS环境，那就略过吧） 

 

PhoneGap App开发 477842664