2022年12月31日土曜日

Cozy Web/HelloResource

Cozy Webの目的の一つはモデル駆動開発とWeb開発を接続することにあります。

モデリングによって定義したモデルが、そのままWebアプリケーションのアプリケーション・ロジックとして動作し、Web画面をデザインするだけでWebアプリケーションが作成できるのが理想形です。

現時点ではその理想形にはまだまだ距離がありますが、部分的には実現できているところもあります。今回はエンティティをWebのリソースとしてアクセスする処理をモデルベースで実現する方法について説明します。

HelloResource

モデル駆動開発を指向した、モデルを使用したWebアプリケーションとしてHelloResourceを作成します。

準備

cozyを起動するディレクトリのwebappsディレクトリに、アプリケーションのホームディレクトリとなるHelloResourceを作成します。

ビュー

HelloResourceでは、Web画面を記述するビュー(*.html, *.jadeなど)は定義していません。リソースの表示はデフォルトのビュー機能によって自動的にレイアウトされます。

モデル

WEB-INF/modelsでアプリケーションで使用するモデルを定義します。以下のモデル定義をmodel.orgとしてWEB-INF/modelsに格納します。

* entity  
** product
*** features  
table=product
*** attributes  
| Name  | Type   | Multiplicity |
|-------+--------+--------------|
| id    | token  |            1 |
| name  | string |            1 |
| price | int    |            1 |

エンティティproductを以下の通りに定義しています。

  • feature項で格納するテーブル名をproductと定義
  • 属性としてid, name, priceの3つを定義

モデルはCozy Webのスクリプト言語であるCozy Scriptの基盤となっているKaleidoxの提供するモデル駆動機能をベースとしています。

Kaleidoxの提供するモデル駆動機能は以下で説明しています。

モデルの定義、データベースとの接続、状態機械の定義、状態機械によるイベント駆動といった機能を提供しています。

これらの機能をCozyではWebアプリケーションから使用することができるようになります。

実行

それではHelloResourceを実行してみましょう。

一覧

まず一覧取得です。

モデルとして定義したリソースのproductの一覧取得は以下になります。

WebアプリケーションのURL http://localhost:8080/web/HelloResource の直下にリソース名productを指定しています。

$ curl http://localhost:8080/web/HelloResource/product

この結果、以下のHTML文書が返されます。(読みやすいようにxmllintで整形しています。)

<?xml version="1.0"?>
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="keywords" content="TBD"/>
    <meta name="description" content="TBD"/>
    <meta name="robots" content="noindex,nofollow"/>
    <meta name="author" content="TBD"/>
    <title>product</title>
  </head>
  <body>
    <table class="">
      <caption class="">product</caption>
      <thead class="">
        <tr class="">
          <th scope="col" class="">Id</th>
          <th scope="col" class="">Name</th>
          <th scope="col" class="">Price</th>
        </tr>
      </thead>
      <tbody class="">
        <tr data-href="product/1.html">
          <td class="">1</td>
          <td class="">Apple</td>
          <td class="">300</td>
        </tr>
        <tr data-href="product/2.html">
          <td class="">2</td>
          <td class="">Orange</td>
          <td class="">350</td>
        </tr>
        <tr data-href="product/3.html">
          <td class="">3</td>
          <td class="">Peach</td>
          <td class="">400</td>
        </tr>
      </tbody>
    </table>
  </body>
</html>

tableタグで3つのエンティティに対応する情報が表示されています。

詳細

$ curl http://localhost:8080/web/HelloResource/product/2

この結果、以下のHTML文書が返されます。(読みやすいようにxmllintで整形しています。)

<?xml version="1.0"?>
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="keywords" content="TBD"/>
    <meta name="description" content="TBD"/>
    <meta name="robots" content="noindex,nofollow"/>
    <meta name="author" content="TBD"/>
  </head>
  <body>
    <table class="">
      <tbody>
        <tr class="">
          <th scope="row" class="">Id</th>
          <td class="">2</td>
        </tr>
        <tr class="">
          <th scope="row" class="">Name</th>
          <td class="">Orange</td>
        </tr>
        <tr class="">
          <th scope="row" class="">Price</th>
          <td class="">350</td>
        </tr>
      </tbody>
    </table>
  </body>
</html>

一覧表示のidが2の部分は以下になります。

        <tr data-href="product/2.html">
          <td class="">2</td>
          <td class="">Orange</td>
          <td class="">350</td>
        </tr>

このエンティティが詳細情報として表示されているのが分かります。

まとめ

HelloResourceでは、必要最小限の構成要素としてモデル定義のみを作成しました。HTMLなどのビューは作成していません。

モデル定義を記述したmodel.orgを作成し、WEB-INF/modelsに配置するのみで、エンティティの内容が一覧画面、詳細画面として表示できることが分かりました。ビューの定義がない場合は、Cozy Webのデフォルト画面を使ってエンティティ情報が表示されました。

次回はビューを定義して、デザイン化された画面でエンティティ情報の表示を行ってみる予定です。

諸元

Cozy
0.0.10
時刻: 0 件のコメント: