教程:概述

这些教程面向希望使用 GWT 编写丰富的 AJAX 应用程序的开发者。你可能是希望能够应用面向对象编程的软件工程原理并在编写 Web 应用程序时利用 Java IDE 中的工具的 Java 开发者。或者你可能是对 GWT 生成高度优化的 JavaScript 的能力感到好奇的 JavaScript 大师。

尽管假设你了解 HTML、CSS 和 Java,但运行这些教程并不需要了解这些知识。

这些教程基于两个示例应用程序的开发,这样用户就可以在每个步骤中学习不同的 GWT 概念。

  • StockWatcher 是一个用于监控股票变化的应用程序,你可以从 github 获取源代码
  • TodoList 是一个 Web 应用程序,用于在浏览器中创建和维护待办事项清单。源代码同样可在 github 获取。

开始之前

在开始学习这些教程之前,我们假设你已经完成了以下操作

  1. 安装了 Java SDK。
  2. 安装了 Eclipse 或你喜欢的 Java IDE。
    • 在这些教程中,我们使用 Eclipse,因为它开源。但是,GWT 并不限定你使用 Eclipse。你可以使用 IntelliJNetBeans 或你喜欢的任何 Java IDE。如果你使用的是 Eclipse 以外的 Java IDE,教程中的截图和一些具体说明会有所不同,但基本的 GWT 概念是一样的。
    • 如果你的 Java IDE 不包含 Apache Ant 支持,你可以下载并解压缩 Ant 来轻松编译和运行 GWT 应用程序。
  3. 安装了适用于 Eclipse 的 Google 插件。
    • 适用于 Eclipse 的 Google 插件 为 Eclipse 添加了用于创建和开发 GWT 应用程序的功能。
  4. 下载了 GWT。
    • 可以使用适用于 Eclipse 的 Google 插件下载 GWT。或者,为你的操作系统下载最新的 GWT 发行版。
  5. 将 GWT 发行版解压缩到你想运行它的目录中。
    • GWT 没有安装程序。运行和使用 GWT 所需的所有文件都位于解压缩的目录中。

你也可以选择执行以下操作

  1. 安装 Google App Engine SDK。

    • Google App Engine 允许你在 Google 基础设施上运行 Java Web 应用程序,包括 GWT 应用程序。可以使用适用于 Eclipse 的 Google 插件下载 App Engine SDK。或者,单独下载适用于 Java 的 App Engine SDK
  2. 创建并运行你的第一个 Web 应用程序 - 几个简单的步骤,让你熟悉命令行命令。

GWT 教程

构建示例 GWT 应用程序

  1. 构建示例 GWT 应用程序
  • 从头开始开发 StockWatcher 应用程序,开始学习 GWT。你将学习创建 GWT 项目,使用 GWT 小部件和面板构建 UI,用 Java 语言编写客户端功能,在开发模式下调试,应用 CSS 样式,将 Java 编译成 JavaScript,并在生产模式下运行应用程序。

客户端服务器通信

  1. 通过 GWT RPC 与服务器通信
    • 添加使用 GWT RPC 的服务器调用。你将学习如何进行异步调用、序列化 Java 对象和处理异常。
  2. 通过 HTTP 检索 JSON 数据
    • 发出 HTTP 请求以从服务器检索 JSON 数据。相同的技术可以用于检索 XML 数据。
  3. 发出跨站点请求
    • 调用远程服务器,绕过 SOP(同源策略)限制。

国际化

  1. 国际化 GWT 应用程序
    • 使用静态字符串国际化将 GWT 应用程序的用户界面翻译成另一种语言。

JUnit 测试

  1. 使用 JUnit 进行单元测试
    • 使用 JUnit 为 GWT 应用程序添加单元测试。

部署到 Google App Engine

  1. 部署到 Google App Engine

使用 GWT & Polymer 构建现代应用程序

使用 Polymer 元素 和 JsInterop 为移动设备和桌面编写响应式 GWT 应用程序。

  1. 创建 GWT 应用程序。
    • 从头开始学习创建新的 Maven 项目、在超级开发模式下运行和调试它们以及包含外部依赖项。
  2. 设计 UI
    • 学习如何在 UiBinder 中使用经典的 小部件 构建 UI
    • 或者学习如何在 UiBinder 中使用 元素,这是现代 GWT 应用程序的趋势。
  3. 编写应用程序逻辑
    • 使用 @UiHandler 注释将事件处理程序添加到 小部件 中。
    • 或者在基于 元素 的 UI 中监听 DOM 事件。