チュートリアル : JavaServer Faces アプリケーション
このチュートリアルでは、Workshop を使用して簡単な JSF アプリケーションを作成する方法を示します。ここでは、(1) このチュートリアルで使用するテクノロジ、および (2) このチュートリアルで作成するアプリケーションについて説明します。
JSF チュートリアルで使用するテクノロジ
JSF
JavaServer Faces (JSF) は、JavaServer アプリケーションのユーザ インタフェースの構築を容易にするためのテクノロジです。開発者は、ページ内で再利用可能な UI コンポーネントを組み立て、それらのコンポーネントをアプリケーションのデータ ソースやデータ モデルに接続して、クライアント生成のイベントをサーバ サイドのイベント ハンドラに配線することで、Web アプリケーションをすばやく簡単に構築できます。ユーザ インタフェース コードは、クライアントで生成されたイベントを受けてサーバで実行されます。これにより、アプリケーション開発者はアプリケーション コードの開発に集中できます。
Workshop JSF ツール
Workshop を使用すると、サーバサイド テクノロジである JavaServer Faces (JSF) に基づいて、洗練された Web アプリケーションを簡単に開発できます。
Workshop は、JSF ベースの Web アプリケーションを構築するための統合開発環境を提供します。Workshop は、JSF 用の視覚的な WYSIWYG エディタを備えており、分割されたペインにエディタとソースを表示して同期させることができます。また、高性能のコード補完機能、エラー チェック機能、複数のレベルまで検証できる検証機能も備えています。
その他の概念と機能
- アプリケーション データベースと AppXRay
Workshop 製品群に組み込まれている AppXRay は、インポートされた Web アプリケーションのすべての要素をスキャンして、要素間の関係を示す詳細なマップを作成するテクノロジです。要素には、Java アプリケーション ロジック、JSP ファイル、Struts アーティファクト、JSF アーティファクト、Web およびコンフィグレーションの XML ファイル、リソース バンドル、アプリケーション変数、プロパティなどが含まれます。アプリケーションのスキャン時には、要素間のマッピングに基づいてアプリケーション データベースが動的に構築されます。このデータベースは、Web アプリケーションを変更するにつれて少しずつ更新されます。これらの AppXRay 機能によって、Web アプリケーションの作成、編集、デバッグの生産性が飛躍的に向上します。
- 整合性チェック
アプリケーションに加えたすべての変更は、Workshop によってモニタされ、エラーがないかどうかチェックされます。エラーが見つかった場合は、標準の Eclipse エラー表示システムによって Workbench の [問題] ビューに表示されます。Workshop は、アプリケーション データベースを活用して整合性をチェックします。
- 編集の同期
Workshop のエディタでは、ソース ペインとデザイン ペインがリアルタイムで同期します。ソース ペインとデザイン ペインのいずれかに変更を加えると、即座にもう一方のペインに反映されます。
- [AppXaminer]
Workshop の [AppXaminer] を使用すると、Web の依存関係を管理したり、リソース間の関係を視覚的に表示したりできます。[AppXaminer] は、問題を自動的に検知する機能や、環境内をスムーズに移動するための機能も提供します。
- AppXNavigator
AppXNavigator は、ハイパーリンク スタイルのナビゲーションを提供します。このナビゲーションはすべてのエディタで利用でき、エディタ内から Java、JSP、Struts、JSF の依存関係に移動するために使用できます。特定のリソースを検索したり参照したりする場合に便利です。
アプリケーションの概要
このチュートリアルで使用するサンプル アプリケーションは、IT ソリューション企業の Web アプリケーションです。このアプリケーションに登録されているユーザは、さまざまなソフトウェアをダウンロードできます。このチュートリアルでは、Web アプリケーションの「登録とログイン」モジュールの 1 つを開発します。
このアプリケーションは、未登録のユーザに対してはまず登録を済ませるよう要求します。登録時には、ユーザ ID、パスワード、氏名、および連絡先 (住所、郵便番号、電話番号など) を入力する必要があります。ユーザ ID は 8 文字以内のユニークな値でなければなりません。パスワードは、1000 から 9999 までの 4 桁の数値です。
登録を済ませたユーザは、ユーザ ID とパスワードを入力してログインできます。ユーザ ID とパスワードは、アプリケーションによって検証されます。それらが有効であれば、ソフトウェアをダウンロードするためのページにユーザを転送します。
Web コンポーネント
ここでは、サンプル Web アプリケーションのソフトウェア コンポーネントについて説明します。
- HTML および CSS ファイル
- login.jsp
- register.jsp
- home.jsp
- stylesheet.css
- Helper/Model クラス
- MessageFactory
- LocalManager
- DataStoreBean
- 管理対象 Bean
- LoginBean
- UserBean
- ContactDetailsBean
- ServletContext リスナ
- ContextListener
- バリデータ
- JSF ライブラリで提供される標準的なバリデータです。
- コンフィグレーション ファイル web.xml および faces-config.xml です。
- プロパティ ファイル application_xx.properties には、国際化のためのキーと値のペア情報を格納します。
ユーザ ID とパスワードを入力するためのログイン フォームを表示します。LoginBean.validate アクションに対して要求を送信します。ユーザ ID とパスワードが有効な場合は home.jsp ページを表示します。無効な場合は再ログインを要求します。
ユーザ ID、パスワード、氏名、連絡先などの情報を入力するための登録フォームを表示します。UserBean.registerUser アクションに対して要求を送信します。登録が正常に完了すると、ユーザを home.jsp ページにナビゲートします。
ウェルカム メッセージと、Workshop をダウンロードするためのリンクを表示します。
JSP ページの外観をカスタマイズするための CSS ファイルです。
アプリケーション リソース バンドルからメッセージを取得する Helper クラスです。
実行時にアプリケーション ロケールを更新するための static メソッドを提供します。
登録済みユーザのリストを保持する一時的なデータ ストアを表します。
ユーザ ID とパスワードの検証を担当する管理対象 Bean です。
ユーザ ID、パスワード、氏名、連絡先などのユーザ情報を保持するシリアル化可能な Bean です。データベースにユーザ情報を格納するためのメソッド getRegisteredUser( ) を実装します。
住所、市町村、都道府県、郵便番号、国、会社電話番号、自宅電話番号などの連絡先情報を保持します。
サーブレット コンテキストが初期化されたときに通知されます。通知を受けたら、ユーザ情報 (UserBean オブジェクト) を格納する DataStore のインスタンスを作成し、アプリケーション スコープ内に配置します。
次のステップでは、JSF アプリケーション用のサポート ファイル (.java および .jsp ファイル) とリソース (画像、.css ファイル) を含むサンプル Web アプリケーションから workshop-jsf-tutorial プロジェクトを作成します。このチュートリアルの説明と手順に従って作業することで、Workshop を使用して JSF アプリケーションを開発する方法を習得できます。
