仅用移动开发服务：开发native应用

浏览数：29 / 时间：2015年06月11日

不花一分钱，就可以做native应用开发，这在以前是根本不敢想象的事儿。然而在今天，移动开发工具和服务已经五花八门，聪明的开发者只要随心所欲的抓取几个顺手的，就能完成native开发。今天给大家介绍的思路其实很简单：

1. 使用Nitrous.IO云端编程环境，开启Node.JS的box模块。
2. 然后使用Github账号连接上Node.JS box。
3. 内容部分，可以使用Ionic框架和Web代码，快速开发出我们需要的界面。
4. 使用PhoneGap编译出native的Android app。
5. 最后还可以使用Firebase连接上你的app，作为后端服务。

Nitrous.IO

Nitrous.IO 提供一个在线的集成开发环境，Nitrous.IO把编程环境完全移植到云端平台，开发者只要网络连接进Nitrous.IO，就可以不用在本地搭建的开发环境下进行编程，解决了在多种语言编程下，编程环境冲突问题。截至目前，Nitrous.IO支持Ruby、Node.js、Python和Go这四种编程环境。

此外，Nitrous.IO为开发者提供一个包括拥有384MB内存和750MB运行在云服务平台上的“沙盒”开发环境（Box）。开发者可以为不同的编程语言，创建不同的Box，不同的Box之间互不影响，并且每个Box还可以独立启动运行和停止。

一旦你在Nitrous.IO中创建了Node.JS box你就可以使用在线的编程环境了。为了更方便的进行版本管理，可以连接到你的Github账户，这里需要你添加一个Public SSH key，这样Nitrous.IO和你的Github账户高就挂起来了。你需要在GitHub上创建一个新的项目，把源的地址挂到Nitrous.IO中。

相关链接：Nitrous.IO官网、Nitrous.IO在Mobilehub主页

Ionic

使用native代码开发出来的应用，常被冠以运行速度更快，更加流畅，用户体验更好等高帽子。但是倔强的Web设计师和开发人员，总是想找到这么一种途径来使用Web代码。他们认为Web开发更加简单方便。（虽然也要面对各种JS的虐心）这个名为Ionic的前端框架，又是玩跨界的。它可以在构建 native应用中，使用HTML5、CSS3和JavaScript。欢迎大家踊跃尝试，并分享试用心得给我们。

Ionic并不是一个可以完全替代PhoneGap的方案，也不是一个真正的JavaScrip框架，它的重点是在于UI交互设计。这个框架附带了SASS，并且可选各种AngularJS扩展，有许多部件可以调用，如按钮、切换、页眉页脚、标签栏等等。并且最令人印象深刻的是，Ionic团队制作了一套很棒的教程和示例。

在这里，我们要实现一个很简单的to-do-list的应用，记录我们每日都作了那些工作。

相关链接：Ionic官方网站、Ionic的Mobilehub主页

PhoneGap

PhoneGap是一款开源的免费移动应用开发框架，能够让开发者使用HTML、JavaScript、CSS等Web技术来开发跨平台移动App，支持iOS、 Android、BlackBerry、webOS、Windows Phone、Symbian以及bada系统平台。在使用PhoneGap之前，你可能需要一个AdobeID，或者使用Github账号注册。

登陆之后建立一个新的应用程序，选择刚才在Github上建立的repo，一旦添加好这些，就可以选择Build App了。

把刚刚编译好的APK包，装在Android手机上，界面都可以点击，但也许你发现它还不能对数据库进行读写。前端的皮我们已经画好，下面我们需要强大的后端服务支持。

相关链接：PhoneGap官方网站、PhoneGap在Mobilehub主页

Firebase

Firebase是一家位于旧金山的后端服务提供商，公司于去年启动了其JavaScript API和云服务，主要为Web App开发者提供后端数据的实时处理服务。使用Firebase的开发者无需担心数据存储问题，无需架设自己的服务器，就可以让自己的App实时更新数据，App用户也无需刷新页面获取新数据。据悉，Firebase启动一周后已拥有超过4000名开发者注册。无论是Android还是iOS开发者，都可以使用Firebase开发本地应用。

上文已经提到，Ionic可以轻松调用各种AngularJS扩展，在这里我们可以使用AngularFire来让App与Firebase连接。挂接很简单，只需要在index.html文件的<head>部分中加入调用script即可。当然许多核心的代码还少不了需要进一步修改和完善。

<p><!-- Firebase and AngularFire Extensions --></p><p><script src=‘https://cdn.firebase.com/v0/firebase.js‘></script>
<span style="font-size: 14px; line-height: 24px;">
<script src="https://cdn.firebase.com/libs/angularfire/0.5.0-rc1/angularfire.js"></script></span></p>

之后需要进行一些测试，你能在Firebase后台预览这些时实的数据。