TOP
＞
システム開発
＞ 実践！マスカットIDEのセットアップ
リッチクライアントを加速させるAjax開発環境「マスカット」の全貌
第２回：実践！マスカットIDEをセットアップする
著者：
NTTデータ 川田 洋平
2006/12/15
前のページ
1
2
3
4
次のページ
実践！マスカットIDEのセットアップ
マスカットの仕組みがわかったところで、いよいよ実践編に入りましょう。今回はマスカットIDEのインストールから起動までのセットアップ手順について説明します。
マスカットIDEにはブラウザ版IDEとEclipse版IDEの2種類があります。ここでは、それぞれのIDEのセットアップ方法を実践的に説明し、さらに提供する機能についても紹介します。
なお、以降の説明ではマスカットのバージョン1.2.2（2006年12月8日現在の最新版）を対象とします。
ブラウザ版IDEをセットアップする
ブラウザ版IDEに必要なソフトウェア環境は表1の通りです。Webブラウザは、Internet Explorer 6またはFirefox 1.5のどちらかをご利用ください。プラグインなどの追加インストールは必要ありません。
マスカット本体（パッケージ名「maskat」ver. 1.2.2）
Webブラウザ（Internet Explorer 6またはFirefox 1.5）
表1：ブラウザ版IDEのソフトウェア環境
ソフトウェアは以下のサイトよりダウンロードしてください。
マスカット本体：SourceForge.jp：マスカットプロジェクト
http://sourceforge.jp/projects/maskat/
Internet Explorer 6：Microsoft
http://www.microsoft.com/japan/windows/ie/ie6/default.mspx
Firefox 1.5：Mozilla Foundation
http://www.mozilla.org/
マスカット本体を展開すると「maskat」という名前のフォルダができるので、任意のディレクトリに保存してください（例：C:\maskat）。続いて「maskat」フォルダ内の「maskatIDE」フォルダに格納されているindex.html（例：C:\maskat\maskatIDE\index.html）をWebブラウザで開きます。これでブラウザ版IDEが起動します。
図7：ブラウザ版IDE画面
（画像をクリックすると別ウィンドウに拡大図を表示します）
このようにブラウザ版IDEのセットアップは極めて簡単です。
ブラウザ版IDEの機能一覧
ブラウザ版IDEは、ドラッグ＆ドロップによる直感的な操作ができるため、画面作成が簡単に行えることが特徴です。また表2に示すように画面作成に必要な機能は一通りそろっており、シンプルな画面であれば充分作成することができます。
分類
機能
説明
入出力
新規作成
新規の画面を作成する。
保存
現在編集中の画面をレイアウト定義XMLファイルとして保存する。
ロード
レイアウト定義XMLファイルをロードする。
プレビュー
現在編集中の画面を、別ウィンドウでプレビューする。
レイアウト定義XMLの表示
現在編集中の画面のレイアウト定義XML表現を表示する。
JavaScriptの表示
現在編集中の画面のJavaScript表現を表示する。
レイアウト
配置
ドラッグ＆ドロップによりGUI部品を配置する。
移動
ドラッグ＆ドロップによりGUI部品を移動する。
大きさ変更
ドラッグ＆ドロップによりGUI部品の大きさを変更する。
削除
GUI部品を削除する。
整列
複数のGUI部品を整列する。
属性値設定
GUI部品の属性値を設定する。
表2：ブラウザ版IDEの機能
なお、マスカットではGUI部品のライブラリとしてオープンソースライブラリの「Rialto」を採用しています。ブラウザ版IDEはRialtoが提供しているRialto Studioの成果を利用しています。
Rialto
http://rialto.application-servers.com/wiki/
前のページ
1
2
3
4
次のページ
著者プロフィール
株式会社NTTデータ 川田 洋平
技術開発本部 ソフトウェア工学推進センタ エキスパート
同社の研究開発部門にてWebシステムの研究開発に従事。マスカットの開発には初期から携わり、オープンソース化後はマスカットプロジェクトのプロジェクト運営委員会(PMC)およびコミッタとして活動を続けている。
INDEX
第2回：実践！マスカットIDEをセットアップする
はじめに
実践！マスカットIDEのセットアップ
Eclipse版IDEをセットアップする
ブラウザ版IDEとEclipse版IDEの違いと使い分け
