かとじゅんの技術日誌

技術の話をするところ

Teedaでページ駆動開発

準備するもの

Eclipse 3.2.1にDoltengをインストールしてください。たぶん、Kijimuna, Diigu, DbLauncherも必要になります。

Churaプロジェクトの作成

http://s2container.seasar.org/ja/demo/chura.html
ここを参考に、Teeda+S2Daoを選択(現在Uujiは選択できません)

まずはHTMLを準備

src/main/webapp/view/multiply.html として以下のHTMLを作成。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<link rel="stylesheet" type="text/css" href="../../css/global.css"/>
	<title>掛け算</title>
</head>
<body>
<form>
<input type="text" id="value1" /> × <input type="text" id="value2" /><span id="result" />
<input type="submit" id="doCalc" value="掛け算" />
</form>
</body>
</html>

Ctrl + 5でDoltengのページクラス生成ウィザードを呼び出す

public class MultiplyPage {
  
  /** Requiredアノテーションで必須項目にします */
  @Required
  private int value1;

  /** Requiredアノテーションで必須項目にします */
  @Required
  private int value2;

  private int result;

  public void setValue1(int value){
    this.value1 = value;
  }

  public void setValue2(int value){
    this.value2 = value;
  }

  public void setResult(int result){
    this.result = result;
  }

  public int getValue1(){
    return this.value1;
  }

  public int getValue2(){
    return this.value2;
  }

  public int getResult(){
    return this.result;
  }

  /** 掛け算ボタンがクリックされた場合の処理 */
  public String doCalc(){
    this.result = this.value1 + this.value2;
  }

}

サーバサイドのページクラスのプロパティ名、メソッド名は、HTML上のID属性の名前と連携するようになっています。
計算結果は、getResult()によってHTML上の

<span id="result" />

を置き換えます。
このHTMLテンプレートの概念はS2JSFから存在するのですが、HTML上に特別なテンプレート言語を記述しないでよいのでデザイナーとのやり取りがしやすく、そもそもコーディング量も最小で済みます。
現在はレイアウト機能はないそうですが、直に実装されると思います。⇒というか完成したそうです。すんばらしぃ。

参考になる書籍はと、

WEB+DB PRESS Vol.36

WEB+DB PRESS Vol.36