云应用开发快速入门

什么是云应用

云应用是针对移动终端的使用情景,将传统的本地应用和互联网应用的优点相结合,推出的下一代移动终端应用解决方案。

云应用框架分为移动终端和云端两部分。移动终端部分依托于云应用引擎,使用HTML5、CSS3和JavaScript开发,并且可以直接调用移动终端的各种特性接口;云端部分依托于云计算平台,使用PHP、Node.js等Web技术开发,用于提供各种云服务。

通过这个方案创建的云应用,拥有和本地应用一样流畅的用户体验,并可以便利地使用各种云服务为用户提供更强大的功能。云应用的出现让开发者摆脱了传统应用开发的桎梏,把智慧和精力都专注在解决用户需求上,快速地丰富移动互联网。

图1 云应用在线IDE

成为云应用开发者

首先需要拥有云账号,并申请云应用开发者的邀请码。使用邀请码激活开发者身份之后,就可以在线创建云应用了。遇到问题时,可以参考阿里云论坛里的“如何:成为云应用开发者?附云帐号、邀请码、激活邮件FAQ”这篇帖子,网址为http://bbs.aliyun.com/read.php?tid=16997

SDK和IDE

为了帮助开发者快速开发出云应用,我们提供了SDK,帮助开发者快速搭建本地开发环境,并使用模拟器进行调试。同时,还提供了在线IDE,它集成了SDK,支持在线开发、在线调试,并内嵌了Git服务(如图1所示),使开发者可以基于浏览器在一个界面上同时编辑移动终端和云端的代码。如果大家对IDE有疑问,可以访问页面http://bbs.aliyun.com/read.php?tid=14303,上面有详细解释。

图2 云应用的文件结构

创建云应用

在线IDE能自动创建好基本的云应用文件结构(如图2所示),顶级的两个目录分别对应移动终端和云端的代码,它们存储在一起,但部署时会自动分发到相应的地方。

图3 云应用打包以后的文件结构

云应用的移动终端部分是典型的单页面应用结构,开发时每个页面都对应独立的模板和页面类,发布时会自动进行编译合并,并自动生成index.html,其文件结构如图3所示。

新增一个页面

新增一个模板文件 runrungo/src/tpl/welcome.xml:

新增一个页面类runrungo/src/classes/runrungo/page/HomePage.js:

配置页面类 runrungo/src/lib/runrungo.lib.js:

配置云应用入口类runrungo/src/classes/runrungo/Apprunrungo.js:

修改页面样式 runrungo/res/css/runrungo.css:

跳转到这个页面:

引入第三方类库

在云应用中,可以很方便地引入第三方类库。以jQuery为例,首先要在根目录下创建一个子目录,命名为lib,并将jquery-1.7.1.min.js上传到这个目录。然后配置app.json文件,根据实际需要调整加载顺序:

调用云端接

每个云应用都标配了一个ACE空间,可用来开发云端服务接口。作为示例,我们用Node.js版本的ACE创建数据接口(index.js):

接下来,在云应用中调用这个接口,并且将数据显示出来:

调用移动终端接口

云应用集成了各种移动终端接口,完整列表请查看文档developer.aliyun.com/docs。下面的代码段可以说明如何启动浏览器并加载指定页面:

查看开发中的云应用

云应用不需要下载和安装,在云市场中直接点击就可以运行(如图4所示)。如果登录了云账号,还可以看到正在开发中的云应用。一旦云应用申请发布,并通过审核,所有移动终端用户都可以在云市场中看到这个应用的最新版本。

图4 无需安装,快速启动一个云应用

作者鄢学鵾,阿里云无线运营UED负责人。对Web标准、前端开发模式、性能优化和自动化有较深入的研究, 目前专注于从Mobile到PC领域的设计、 技术和业务间的结合

应用开发 Google App Engine & Google Web Toolkit入门指南 侯炯 目录 第1章 应该了解下 1.1基本知识 1.2Google App engine 1.3Google Web Toolkit 第2章 环境搭建 2.1安装JDK 2.2安装Eclipse 2.3安装SDK和Eclipse插件 第3章 Hello World! 3.1 创建项目 3.2 目录结构说明 3.3 修改文件 3.4 运行调试 第4章 华丽的控件 4.1 显示文本——Lable,HTML 4.2 方形选择框——CheckBox 4.3 圆形选择框——RadioButton 4.4 按钮——Button 4.5 自定义按钮——PushButton,ToggleButton 4.6 文件上传——FileUpload 4.7 时间选择器——DatePicker 4.8 列表控件——ListBox 4.9 联想输入框——Suggest Box 4.10 树结构——Tree 4.11 菜单条——MenuBar 4.12 栈板——StackPanel 4.13 基本输入框的——TextBox,PasswordTextBox,TextArea 4.14 弹出框框——RichTextArea 4.15 弹出对话框——DialogBox 4.16 修饰面板——DecoratorPanel 4.17 自然布局面板——FlowPanel 4.18 水平布面板——HorizontalPanel 4.19 垂直布局面板——VerticalPanel 4.20 绝对定位面板——AbsolutePanel 4.21 停靠面板——DockPanel 4.22 展开面板——DisclosurePanel 4.23 标签面板——TablePanel 4.24 水平拆分面板——HorizontalSplitPanel 4.25 垂直拆分面板——VerticalSplitPanel 4.26 网格——Grid 4.27 灵活表格——FlexTable 第5章 装饰控件 5.1 控件的主题 5.2 通过CSS装饰控件 5.3 通过代码修改控件 5.4 实例——火车时刻表 第6章 通信机制 6.1 RPC机制 6.1.1什么是RPC 6.1.2接口函数实现 6.1.3可序列化 6.1.4 注册服务 6.1.5 使用服务 6.1.6 实例——股票价格表RPC版本 6.2 Servlet机制 6.2.1 Servlet介绍 6.2.2 实例——Servlet版本HelloWorld 第7章 数据操作 7.1 概述 7.2 定义数据类 7.3 创建,获取和删除数据 7.4 查询和索引 7.5 事务 7.6 关系 7.7 实例——员工管理系统 第8章 国际化 8.1 普通文本国际化 8.2 参数文本国际化 8.3 实例 第9章 应用托管 9.1 申请Google App Engine账号 9.2 上传应用 9.3 应用维护指南 第10章 实战 10.1 入门例子——股票系统 10.1.1创建项目 10.1.2设计应用 10.1.3建立用户界面 10.1.4创建控件和面板 10.1.5事件处理 10.1.6实现客户端功能 10.1.7添加应用样式 10.1.8国际化 10.1.9服务器交互 10.1.10让App Engine托管应用 10.2 中级例子——个人网站 10.2.1样子与功能 10.2.2创建项目 10.2.3定义数据结构 10.2.4规定通讯协议 10.2.5实现数据交互和发送邮件功能 10.2.6注册提供服务 10.2.7总体界面设计 10.2.8首页界面实现 10.2.9日志界面实现 10.2.10关于我界面实现 10.2.11留言界面实现 10.2.12管理界面实现 10.2.13统筹界面和连接功能 10.2.14国际化 10.2.15欢迎界面和样式文件修改 10.2.16总结 10.3 高级例子——号码管家(GAE+GWT+Android) 10.3.1样子与功能 10.3.2创建项目 10.3.4规定通讯协议 10.3.5实现服务端的功能 10.3.6注册提供服务 10.3.7帮助界面设计 10.3.8服务条款界面设计 10.3.9编辑界面设计 10.3.10登陆界面设计 10.3.11列表界面设计 10.3.12统筹界面和连接功能 10.3.13国际化 10.3.14欢迎界面和样式文件修改 10.3.15手机端界面与功能实现 10.3.16总结
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值