検索
連載

JavaScriptを書かずにAjaxを実現するjMakiCoolなEclipseプラグイン(22)(3/3 ページ)

Share
Tweet
LINE
Hatena
前のページへ |       

jMakiでJSONを使って通信するには?

 次に、JSONを利用してテーブルを表示してみましょう。index.jspを次のように変更します。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

 リスト2では、太字部分のserviceタグでJSONサービスへのURLを指定します。ここでは、静的なdata.jsonファイルとしてWebContentディレクトリに作成します。ファイルの文字コードはUTF-8にしておきます。UTF-8にしないと、文字化けするので注意してください。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

 Eclipseの[サーバー]ビューからサーバを再実行すると、図9のような画面が表示されます。

図9 JSONを利用したdojo.etableの画面
図9 JSONを利用したdojo.etableの画面

 ここでは、data.jsonを静的なファイルとして用意しましたが、サーブレットやJSPなどで動的に生成するようにすることにより、動的なテーブルを作成できます。

GoogleマップをJSPから手軽に呼び出してみよう

 最後に、Googleマップのアプリケーションを作ってみましょう。[スニペット]ビューの[google]タブから[map]を選択し、index.jspへドラッグ&ドロップでコピーし、リスト4のようにします。

*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***

 サーバを再実行して、画面を表示すると、次のような画面になります。

図10 GoogleマップをJSPから呼び出した画面
図10 GoogleマップをJSPから呼び出した画面

 リスト4のargsに経度と緯度の座標を入力しますが、デフォルトの値を変更して日本のある場所の座標にしています。どこの座標かは実際にサンプルを実行して確認してください。

楽してAjaxアプリケーションを作ろう

 簡単ではありますが、jMakiプラグインを利用したAjaxアプリケーションの開発について紹介しました。jMakiは日本語のドキュメントは皆無で英語のドキュメントもまだ十分とはいえず、今回のサンプルアプリケーションも手探りで作成しました。しかしながら、そのシンプルさに十分な将来性を感じられたと思います。

 以前、Ajaxのアジャイル開発をサポートするプラグインとしてProject Zeroを紹介しました。こちらは、GroovyとJavaScriptという2つのスクリプト言語でアプリケーションを組み立てていくというアプローチでしたが、jMakiはタグライブラリで完全にJavaScriptをラップして開発者は標準のJavaの開発スキルだけで開発できるようにしようとしています。

 今回は非常に簡単な使用例なので、複雑なアプリケーションになってくるとJavaScriptを記述する必要が出てくると思いますが、顧客と仕様を詰めるための簡易なプロトタイプ程度あれば、非常に簡単に作成できそうです。

 jMakiはJSFStrutsなどの既存のJavaのWebアプリケーションフレームワークと組み合わせて利用できるので、すでにJavaアプリケーションの開発のノウハウが蓄積している開発部隊に対しては、いままでの延長でAjaxアプリケーションが開発できるjMakiの方が良さそうです。今後も、jMakiの動向に注目したいと思います。


Copyright © ITmedia, Inc. All Rights Reserved.

前のページへ |       
ページトップに戻る