GWTの勉強 #1

Google Web Toolkit - Overview

 

まずはGWTのトップページを見て、概要を理解してみる。ドキュメントがそろっていると、やってみようって気になるよね。

 

ふむふむ。

 

GWTは、複雑なWebアプリを開発するためのものです。ブラウザに関する知識が無くてもハイパフォーマンスなWebアプリをつくれることがゴールです。(今は亡き)WaveやAdWordsでも使われています。

 

GWTのツールボックスには、次の四つが含まれています。

SDK ... JavaAPIコンパイラ、開発用サーバが含まれる。JavaのプログラムをJavaScriptとしてデプロイできる

・SpeedTracer ... Webアプリのパフォーマンスを測定するためのChromeのエクステンション

・Plugin for Eclipse ... GWTのプログラムを開発するためのEclipseのプラグイン(これは、GAEのプラグインと一緒なので知っていた)

GWT Designer ... GWTの画面をグラフィカルにデザインするためのGUIツール

 

GWTの開発は、コード作成→デバッグオプティマイズ→実行の四つのフェーズがあり、それぞれGWTが対応している。

 

よくある導入だけど、改めて読むと期待できそう。

 

GWTの勉強 #2

Get Started with the GWT SDK

 

JavaとAntがいるらしい。Javaは1.6が入っているのでおけ。Antは入ってないからインストールしないといかんな。Antのマニュアルによれば、特にMac OS X用のインストール方法はないので、ダウンロードしたバイナリを展開して、ANT_HOMEとJAVA_HOMEを設定しておくか。

 

次はGWTのダウンロードとインストール。どうやらEclipseを使うか使わないかで方法が違うみたい。ここではEclipseを使いたいので使う方で進めてみる。どうやら、EclipseのプラグインをインストールするとSDKも入るようだ。ついでにGAEもインストールしておく。ダウンロードも含めて10分くらいかかった。

 

SpeedTracerもインストールする。これはChromeのWebストアからインストールできた。ほぼ一瞬でインストール完了。

 

GWT Designerもインストール。これはEclipseのプラグインなんだけど、現在のところEclipse 3.7までしか対応していない様子。古いEclipseで開発してて良かった。何事も無くインストール完了。

 

最後にGWT SDKのダウンロードがあるけど、ちっちゃい時でこんな風に書いてあったので、ダウンロードはしない

Note - This download contains the standalone GWT SDK and tools only. If you're using Eclipse, we suggest that you download and install the Google Plugin for Eclipse instead.

ちなみに、Eclipseのプラグインを導入すると、SDKは以下のディレクトリに展開されていた。

$eclipse_home/plugins/com.google.gwt.eclipse.sdkbundle_2.5.1

GWTの勉強 #3

とりあえずスタンドアロンモードでWebアプリを動かしてみる。

 

GoogleサイトだとSDKディレクトリの中にプロジェクト用の作業ディレクトリをつくる流れだけど、流石になんなのでPATHを切って自分のホームディレクトリで作業をすることにする。

 

$ export PATH=$PATH:/Applications/eclipse/plugins/com.google.gwt.eclipse.sdkbundle_2.5.1/gwt-2.5.1/

 

ここでトラブル。開発モードでGWTアプリを動かすには、ブラウザにプラグインを入れてくれとメッセージが出てきた。GWTの公式サイトにはすごい小さい字でかかれているけど、必要みたいのでインストールしてみる。ブラウザ毎に異なるみたいだけど、ChromeだとWebストアでインストールするみたい。

Since this is your first time hitting the development mode server, it will prompt you to install the Google Web Toolkit Developer Plugin. Follow the instructions in the browser to install the plugin, which may require restarting the browser.

 

ブラウザをリスタートしてコピーしたURLを読み込むとなにやら名前を入力する画面が表示された。

うまく動いたみたい。

 

プログラムが出来上がったら

$ ant build

J2EE用のwebアプリケーションが出来上がる。さらに

$ ant war

J2EE用のWebアプリケーションサーバにデプロイできるwarファイルが出来上がる。

 

エクセレント!