Web ダイアグラムと Web ダイアグラム・エディター

Web アプリケーション・ダイアグラム (または Web ダイアグラム ) は、Faces ベースまたは Struts ベースのアプリケーションのような Web アプリケーションのフローを視覚化および変更するのに役立つファイルです。 Web ダイアグラム・エディター は、Web ダイアグラムを編集するためのビジュアル・エディターです。

ノードおよび接続

Web ダイアグラムは、ノード およびノード間の接続 から構成されます。ノードは、Web ページ、Java™ Bean、または Web アプリケーションのようなリソースを表すアイコンです。

ノードは、当該のリソースが存在する場合は実現された ノードと呼ばれ、リソースが存在しない場合は未実現の ノードと呼ばれます。実現されたノードは色付きで、太文字の名前と共に表示されます。未実現のノードは、グレーのアイコンとして表示されます。

図 1 に、2 つの Web ページを持つシンプルな Web ダイアグラムを示します。Web ページの一方はアクション・マッピング、もう一方はフォーム Bean で、すべて実現されています。開始点は index.jsp です。これに対する入力は、computeDay アクション・マッピングへと流れて、dateData という名前のフォーム Bean に一時的に保管されます。入力が有効である場合は、出力が計算されて、表示のために output.jsp に送られます。入力が無効である場合は、エラー・メッセージが index.jsp に戻されます。

図 1. 4 つのノードを持つシンプルな Web ダイアグラム
Web ダイアグラム (index.jsp は computeDay アクション・マッピングに接続し、 computeDay は output.jsp および dateData フォーム Bean に接続)

Web ダイアグラムの利点

アプリケーションのフローの視覚化に役立つ Web ダイアグラムの機能は、アプリケーションをよりよく理解するための一助となります。動的 Web アプリケーションで呼び出される間接参照は数レベルにわたるため、フローが即時に明確にならないことがあります。たとえば、JSP ソースを一目見ただけでは、どのアクションがタグ・ライブラリー・リンクによって呼び出されるのかわかりません。 この情報を取得するためには、JSP リンクからデプロイメント記述子、アクション・サーブレット、さらに構成ファイルへと続くアクション・マッピングの証跡をたどる必要があります。その後、該当のアクション・マッピング用の構成エントリーから、そのアクションを見つけることができます。大規模で複雑な Web アプリケーションの場合には、これらのロジック・フローをたどって理解することは、間違いを犯しやすく、かつ単調な作業となる可能性があります。

また、Web ダイアグラムを使用すると、ダイアグラム内で表現されているノードとの直接対話も可能です。たとえば、あるノードがまだ存在しないリソースを表している場合、そのノードをダブルクリックすると、基になるリソースを作成してそのノードを実現するためのウィザードが開きます。ノードがすでに実現されている場合は、ダブルクリックするとそのノードに関連付けられているエディターが開きます。

Web ダイアグラムの特性

Web ダイアグラム・エディターは、基になるリソースに生じた変更をリアルタイムに反映します。たとえば、まだ存在しない MyJSP.jsp という名前の Web ページを表すノードを作成できます。そのノードの作成後にダイアグラム・エディターの外側で JSP ファイルを作成すると、ダイアグラム・エディターはその変更を即時にダイアグラムに反映させます。同様に、ダイアグラム内に表示されている実現済みパーツの基になるリソースを削除すると、ダイアグラム・エディターはその変更を即時に反映させます。

ダイアグラム・エディターを使用して、アプリケーションをどのようにモジュールに編成するかに応じて、アプリケーションのすべてまたは一部を表示できます。各ダイアグラムは、それぞれ 1 つのモジュールを表現します。たとえば、3 つのパーツから構成されるアプリケーションがあるとします。 1 つのパーツはログイン・プロセスを処理し、また別のパーツは製品照会を処理し、3 つ目のパーツは製品の更新を処理します。このケースでは、アプリケーションを 3 つのモジュールに編成して 3 つの Web ダイアグラムを持つ場合と、1 つのモジュールに編成して 1 つの Web ダイアグラムを持つ場合が考えられます。

特定のタイプのノードまたは接続を非表示にすると、複雑なダイアグラムを単純化できます。詳しくは、『Web アプリケーション・ダイアグラムの作成 : 概要』を参照してください。

以下の図に、この製品と一緒に出荷される、Struts を実際に使用したサンプル・プログラムの Web ダイアグラムを示します。 Web ページとフォーム Bean ノードは、Model/View/Controller デザイン・パターン の View の部分を表します。アクション・マッピングは Controller を表します。 (Web ダイアグラムには、アクション・マッピングが接続する Model は表示されません。)

図 2. Struts を実際に使用したサンプル・プログラムの単純化された Web ダイアグラム
index.jsp ノードは、/tour および /editRegistration アクション・マッピングと logon.jsp Web ページに接続しています。ダイアグラムには、その他の Web ページ、 アクション・マッピング、フォーム Bean ノード、および接続が含まれています。
関連概念
Web ダイアグラム内の接続
JavaServer Faces
関連タスク
Web ダイアグラムの作成 : 概要
Web ダイアグラムの編集 : 概要
関連資料
Web ダイアグラム・エディター用のキーボード・ショートカット
Web ダイアグラム・エディター : ポップアップ・メニュー
フィードバック
(C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.
(C) Copyright IBM Japan 2005