2.1.10. UI開発基盤の展開¶
本節では、前節 UI開発基盤の導入 で作成した開発基盤をプロジェクト内に展開する方法について述べる。 開発基盤の利用形態は、その目的によって以下の3つにわかれる。
- 1.画面設計担当者向けワークスペース
- 外部設計工程において、業務画面設計者が作業するためのワークスペース。
- 2.開発担当者向けワークスペース
- PG/UT工程において、画面機能の実装を行う担当者が作業するためのワークスペース。
- 3.UIデモ実行用アーカイブ
- 業務画面のUIデモを実施するためのアーカイブ。 本ファイルとブラウザがあれば、UIデモ実施することができる。 客先に送信して、ミーティングで使用したり、 開発リポジトリに直接アクセスできない顧客側の担当者に UIを直接確認してもらう場合などに用いる。
ここでは、各利用用途に応じた開発基盤の取得方法について述べる。
2.1.10.1. 画面設計担当者向けワークスペースの取得¶
画面設計担当者向けワークスペースは、前節で作成したリポジトリの ui_demo/ ディレクトリ(下図)をローカルディスクの任意の位置にチェックアウトする。
プロジェクトルート/
│
└── web_project/
├── web/
├── ui_demo/ #### ← ここからチェックアウト####
│ ├── .project
│ ├── ローカル画面確認.bat
│ │
│
├── ui_plugins/
└── ui_test/
補足
チェックアウトしたワークスペースの使用方法については JSP/HTML作成ガイド を参照すること。
2.1.10.2. 開発担当者向けワークスペースの展開¶
開発担当者向けワークスペースは、前節で作成したリポジトリの web_project/ ディレクトリ(下図)をローカルディスクの任意の位置にチェックアウトする。
プロジェクトルート/
│
└── web_project/ #### ← ここからチェックアウト####
├── web/
│ ├── .classpath
│ ├── .project
│ │
│
├── ui_demo/
│ ├── .project
│ ├── ローカル画面確認.bat
│ │
│
├── ui_plugins/
└── ui_test/
├── .classpath
├── .project
│
補足
Eclipseを利用する場合、 ui_plugins/tool/wtptoolをantで実行すると、ui_plugins配下のjsp, tagファイルの入力補完や構文チェックが有効になる。
重要
リクエスト単体テストでhtmlを確認したとき動的読み込み(XHR)が許可されず、JavaScriptが動作しないため、 開発担当者向けワークスペースに展開する前には main/webapp/WEB-INF/include/js_include.jsp を確認し、本番用に切り替えること。(minifyされたjsファイルを読み込むようにする。)
2.1.10.3. UIデモ実行用アーカイブの作成¶
2.1.10.3.1. 作成手順¶
- UI開発基盤リポジトリの ui_demo/ ディレクトリ(下図)をローカルディスクの任意の位置にエクスポートする。
プロジェクトルート/
│
└── web_project/
├── web/
├── ui_demo/ #### ← ここからエクスポート####
│ ├── .project
│ ├── ローカル画面確認.bat
│ │
│
├── ui_plugins/
└── ui_test/
補足
ここで、デモに不要な業務画面JSPを削除してもよい。 (ローカル画面確認.bat で表示されるリンク一覧には自動的に反映される。)
- エクスポートしたディレクトリを圧縮ソフトで圧縮する。(ファイル名は任意)
2.1.10.3.2. 確認手順¶
- 作成したアーカイブを任意の別ディレクトリに展開する。
- 展開したディレクトリ直下の ローカル画面確認.bat を実行する。
- ブラウザが起動し、各業務画面JSPのリンク一覧が表示されるので デモ表示を行いたい画面のリンクをクリックする。