级别： 初级 Yoav Rubin, 软件工程师, IBM
Gal Shachor, 高级技术人员, IBM
Brandon J.W. Smith, 软件工程师, IBM
2009 年 9 月 28 日 IBM WebSphere® sMash Developer Edition 1.1 (DE) 提供一个称为 App Builder 的基于 Web 的开发环境，用于开发 Web 应用程序。学习如何使用这个工具创建一个简单的在线 RSVP 应用程序，用于提供 Atom 提要。
简介
从头开始开发 Web 应用程序有时比较困难。开销（overhead）任务，如数据库设置和用户界面设计，需要不少的技巧集。为此，IBM 引入了带有 App Builder 的 Webshpere sMash DE，提供一套用于创建应用程序的工具，同时将许多单调的、有时甚至很困难的任务抽象化。这减少了您的脑力劳动，以便集中精力关注主要工作 — 一个可以正常运行和工作的 Web 应用程序。
RSVP 系统是我们经常需要使用的一个 Web 应用程序，它允许您邀请朋友参加一个活动并预先得知他们的意图和需要。本文将介绍如何创建这样一个应用程序并展示 App Builder 的好处。
场景
本文假设您的朋友的 50 岁生日即将来临，您想邀请一些朋友及其家人参加生日聚会。您是个大忙人，所以您想向所有受邀者发送一个简单的 RSVP 表单的链接，并在每个表单被提交时收到通知。
创建应用程序
从这个项目的 Web 站点（参见 参考资料）下载 IBM WebSphere sMash，然后按照该站点的指导将其正确安装在您的系统上。安装结束后，从命令提示发送以下命令启动 App Builder：
App Builder 将被打开，您将看到图 1 所示的屏幕：
图 1. 初始屏幕
（单击查看 图片细节）
首先通过单击 Create new application 链接（图 1 中圆圈位置）创建一个新应用程序。在新建应用程序对话框中，将应用程序命名为 Birthday RSVP 并单击 Create。结果类似图 2 中的屏幕截图。
图 2. 应用程序管理屏幕
（单击查看 图片细节）
现在单击带有应用程序名称的链接（图 2 中的圆圈位置）切换到应用程序编辑视图，如图 3 所示：
图 3. 应用程序编辑
（单击查看 图片细节）
创建数据模型
作为第一个组件，定义一个 Zero Resource Model (ZRM) — 这等同于一个关系数据库表，但在表上提供各种服务。特别是，ZRM 提供一个基本的 Atom 提要服务，本文稍后将用到该服务。
要创建这个数据模型，打开 New File 菜单（图 3 中红色圆圈位置），然后选择 Create a Zero Resource Model (not based on a form)。在弹出对话框中将这个模型文件命名为 invitation.json。App Builder 将打开模型编辑器，如图 4 所示。
图 4. 空的 ZRM 编辑器
（单击查看 图片细节）
在模型编辑器中单击选项菜单（图 4 中红色圆圈位置），将以下字段添加到模型：
- 字符串字段 — 用于受邀者的姓名
- Boolean 字段 — 标明受邀者是否携带配偶
- 字符串字段 — 用于添加各种注释
完成后，编辑器如图 5 所示。
图 5. 带有字段的 ZRM Editor
（单击查看 图片细节）
下面，通过单击属性图标（图 5 中的红色箭头标出）设置字段属性并设置每个字段的以下属性：
- 对于第一个字符串字段，将其名称设置为 name，标签设置为 Enter your name，选中 Required 复选框。
- 对于 Boolean 字段，将其名称设置为 withSpouse，标签设置为 Arriving with spouse。
- 对于第二个字符串字段，将其名称设置为 comments，标签设置为 Additional comments。
现在模型完成了。ZRM 框架将自动创建一个支持数据库来存储这个模型定义的数据实例。ZRM 将默认使用 Derby 数据库，除非您配置为使用其他支持的数据库。本文将接受默认值 Derby 数据库。
通过切换到 Console 选项卡（图 3 中的黄色圆圈位置）并在命令提示中输入以下命令为这个资源创建数据库表格：
您将看到一条控制台消息，确认 Derby 数据库已经创建。
最后，为这个模型创建 HTTP 资源处理器。在 New File 菜单中，选择 Create a Resource Handler。将其命名为 invitation.groovy 并将它的内容设置为 ZRM.delegate()。 您已经成功创建了数据模型。
创建表单
邀请表单是刚创建的数据模型的用户界面。因此，您可以基于该模型创建一个表单并将它配置为在一个特定事件发生时出现。
首先在 New File 菜单中选择 “create a Zero resource form based on a model”。将它命名为 rsvp.json 并将它的模型设置为 invitation.json，如图 6 所示。
图 6. 基于模型的新表单
（单击查看 图片细节）
这将打开表单编辑器。在表单编辑器中，将表单标题设置为 Welcome to the party，说明设置为 Please fill up this
RSVP form。这个编辑器应该类似于图 7。
图 7. 表单编辑器
（单击查看 图片细节）
这个数据输入表单的创建过程到此结束。 创建邀请页面
现在您将创建一个 Web 页面来持有一个表单，受邀者将使用该表单来输入必要的信息。
首先在 New File 菜单中选择 Create an HTML file，将文件命名为 invitation.html。
下面，添加一个 ZRM 表单元素，它可以在编辑窗口右侧的选项菜单中的 Zero 部分找到。通过右键单击表单属性进行编辑，在弹出菜单中选择 Properties。在 Relative URI to form model file: 字段中输入 ./zero/forms/rsvp.json。结果如图 8 所示。
图 8. HTML 页面编辑器
（单击查看 图片细节）
这个数据输入 Web 页面的创建至此结束。 运行这个应用程序
剩下的工作就是运行这个应用程序，只需单击 Start（图 3 中的红色圆圈位置）即可。最后，将以下链接发送给所有受邀者：http://[your-server]:8080/invitation.html，
打开这个链接，将看到图 9 所示的页面。
图 9. 用户看到的表单
（单击查看 图片细节）
接收 Atom 提要
为了在每个 RSVP 表单提交时收到通知，将以下 URL 添加到您喜爱的提要阅读器中：http://[your-server]:8080/resources/invitation?format_as=atom。表单提交时，您将看到通知。
结束语
IBM WebSphere sMash 和基于 Web 的 App Builder 是一对强大的工具，它们使具有编程技巧的用户能够根据需要创建 Web 应用程序，并且只需要满足最基本的数据库和表单设计要求。本文只是这个功能的简单介绍。花点时间进行实践，您将看到这两个工具如何开始实现很早以前就作出承诺的零编程程序创建愿景。
参考资料 学习
获得产品和技术
作者简介  | | | Yoav Rubin 拥有以色列特克尼奥恩技术学院计算机科学系信息系统工程专业的学士学位。在过去 8 年的时间里，他一直在 IBM Haifa Research Lab 担任软件工程师，主要从事可视化应用程序开发工具和复杂事件处理领域。他的主要兴趣有 Java 和 Web 2.0 技术、终端用户开发和可用性。
|
| | | Gal Shachor 是一名在 IBM Haifa Research Lab 工作的 IBM 高级技术人员和研究人员，并从事各种与中间件和富 Internet 应用程序相关的主题。Gal 是 JSP Tag Libraries 一书和多篇技术文章的作者。 |
| | | Brandon J. Smith 拥有卡内基梅隆大学的硕士学位。他的兴趣点是 REST 数据服务、Web 范围数据库和云计算。 |
对本文的评价
| 
