使用 Vaadin 在云中开发全堆栈 Java 应用程序（1）

look_w

作为 Java 开发人员，您无需了解 HTML5、CSS 或 JavaScript 就可以开始创建交互式 Web 应用程序。借助 Vaadin                    框架及其丰富的现成增件（add-on）和组件库，您可以通过使用熟悉的 IDE 和服务器端技术创建 100% 的全堆栈 Java 应用程序。我的                    developerWorks 文章 “ ” 解释了 Vaadin 的幕后工作原理，帮助您开始使用 Vaadin 创建 Web                    应用程序。
Vaadin 应用程序在 Bluemix 中表现良好，提供了   样板。部署在 Bluemix 上的 Vaadin 应用程序可以享受行业标准 Liberty Profile                        应用程序服务器运行时支持，以及针对关系数据存储的 IBM DB2。Bluemix 上的所有 Vaadin 应用程序都可以充分利用各种丰富的、种类不断增长的服务器端服务。
在本教程中，我将引导您逐步为一个简单的 order desk（指令台）构建一个完整 Vaadin Web 应用程序。您将通过使用 Vaadin Contexts and                            Dependency Injection (CDI) 以及 Java Persistence API (JPA)                            构造应用程序与组件，以便访问一个后端数据库。您会在熟悉的 Eclipse IDE 中进行编码，并将生成的应用程序部署到 Bluemix。
加入  ，参赛时间为                                2015 年 10 月 1 日至 11 月 30 日。您可以炫耀从本教程及其配套教程中获得的技术， " "，构建出色的应用程序并赢得奖品。

您将学习如何：

• 通过在 Bluemix 上使用 Vaadin Rich Web Starter 样板开始您的 Vaadin 应用程序创建
• 扩展一个 Vaadin CDI 应用程序，以便添加访问控制权
• 使用来自您的 Web 应用程序中的 Vaadin                                      目录中的两个第三方附加 UI 组件
• 将一个登录页面添加到该应用程序，并对客户数据库进行身份验证。
• 向应用程序添加一个订单搜索视图

“Bluemix 上的所有 Vaadin 应用程序都可以充分利用各种丰富的、种类不断增长的服务器端服务。 ”

前提条件前提条件：

• 一个   帐户
•   3.3 或更高版本
•   2.5.2 或更高版本
•   6.12.3 或更高版本

如果您想修改或研究该代码：

• Java Development Kit (JDK) 1.7 或更高版本（此代码开发中使用了 1.7.0_60-b19）
• （Luna 或更高版本）
• Vaadin Plugin for Eclipse（来自 Eclipse Marketplace）
• WebSphere Application Server Liberty Profile Web Profile v8.5.5.5 或更高版本（来自                                            Eclipse Marketplace，或者  ）
•   数据库（来自发行版的 derby.jar）10.11.1.1. 或更高版本

第 1 步.                                                        探索应用程序的 UI单击运行应用程序按钮（此步骤的前面）并尝试创建 order-desk 应用程序：

• 如果单击左边的任何菜单项（除了 About），您会看到登录页面。About 页面用于将数据加载到 Customer                                                            数据库，这是实现登录要执行的必要操作。单击 Fill test data into DB 按钮。
• 在登录页面上，使用用户名 brian@robinson.com 和密码 abc123 进行登录：
  
• 检查 Analyze 视图中的动画图表：
  
• 浏览 Customer List 视图中的客户，查看 Map 视图中的客户位置：
• 使用 Search 视图搜索一个订单：
  
• 缩小浏览器页面宽度，查看应用程序如何作出相应的调整。
• 再次选择 Login-Logout 视图来退出登录，这意味着您不能再导航到其他任何视图。