讲个故事吧 为什么? 设想一下,如果你希望开发一个程序,这个程序需要在pc,mac,android,ios甚至是你能见过的所有能上网的设备上运行,你会选择什么样的语言/技术栈来开发?
几乎不用思考,你就知道答案了: 我们把他写成一个网页吧!
在现在这个美好的时代,你能见到的几乎所有桌上设备移动设备甚至是手表机顶盒都提供了浏览器功能,我们连代码都不需要调整就能在他们上面运行。
然后呢? 我们开发的这个web站点运行起来非常稳定,你忍不住为他添加了很多很多功能,他看起来越来越庞大臃肿了。
终于有一天,你遇到了问题:
用户A希望你能在程序里增加摄像拍照功能 用户B抱怨应用在他的小霸王上太卡了 用户C说你的程序引用的资源太多了,他一晚上跑掉了2G流量 用户D希望能接入第三方APP支付 等等如此的需求让你意识到,单凭浏览器提供的那些东西已经无法支撑你的业务发展,是时候做出改变了。
I have a WebSite, I have a Native. hmmmm! Hybird! 架构示意图
cordova cordova是一个填充平台差异的标准,是一个跨平台实现的规范。
cordova 并不会把你的前端页面变成 ios 原生的 objective-c 或者 android 的 java 代码,你的界面还是网页呈现的,渲染在 android 的 android.webkit.WebView 或 iOS 的 UIWebView 中。
cordova 不是一个壳,他更像是胶水,因为他不像框架一样团团包住你写的那部分内容,而是在运行在 WebView 中的 javascript 代码和原生代码之间建了一座沟通的桥梁。
plugin 官方文档 https://cordova.apache.org/docs/en/latest/
插件是整个cordova生态系统的重要组成部分,是他们提供了面向原生组件和设备API的接口。通过插件你可以从Javascript中调用原生代码。
Apache Cordova项目提供了一系列的核心插件,这些插件提供了最基础的访问硬件设备如电池、摄像机、电话簿等功能。
除了来自于官方的核心插件之外,还有更多的来自于第三方的插件,你可以通过官方的插件搜索或者直接使用npm找到他们。
你也可以开发自己的插件,这里有插件开发手册。
ionic Ionic是一个强大的混合式/hybrid HTML5移动开发框架,可以使用HTML5构建混合移动应用的用户界面框架,它自称为是“本地与HTML5的结合”。
官方文档 http://ionicframework.com/docs/v1/
Ionic框架的目的是使用WEB技术开发手机应用,使用Cordova构建成各个平台的应用程序实现Write once, run anywhere.
ionic 为你构建了基于 cordova, angular 开发混合应用的workflow。
ionic 提供了大量的组件、模块与规范。
ionic 帮你polyfill了大量细枝末节的问题。
ionic 让你专注于业务。
ionic is awesome!
ionic包含了cordova插件、Angular指令、CSS框架和一个功能强大的CLI命令行工具。
CSS框架 提供了一个接近原生App质感的CSS样式库,你可以在这里找到大部分样式组件示例。
Javascript ionic引入了angular, 并提供了一系列的指令,封装了移动端常见组件与服务。
具体列表请参考这里:http://ionicframework.com/docs/v1/api/
CLI Gulp gulp是一个自动化构建工具。
官方文档 https://github.com/gulpjs/gulp/blob/master/docs/API.md
在移动端项目的开发中,我们会遇到诸如移动端适配、各平台polyfill、预处理器语言的使用规范和编译、各种繁琐的工作(压缩、合并、内联、雪碧图、CSS前缀……)等问题,在一遍又一遍的重复劳动中,我们不得不寻求自动化解决方案即一个能够结合最佳实践的构建工具, gulp 为此而生。
gulp是基于Nodejs的自动任务运行器, 它能自动化地完成 javascript、coffee、sass、less、html/image、css 等文件的测试、检查、合并、压缩、格式化、浏览器自动刷新、部署文件生成,并监听文件在改动后重复指定的这些步骤。在实现上,她借鉴了Unix操作系统的管道(pipe)思想,前一级的输出,直接变成后一级的输入,使得在操作上非常简单。通过本文,我们将学习如何使用Gulp来改变开发流程,从而使开发更加快速高效。
通过配置gulp构建流,我们可以把大量重复的工作自动化,让我们从重复劳动中解脱出来,大大的提高工作效率。
lodash Lodash 是一个具有一致接口、模块化、高性能等特性的 JavaScript 工具库。
官方文档 https://lodash.com/docs/3.10.1
有多年开发经验的工程师,往往都会有自己的一套工具库,称为 utils、helpers 等等,这套库一方面是自己的技术积累,另一方面也是对某项技术的扩展,领先于技术规范的制定和实现。
Lodash 就是这样的一套工具库,它内部封装了诸多对字符串、数组、对象等常见数据类型的处理函数,其中部分是目前 ECMAScript 尚未制定的规范,但同时被业界所认可的辅助函数。目前每天使用 npm 安装 Lodash 的数量在百万级以上,这在一定程度上证明了其代码的健壮性,值得我们在项目中一试。
参考资料 https://segmentfault.com/q/1010000004526369/a-1020000004526852
http://www.cnblogs.com/fengyuqing/p/5332112.html
http://www.jianshu.com/p/596ba1165510
http://www.jianshu.com/p/7436e40ac5d1
http://www.aliyue.net/317.html
