Monthly Archives: 12月 2015

Mayaaを使ってHTMLを出力するアイデア

これは Mayaa Advent Calendar 2015 の9日目です。昨日は「mayaaの向いてるサイト、向いていないサイト」でした。

Mayaaアドベントカレンダーは毎日参加者を募集しています)

Mayaaを使って大量にHTMLページを出力しよう!

今日はterazzoの日記さんのMayaaを普通のテンプレートエンジンとして使うを参考にします。

Mayaaは基本的にServlet APIに依存した作りになっているため、Servletコンテナ上でしか動きません。しかし、必要なオブジェクトのモックが提供されており、うまく使うと単体で動かすことが可能です。

しかし、素晴らしい記事ですね!僕の書くことがない><

二番煎じをしても仕方がないので、これの応用例を考えてみましょう。

記事ではメールテンプレートとして利用する例を紹介していますが、MayaaでHTML / XML以外のものを出力するのは無理があるかなあと思います。HTMLページを出力するのに使うのが良いと思います。

CSVを食べて帳票にする

実用的な用途として、CSV形式で出力したデータを読み取って、帳票を出力する用途です。

HTML+CSSでも頑張れば結構実用的な帳票を出力できますし、自分は試したことがありませんが、Copper PDFと組み合わせてもうまく行ったという話を聞きました。

MayaaのマニュアルをMayaaで作る

硬度で実用的なテクニックとして、Mayaaファイルをパースして、それを元にm:id一覧表を出力する使い方も便利です。

まとめ

今日は非常に短くなってしまいました。MayaaはWebサイトだけでなく、HTMLジェネレーターとしても使えるという話でした。

ここ2日コードを書いてなくてごめんなさい。明日はJava EEアドベントカレンダーと合流なので、ちゃんとしたのを書こうと思います。

mayaaの向いてるサイト、向いていないサイト

これは Mayaa Advent Calendar 2015 の8日目です。昨日は「MayaaでWebサイトのビューを実装するときに押さえておくべき基本テクニック5 – その他雑多なテクニック」です。

ここまでガチな感じの記事が続いたので、今日はまったりしようと思います。

なお、(Mayaaアドベントカレンダーは毎日参加者を募集しています)

Mayaaに向くサイト、向かないサイト

Mayaaは、結構クセの強いテンプレートエンジンです。当然、すべてのサイトに向くわけではありません。今日は向くサイト、向かないサイトと紹介します。

Mayaaに向かないサイト

小規模なサイト

Mayaaデザイナーとエンジニアのコラボレーションを推進するテンプレートエンジンですから、当然、デザイナーとエンジニアのどちらかがいない時は必要ありません。

プログラマーが一人でガンガン開発するときはJSPの方が手っ取り早いかもしれません。

業務アプリケーション(開発者がMayaaに慣れている場合を除く)

デザイン重視ではない業務アプリケーションの場合も、Mayaaを使うメリットが活かせません。

Javaなら、JSFを使うか、いっそSPAにしてしまっても良いかもしれません。

ただ、開発者がMayaaに慣れているなら、その限りでもありません。いしがみメソッドでMayaaを使うことで、テンプレートが比較的スパゲッティにならず書けます。

折衷案として、いしがみメソッドを意識しながら、JSPやThymeleafを使うという手もあります。

高パフォーマンスが要求されるサイト

はっきり言って、Mayaaはそんなに高速なテンプレートエンジンではありません。内部的にかなり頑張っていますが、XMLをパースする、JavaScriptをコンパイルするという大仕事をしているためどうしても不利になります。

とはいえ、とんでもなく遅いわけでもありませんが、極限までのハイパフォーマンスが要求されるなら、あえてMayaaを選択する必要はないでしょう。

Mayaaが向くサイト

ECサイト

SEOが重要なECサイトでは、まだSPAを使うわけには行きません。ちゃんと静的なHTMLページを構成して上げる必要があり、metaタグなども結構細かく制御する必要があるでしょう。

また、ECサイトはフロントのデザイン変更が結構頻繁に必要になります。

そこで、運営者にある程度のマニュアルを渡して、サイト運営者と、運営者側のデザイナーのみでフロントをある程度いじれるようにできたら最高です。

ただ、そのためにはかなりのお膳立てが必要ではあります。きちんとレクチャーをし、プレビュー機能や、バックアップ機能などを十分に完備することが必須となるでしょう。

CMS

同じような需要が企業のコーポレートサイトなどのCMSとしての用途です。

この分野では WordPress が圧倒的な人気がありますが、Javaエンジニアが中心の会社で自社のサイトを作ったりするなら、わりとMayaaそのものを使うことは選択肢でありだと思います。

HTMLジェネレータとして使う

イレギュラーな話ですが、Mayaaをスタンドアロンなテンプレートエンジンとして使うテクニックが有ります(後日詳しく紹介します)

これを使うと、一つのテンプレートにデータを流し込んで静的ページ群を大量生成して出力すると結構便利だったりします。

さすがに出力対象がHTMLでない場合はあまり便利ではありませんが、マニュアルやドキュメントなどを大量に生成するとき、結構重宝します。

まとめ

こうしてみると、ある元データがあって、ビューという箱に収める・大量にページを生成するといった用途こそ、Mayaaが本領を発揮します。

本来であれば、XSLTのようでもあります。実際、XSLTの代わりにMayaaを使うと便利です。

MayaaをECサイトに使っているという事例は結構聞きます。でも、うまく使いこなすのは大変みたいですね。某企業みたいに本気で体制を組まないとつらそうです。

一方、マニュアルとか、自社CMSの用途なら比較的簡単かもしれません。その手のサイトを個人で作るときにMayaaを試してみるのも良いかもしれません。

ということで、明日はマニュアルの大量生成に挑戦してみようと思います!

MayaaでWebサイトのビューを実装するときに押さえておくべき基本テクニック5 – その他雑多なテクニック

これは Mayaa Advent Calendar 2015 の7日目です。昨日は「MayaaでWebサイトのビューを実装するときに押さえておくべき基本テクニック4 – ヘッダー・フッター共通部分の扱い」でした。

ついに7日目です。これで一週間突破です。お付き合いいただきありがとうございます。

さて、いしがみメソッドも今日で最後です!ここまで紹介していなかったテクニックをざっと紹介していきます。

その前に一つお知らせ:3日目の記事に大事になことを書き忘れたので追記しています。「default.mayaaに書いたm:idには接頭辞"common."を付けよう!」先頭から読んできていただいていた方はこちらに戻ってお読みいただけると幸いです。昨日このルールを前提に書いてしまったことをお詫びいたします。

いしがみメソッド5. その他テクニック

1.テンプレート上のコメントは、ソース表示時に見えないようにする

以前も紹介しましたが、テンプレート上に <!--, --> 形式でコメントを記載すると、HTMLなので、ソース表示でエンドユーザーに見えてしまいます。

JSPにおける <%--, --%> のような記述に対応するためにはどうしたらよいでしょうか?

以前以下の様な方法を紹介しました。

<!-- ${/* このコメントは見えません */} -->

ただ、テンプレート上に${/* */}を書くことはできるだけ禁止したいことと矛盾します。また、${}の内側は初回アクセス時にJavaScriptとJavaにコンパイルしているので、ちりも積もればなんとやら。大量に書くのに向かないかもしれません。

テンプレート上に書いた"m:"名前空間の属性はサーバー実行時に消えます。なので

<div m:comment="これは○○です">
</div>

こういったテクニックも使えるでしょう。

もっとブロックで要素を隠したいときは、以下のようにDUMMY領域を囲むm:idを作成し

<m:null m:id='DUMMY_TAG' />

次のようにする方が見通しがよいかもしれません。

<div m:id="DUMMY_TAG">
  <div>....</div>
</div>

場面場面で適宜使い分けてください。

2.文言はなるべくテンプレート側に書く

ケースバイケースですが、例えば男性か、女性かを返すm:id

<m:with m:id="SEIBETSU_HERE">
  <m:if test="${user.sex == 'm'}"><m:write valus="男性" />
  <m:if test="${user.sex == 'f'}"><m:write valus="女性" />
</m:with>

などを作るくらいなら

<m:if m:id="IF_MAN" test="${user.sex == 'm'}">
  <m:echo><m:doBody /></m:echo>
</m:if>
<m:if m:id="IF_WOMAN" test="${user.sex == 'f'}">
  <m:echo><m:doBody /></m:echo>
</m:if>

を作りましょう。

ただ、文言を動的に組み立てるような場合は、この限りではないので、適宜対応してください。

3.nekoHTMLパーサーをいじる

上級者向きですが、スマホサイトを作ろうとする場合は実質必須でしょう。くわしくはMayaaでHTML5のスマートフォンページを作る際にはまったことの内容のとおりです。

まとめ

いかがでしたか?ここまでのテクニックはこれまでにこのブログや勉強会のスライドで紹介したことです。しかし、一つ一つじっくり説明したのは初めてだと思います。

これらテクニックはテンプレートエンジンがMayaaだけでなく、Mixer2などの別のテンプレートエンジンでも通用するのではないかと思います。Mayaaアドベントカレンダーで言うのもあれですが、たとえ将来Mayaaが忘れられても、覚えてほしいと思います。

僕が経験で培ってきた細かなテクニックを世に残せてよかったです。

次回以降予告

明日からは、これらのテクニックをふまえたMayaaの拡張や、細かな開発補助ツール、フレームワークとの組み合わせなど、どんどん紹介していこうと思います。

10日は、Java EEアドベントカレンダーの当番でもあるので、合流して、Java EEとMayaa両方に関係ある何かを書きます!

明日からもよろしくお願い致します。