« Eclipse3.6(Helios)用のVisualEditor1.5.0リリース | トップページ | GWTで作成したWebアプリケーションをtomcat上で動かす方法 »

GWTのサンプルプログラムをEclipseで参照・編集・実行できるようにする方法

GWT(GoogleWebToolkit)のサンプルプログラムをEclipseのプロジェクトに取り込んで、サンプルソースの参照・編集や実行をできるようにする手順をまとめました。

まず開発環境の整備

1.Eclipseのインストールと日本語化の手順はこちら

※インストール先はC:\直下などに入れたほうがいいです。マイドキュメントの下などに入れるとGWTプラグインのパスが長くなってしまい、フォルダの移動や削除時に「ファイル名または拡張子が長すぎます」というエラーがでてしまいます。

2.GWTプラグインは以下の手順でインストール

  • Googleのトップページから[もっと見る]→[さらにもっと]→[Code]→[Google Web Toolkit]とたどり[ダウンロード Google Web Toolkit]ボタンをクリックする。
  • [Download Plugin & SDKs]をクリックするとEclipseのバージョン別にUpdateSiteのURLが記載されているのでこれを控える。(たとえばEclipse3.6の場合はhttp://dl.google.com/eclipse/plugin/3.6)
  • Eclipseを起動し、メニューから[ヘルプ]→[新規ソフトウェアのインストール...]→とたどり前項で控えたUpdateSiteのURLを作業対象のところに入力してEnterキーを押します。
  • 画面に[プラグイン]と[SDK]というチェックボックスが表示されるので、両方ともチェックして[次へ]ボタンをクリックします。
  • さらに[次へ]ボタンをクリックしていき、[使用条件の条項に同意します]を選択し[完了]ボタンをクリックします。
  • 署名なしコンテンツのインストール確認については[OK]を選択。
  • 最後にEclipseを再起動するか問い合わせがありますので再起動します。

次にサンプルのダウンロード

  • Googleのトップページから[もっと見る]→[さらにもっと]→[Code]→[Google Web Toolkit]とたどり[ダウンロード Google Web Toolkit]ボタンをクリックする。
  • [Download GWT SDK]をクリックしてアーカイブをダウンロードする。

プロジェクトの作成とサンプルの取り込み(サンプルShowcaseの例)

  • ツールバーからGwtnew [新規Webアプリケーション・プロジェクト]ボタンをクリックする。※Windowsセキュリティの確認ダイアログがでたら[ブロックを解除する]を選択。
  • プロジェクト名に"Showcase"、パッケージに"com.google.gwt.sample.showcase"を入力する。
  • [Google Webツールキットを使用]のところにある、[指定したSDKを使用]のコンボボックスからSDKを選択。
  • [Google Appエンジンを使用する]のチェックをはずす。※ローカルでテストするため。
  • [Generate GWT project sample code]のチェックをはずす。
  • [完了]ボタンをクリックする。
  • Eclipseから[ウィンドウ]→[ビューの表示]→[ナビゲーター]とたどりナビゲータを表示する。
  • さきほどダウンロードしたGWT SDKのアーカイブを展開し、その中の"samples/Showcase"の下の"src"と"war"フォルダを、Eclipseのナビゲータ上の"Showcase"プロジェクトのところ(ツリーの最上層)にドラッグ&ドロップします。
  • コピーの問い合わせについては[Copy files and folders]を選択。
  • 上書き確認は[すべてはい]を選択。
  • コピーが終わったらEclipseで[ウィンドウ]→[設定]とたどり、ツリーから[一般]→[ワークスペース]を選択する。この中のテキストファイルのエンコードを"UTF-8"に設定する。
  • Eclipseのパッケージ・エクスプローラからソースを参照できれば成功。エントリポイントの"com.google.gwt.sample.showcase.client.Showcase.java"などを見てみる。
  • 実行する場合はパッケージ・エクスプローラで"Showcase"プロジェクトのところ(ツリーの最上層)で右クリックし[実行]→[Webアプリケーション]と進む。[Development Mode]タブのところにURLが表示されるのでこれをダブルクリックすると、ブラウザでWebアプリケーションを使うことができる。

|

« Eclipse3.6(Helios)用のVisualEditor1.5.0リリース | トップページ | GWTで作成したWebアプリケーションをtomcat上で動かす方法 »

シストレ以外の技術メモなど」カテゴリの記事

コメント

コメントを書く



(ウェブ上には掲載しません)




トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/512869/51046145

この記事へのトラックバック一覧です: GWTのサンプルプログラムをEclipseで参照・編集・実行できるようにする方法:

« Eclipse3.6(Helios)用のVisualEditor1.5.0リリース | トップページ | GWTで作成したWebアプリケーションをtomcat上で動かす方法 »