1. はじめてみよう
    1. サンプル実行までの流れ
        1. 材料
    2. JDKのインストール
    3. Webアプリケーションサーバのインストール
    4. im-jssp-sample.warのインストール
    5. Webアプリケーションサーバの起動
        1. 起動に失敗する場合
    6. 初期ページの表示
    7. Hello, World!（サンプルページを表示）
    8. こんにちは、intra-mart!（サンプルページをカスタマイズ）

はじめてみよう

im-Jssp Frameworkは、 サーバサイドのビジネスロジックを JavaScript で実装する事の出来る Web アプリケーション開発モデルの実行エンジンです。

ユーザインタフェース部分に相当するプレゼンテーションページ（HTMLファイル）と、 ビジネスロジック部分に相当するファンクションコンテナ（サーバサイドJavaScript?ファイル）を作成することで、 容易にWebアプリケーションを開発することができます。

ここでは、サンプルを実行するまでの手順を示します。
（本ページでは、Windows系OSでサンプルを実行しています。その他のOSで実行する場合は、適宜読み替えてください）

サンプル実行までの流れ

  1. JDKのインストール
  2. Webアプリケーションサーバのインストール
  3. im-jssp-sample.warのインストール
  4. Webアプリケーションサーバの起動
  5. 初期ページの表示
  6. Hello, World!（サンプルページを表示）
  7. こんにちは、intra-mart!（サンプルページをカスタマイズ）

材料

JDKJ2SE Development Kit 5.0.xhttp://java.sun.com/j2se/1.5.0/ja/download.html
WebアプリケーションサーバResin 3.0.xhttp://www.caucho.com/download/index.xtp
サンプルプログラムim-jssp-sample-0.1.x.warページ上部の「ダウンロード」よりダウンロード可能です

JDKのインストール

J2SE Development Kit 5.0.xをインストールします。
http://java.sun.com/j2se/1.5.0/ja/download.htmlよりJDKをダウンロードし、 インストールを行ってください。
すでにインストールされている場合は行う必要はありません。

Webアプリケーションサーバのインストール

Webアプリケーションサーバには、Caucho Technology, Inc.のResinを利用します。
すでにインストールされている場合は行う必要はありません。

  • http://www.caucho.com/download/index.xtpにアクセスします。
  • Resin Downloads より、Resin 3.0 Binary をダウンロードします。(ここでは「resin-3.0.21.zip」をダウンロードします)
  • ダウンロードしたアーカイブ・ファイルを展開します。（展開先のディレクトリを <RESIN_HOME> とします）

以上でResinのインストールは完了です。

im-jssp-sample.warのインストール

サンプル用のwarファイル「im-jssp-sample-X.X.X.war」をResinにインストールします。

  • サンプル用warファイルim-jssp-sample-0.1.1.war をダウンロードします。（ページ上部の「ダウンロード」よりダウンロード可能です）
  • ダウンロードした「im-jssp-sample-0.1.x.war」を <RESIN_HOME>/webapps にコピーします。
  • コピーした「im-jssp-sample-0.1.x.war」 を 「im-jssp-sample.war」にリネームします。

以下のようになっていれば、im-jssp-sample.warのインストールは完了です。 （以下の例では、<RESIN_HOME>は「C:\resin-3.0.21」となっています）

Webアプリケーションサーバの起動

<RESIN_HOME>/httpd.exe をダブルクリックし、Resinを起動します。

起動するとコンソールが表示されます。

コンソールに「Resin started in XXXXms」と表示されれば、Resinの起動は完了です。

起動に失敗する場合

Resinはデフォルトで、8080ポートを利用します。
8080ポートが既に試用されている場合は、以下の例外が発生します。 

java.net.BindException: Address already in use: JVM_Bind
Can't bind to *:8080.

ポートを変更する場合は、<RESIN_HOME>/conf/resin.confの 「/resin/server/http/@port」を変更してください。

初期ページの表示

Webブラウザから「http://localhost:8080/im-jssp-sample/」にアクセスします。

Hello, World!（サンプルページを表示）

「http://localhost:8080/im-jssp-sample/sample.jssp」にアクセスします。

「Hello, intra-mart」リンクをクリックします。
この画面は、「<RESIN_HOME>/webapps/im-jssp-sample/sample/tag/hello/hello_main.html」の内容が表示されています。

  • <RESIN_HOME>/webapps/im-jssp-sample/sample/tag/hello/hello_main.htmlの内容 
    <HTML>
  <HEAD>
    <TITLE>Sample [Hello, intra-mart]</TITLE>
  </HEAD>
  <BODY>
    Hello, World!
  </BODY>
</HTML>

こんにちは、intra-mart!（サンプルページをカスタマイズ）

プレゼンテーションページ「hello_main.html」と、ファンクションコンテナ「hello_main.js」をカスタマイズし、 画面上に「こんにちは、intra-mart'''」と表示します。
（hello_main.html と hello_main.js は「<RESIN_HOME>/webapps/im-jssp-sample/sample/tag/hello/」にあります）

ファンクションコンテナ(サーバサイドJavaScript?ファイル)と連携させたい部分に<IMART>タグを埋め込み、 プレゼンテーションページを完成させます。ここでは、「"Hello, World!"」の部分を<IMART>タグにし、ファンク ション・コンテナで指定する文字列（nameValueの値）に置き換えるように設定します。

  • <RESIN_HOME>/webapps/im-jssp-sample/sample/tag/hello/hello_main.html 
    <HTML>
  <HEAD>
    <TITLE>Sample [Hello, intra-mart]</TITLE>
  </HEAD>
  <BODY>
    <IMART type="string" value=nameValue></IMART>
  </BODY>
</HTML>

作成したプレゼンテーションページに対応するファンクションコンテナを作成します。 ファンクションコンテナには、初期化関数であるinit関数を作成します。 ここでは、文字列「こんにちは、intra-mart'''」を「nameValue」というバインド変数に設定します。 hello_main.htmlと連携させるため、ファイル名はhello_main.jsとし、プレゼンテーションページと同じフォルダに置きます。
（hello_main.jsは既に用意してあるので、適宜編集してください）

  • <RESIN_HOME>/webapps/im-jssp-sample/sample/tag/hello/hello_main.js 
    // バインド変数宣言
var nameValue = "";

// init関数の定義
function init(request){

    // HTMLへ渡す値を設定します
    nameValue = "こんにちは、intra-mart!";  

}

再度「http://localhost:8080/im-jssp-sample/sample.jssp」にアクセスし、「Hello, intra-mart」をクリックします。

表示内容が更新されていれば、成功です。

このように、im-jsspでは、容易にWebアプリケーションを作成することが可能です。
im-jssp-sample.warには、その他のサンプルも収録されています。あわせて、ご参照ください。

添付ファイル