標準プロジェクト構成

以下の図は、UI開発基盤を採用するプロジェクトの標準的な構成を表したものである。 この図にあるように、プロジェクト直下は以下の4つサブディレクトリから構成される。

ディレクトリ名 概要 詳細
ui_demo 業務画面モック開発用プロジェクト

UI画面開発ツールとして展開されている作業ディレクトリを展開する。外部設計工程で作成したJSP画面モックを格納する。

ビルドコマンドを実行することで、各プラグイン中の成果物を集約したものがここに配備される。

ui_test UI開発基盤テスト用プロジェクト

プロジェクト固有UIプラグイン(ui_plugins配下で開発されるプラグイン)のテスト用プロジェクト。

ビルドコマンドを実行することで、各プラグイン中の成果物及びテスト用リソースがここに配備される。

nablarch_plugins_bundle Nablarch標準UIプラグイン

Nablarch UI開発基盤としてリリースされるプラグイン一式。

リリース物をそのまま格納し、UI基盤のアップデートを行う際に洗い替えを行う。(プロジェクト側での改変は禁止)

ui_plugins プロジェクト固有UIプラグイン

プロジェクトで実際に使用するプラグインを配置する。

既存のプラグインを基盤側でカスタマイズする場合、元にするプラグインをここにコピーした上で修正する。 (後述)

web_common など デプロイ対象プロジェクト

実際にサーバ環境にデプロイされる資源を格納するプロジェクト。実装工程以降で使用する。

ビルドコマンドの実行により、業務画面モック作成用プロジェクトと同等のビルド成果物がサーブレットコンテキスト配下に配置される。

プロジェクトルート/
  │
  ├─ nablarch_plugins_bundle/         # Nablarch標準UIプラグイン
  │     └── node_modules/
  │              │
  │              ├── jquery/                         # jqueryプラグイン
  │              │     └── 1.11.0/
  │              │
  │              ├── nablarch_widget_filed_calendar/ # カレンダー日付入力ウィジェットプラグイン
  │              │     └── 1.0.2/
  │              │
  │              └── nablarch-css-color-default/     # カラースキームテーマ(Nablarchブランドカラー)プラグイン
  │                     └── 1.0.0/
  │
  └─ xxx_project/             # プロジェクトトップ
         │
         ├── ui_demo/              # 業務画面モック開発用プロジェクト
         │     ├── ss11AC/         # 業務画面JSP(サブシステム毎)
         │     ├── ss12AC/
         │     ├── css/            # スタイルシート
         │     ├── fonts/          # フォント
         │     ├── img/            # 画像
         │     ├── include/        # 共通インクルードJSP
         │     ├── js/             # javascript
         │     └── WEB-INF/
         │           └── tags/     # タグファイル
         │
         ├── ui_test/              # UI開発基盤テスト用プロジェクト
         │     ├── css/            # スタイルシート
         │     ├── fonts/          # フォント
         │     ├── img/            # 画像
         │     ├── include/        # 共通インクルードJSP
         │     ├── js/             # javascript
         │     ├── jsp/            # テスト用JSP
         │     └── WEB-INF/
         │           └── tags/     # タグファイル
         │
         │
         ├── ui_plugins/            # UI開発基盤プロジェクトカスタマイズ用フォルダ
         │     ├── package.json     # 利用プラグイン定義
         │     └── node_modules/    # UIプラグインフォルダ
         │           │
         │           ├── jquery/                         # jqueryプラグイン
         │           │     ├── dist/
         │           │     │     └── jquery.js
         │           │     └── src/
         │           │
         │           ├── nablarch-widget-field-calendar/  # カレンダー日付入力ウィジェットプラグイン
         │           │     ├── package.json
         │           │     ├── bin/
         │           │     ├── ui_public/
         │           │     ├── ui_local/
         │           │     └── ui_test/
         │           │
         │           ├── xxxproject_css_color/            # カラースキーム定義(プロジェクトカスタマイズ)
         │           │     ├── package.json
         │           │     ├── bin/
         │           │     ├── ui_public/
         │           │     ├── ui_local/
         │           │     └── ui_test/
         │           │
         │
         │
         ├── web_common/             # デプロイ対象プロジェクト#1
         │     └── main/
         │           └── web/
         │
         └── web_xxxx/               # デプロイ対象プロジェクト#2
               └── main/
                     └── web/