狠狠撸

2014.01 ?/ ?アゼロス
概要（このプレゼンの趣旨）
Ｗ３Ｃが提唱するコンテンツのデータ?～プレゼン層の統合技術、ＸＭＬ／ＸＳＬ
ＸＭＬ／ＸＳＬを処理理する?入出?力力のフローは、コンテンツ制作者には扱いにくい
?入出?力力のフローをコンテンツ制作者が簡単にあつかえるよう、補助ツールを提供
１．
２．
３．
※?　統合技術＝ＸＭＬ／ＸＳＬ、補助ツール＝ＸＳＬＴ＋パイプライン
※?　統合ツールが提供する機能：?　ＨＴＭＬテンプレートエンジン、ＣＳＳプリプロセッサ、静的サイトジェネレータ、軽量量コンテン
?　?　ツ管理理システム（ＣＭＳ）、簡易易なウェブアプリケーション?フレームワーク、?文書要素のライブラリ化、シングルソース?パブ
?　?　リッシング（多媒体、多?言語、オープンデータ対応）、異異種システムの統合（テンプレートのテンプレート、データ形式の変換）
コンテンツ制作者のための
ウェブ統合ツールを提供

2014.01 ?/ ?アゼロス
?生き抜くためのマークアップ技術
?～ ?ツールの解説編 ??～

<vox:src>get:simple.xml</vox:src>

<vox:via>app:simple.xsl</vox:via>

<vox:dst>set:simple.htm</vox:dst>

?手順（フロー）：simple.xml

2014.01 ?/ ?アゼロス
対策＃１
Ｗ３Ｃが提唱する、コンテンツのデータ?～プレゼン層統合：
ＸＭＬ?　 ?…… ?内容（データ）?　の標準／?木構造データ
ＸＳＬＴ ?…… ?体裁（スタイル）の標準／関数型の処理理
?
?

<con>代表の○○です。よろしくお願いいたします。</con>

<section>

<h1>代表挨拶</h1>

<p><xsl:value-of
select="con"/></p>

</section>

内容（データ）：simple.xml
体裁（スタイル）：simple.xsl
コンテンツを統合する標準技術、ＸＭＬ／ＸＳＬ

2014.01 ?/ ?アゼロス
問題＃２
ＸＭＬ／ＸＳＬを有効に使える環境がほとんどない（ウェブ
ブラウザだけでは、実務で役に?立立たない）
使いこなすには、あるていどのプログラミングが必要
?
?


<section>


<p><xsl:value-of
select="con"/></p>

</section>

class
Docmgr

def
usexsl(pthxsl)

conxml=LibXML::XML::Document.string(@result)

conxsl=LibXML::XML::Document.file(pthxsl)

objxsl=LibXSLT::XSLT::Stylesheet.new(conxsl)

?手順（フロー）：simple.rb

cat
simple.xml
|
xsltproc
simple.xsl
-
>
simple.htm

?手順（フロー）：simple.sh
コンテンツ制作者にはあつかいにくい?面も

2014.01 ?/ ?アゼロス
対策＃２
ＨＴＭＬコーダーのスキルに馴染むこと：
サイト構築の実務で幅ひろく使えること：
??　テキストエディタとウェブブラウザを中?心に（ターミナル操作は最低限）
??　マークアップで書ける（学習コストが?小さい）
??　ＨＴＭＬテンプレートエンジンとして
??　ＣＳＳプリプロセッサとして
??　静的サイトジェネレータとして
??　軽量量コンテンツ管理理システム（ＣＭＳ）として
??　簡易易ウェブアプリケーション?フレームワークとして
ＸＭＬ／ＸＳＬを有効に使える補助ツールが必要

2014.01 ?/ ?アゼロス
構成
ＸＭＬ／ＸＳＬに、?入出?力力のフローを加える：
内容（データ）?　?　……?　ＸＭＬ
体裁（スタイル）?　……?　ＸＳＬT
?手順（フロー）?　?　……?　ＸＳＬＴ＋パイプライン
?
?
?


<section>


<p><xsl:value-of
select="con"/></p>

</section>

内容を読む
-->

体裁を適用
-->

結果を生成
-->

※?　パイプライン……パイプ（?入?力力／出?力力と流流れ）＋フィルタ（変換プログラム）
※?　ただしストリームではなく、?文字列列をベースにした疑似パイプライン
補助ツールで、?文書の変換?手順を書けるように

2014.01 ?/ ?アゼロス
解説
??　静的サイトジェネレータ
??　動的ウェブサイト
??　軽量量コンテンツ管理理システム＃１（?入?力力フォームの表?示）
??　軽量量コンテンツ管理理システム＃２（フォーム内容の書込）
??　軽量量コンテンツ管理理システム＃３（処理理の場合分け）
??　簡易易ウェブアプリ＃１（メールフォーム）
??　ＣＳＳプリプロセッサ
??　スタイルのライブラリ化
??　?文書要素のライブラリ化＃１（?小さめの要素）
??　?文書要素のライブラリ化＃２（あらゆる要素）
??　?文書モデルと関係モデルの分離離（オープンデータに備える）
??　デザインポリシーの?自動化（最新記事の?一覧）
??　異異種システムの統合（テンプレートのテンプレート）
??　静的サイトジェネレータ（記事キーによる?一括?生成）
??　?文書要素のライブラリ化＃３（総合：）
??　?文書要素のライブラリ化＄４（総合：?入出?力力のフロー含む）
??　簡易易ウェブアプリ＃２（ブログの基本動作）
??　保守性を?高める＃１（汎?用プログラミング?言語への移?行行）……Ruby版（他?言語にも対応：Haskell, ?JavaScript, ?Perl）
??　保守性を?高める＃２（データとその操作のカプセル化）
??　保守性を?高める＃３（ビューも定義しＭＶＣ２のかたちに）
ツールの使い?方を、記述例例をもとに解説

2014.01 ?/ ?アゼロス
静的サイトジェネレータ


<body>

<section>


<p><xsl:value-of
select="con"/></p>

</section>

</body>

内容を読む
-->

体裁を適用
-->

結果を生成
-->

2014.01 ?/ ?アゼロス
静的サイトジェネレータ


<body>

<section>


<p><xsl:value-of
select="con"/></p>

</section>

</body>


内容を読む
-->

体裁を適用
-->

結果を生成
-->

<body>

<section>


<p>代表の○○です。よろしくお願いいたします。</p>

</section>

</body>

結果（リザルト）：simple.htm
ページを１枚だけ、指定したファイル名で?生成。
データにスタイルを適?用し、ページを?生成。

2014.01 ?/ ?アゼロス
動的ウェブサイト


<body>

<section>


<p><xsl:value-of
select="con"/></p>

</section>

</body>

内容を読む
-->

体裁を適用
-->

<vox:dst>web:</vox:dst>

2014.01 ?/ ?アゼロス
動的ウェブサイト


<body>

<section>


<p><xsl:value-of
select="con"/></p>

</section>

</body>

?手順（フロー）：dynweb.xml

内容を読む
-->

体裁を適用
-->

結果を生成
-->

<body>

<section>


<p>代表の○○です。よろしくお願いいたします。</p>

</section>

</body>

結果（リザルト）：
データが変わったら、即座にサイトに反映。
?生成先を、ファイルからブラウザに変える。
これで静的サイトと動的サイトを使い分け。

2014.01 ?/ ?アゼロス

<body>

<form>

<p>代表挨拶：</p>

<textarea>

代表の○○です。よろしくお願いいたします。

</textarea>

<p><input
type="submit"></p>

</form>

</body>

軽量量コンテンツ管理理システム＃１（?入?力力フォームの表?示）


<body>

<form>


<textarea>

<xsl:value-of
select="con"/>

</textarea>

<p><input
type="submit"/></p>

</form>

</body>

?手順（フロー）：cmspre.xml
体裁（スタイル）：cmspre.xsl

内容を読む
-->

<vox:via>app:cmspre.xsl</vox:via>

結果を生成
-->

データを?入?力力フォームに表?示。
データの表?示先を、?入?力力フォームに変える。

2014.01 ?/ ?アゼロス

<body>

<form
method="post"
action="...">


<textarea
name="con">


</textarea>

<p><input
type="submit"></p>

</form>

</body>

軽量量コンテンツ管理理システム＃２（フォーム内容の書込）


<body>

<form
method="post"
action="...">


<textarea
name="con">

<xsl:value-of
select="con"/>

</textarea>

<p><input
type="submit"/></p>

</form>

</body>

?手順（フロー）：cmscmp.xsl
体裁（スタイル）：cmscmp.xsl

<vox:src>cgi:p</vox:src>

<vox:dst>set:simple.xml</vox:dst>

?入?力力フォームからのデータを書き込み。
?入?力力内容をデータファイルに書き込み。

2014.01 ?/ ?アゼロス

<body>

<form
method="post"
action="...?switch=modexe">


<textarea
name="con">


</textarea>

<p><input
type="submit"></p>

</form>

</body>

軽量量コンテンツ管理理システム＃３（処理理の場合分け）


<body>

<form
method="post"
action="...?switch=modexe">


<textarea
name="con">

<xsl:value-of
select="con"/>

</textarea>

<p><input
type="submit"/></p>

</form>

</body>

?手順（フロー）：cmscmp.xsl
体裁（スタイル）：cmscmp.xsl

<xsl:if
test=“/*/switch
=
'modpre'">

内容を読む
-->

<vox:via>app:cmspre.xsl</vox:via>

結果を生成
-->

</xsl:if>

<xsl:if
test=“/*/switch
=
'modexe'">

-->

<vox:dst>set:simple.xml</vox:dst>

</xsl:if>

場?面ごとに処理理を切切り分け。
?入?力力画?面の表?示とデータの書き込みで場合分け。
これで「代表挨拶」を更更新する簡易易ＣＭＳが完成。

2014.01 ?/ ?アゼロス

　次のお問い合わせがありました：

?メール：　xxx@yyy.zzz

?お名前：　山田花子

?ご要望：　御社の製品○○のカタログを送付いただけますか。

<form
method="post"
action="...">

<p>メール：<input
name="adr"/></p>

<p>お名前：<input
name="ttl"/></p>

<p>ご要望：<input
name="cmm"/></p>

<p><input
type="submit"/></p>

</form>

<xsl:output
method="text"/>

　次のお問い合わせがありました：

?メール：　<xsl:value-of
select="adr"/>

?お名前：　<xsl:value-of
select="ttl"/>

?ご要望：　<xsl:value-of
select="cmm"/>

内容（データ）：
?手順（フロー）：mailto.xsl
体裁（スタイル）：mailto.xsl

-->

<vox:via>app:mailto.xsl</vox:via>

<vox:dst>msg:</vox:dst>

?入?力力フォームの内容をメールで送付。
?入?力力内容にスタイルを適?用し、メールで送付。
簡易易ウェブアプリ＃１（メールフォーム）
スタイルの適?用結果を、テキスト形式で出?力力。

2014.01 ?/ ?アゼロス

.sample
{

padding:
0px
4px
0px
4px;

background-color:
#FFFFF;
color:
#000000;

}

ＣＳＳプリプロセッサ

<wdhidd>5</wdhidd>

<wdhlin>1</wdhlin>

<colcon>background-color:
#FFFFF;
color:
#000000;</colcon>



<xsl:output
method="text"/>

.sample
{

padding:
0px
<xsl:value-of
select="wdhidd
-
wdhlin"/>px

0px
<xsl:value-of
select="wdhidd
-
wdhlin"/>px;

<xsl:value-of
select="colcon"/>

}

内容（データ）：cssgen.xml
?手順（フロー）：cssgen.xml
体裁（スタイル）：cssgen.xsl

<vox:src>get:cssgen.xml</vox:src>

<vox:via>app:cssgen.xsl</vox:via>

<vox:dst>set:cssgen.css</vox:dst>

結果（リザルト）：cssgen.css
ＣＳＳの?自動計算／テンプレート化。
ＣＳＳファイルを?生成。
数値を計算するテンプレート。

2014.01 ?/ ?アゼロス

<body>

<header><p>ここはヘッダです。</p><header>

<section>...<p>ここはボディです。</p></section>

<footer><p>ここはフッタです。</p></footer>

</body>

スタイルのライブラリ化

<con>ここはボディです。</con>

<body>

<xsl:call-tamplate
name="htmhed"/>

<section>...<p><xsl:value-of
select="con"/></p></section>

<xsl:call-tamplate
name="htmfot"/>

</body>

<xsl:template
name="htmhed">

<header><p>ここはヘッダです。</p><header>

</xsl:template>

<xsl:template
name="htmfot">

<footer><p>ここはフッタです。</p></footer>

</xsl:template>

内容（データ）：sample.xml
?手順（フロー）：sample.xsl
体裁（スタイル）：sample.xsl

<vox:src>get:sample.xml</vox:src>

<vox:via>app:sample.xsl</vox:via>

<vox:dst>set:sample.htm</vox:dst>

結果（リザルト）：sample.htm
スタイルの要素に名前をつけてライブラリ化。
ひとかたまりのタグに名前をつけて、呼び出し。

2014.01 ?/ ?アゼロス

<body>

<p
class="prh001">この文は「ここが台詞」です。</p>

<p
class="prh001">この文は「ここが台詞で、<strong
class="str001">ここが強調です
</strong>」。</p>

</body>

?文書要素のライブラリ化＃１（?小さめの要素）

<p>この文は<w>ここが台詞</w>です。</p>

<p>この文は<w>ここが台詞で、<s>ここが強調です</s></w>。</p>

<body>

<xsl:apply-templates/>

</body>

<xsl:template
match="p">

<p
class="prh001"><xsl:apply-templates/></p>

</xsl:template>

<xsl:template
match="w">

「<xsl:apply-templates/>」

</xsl:template>

<xsl:template
match="s">

<strong
class="str001"><xsl:apply-templates/></strong>

</xsl:template>

体裁（スタイル）：sample.xml

内容を読む
-->

体裁を適用
-->

結果を生成
-->

結果（リザルト）sample.htm
?文書要素の、?比較的ちいさな単位（段落落、強調、など）をライブラリ化。
定義したスタイル（タグ）は?入れ?子にして使える。

2014.01 ?/ ?アゼロス

<body>

<header><p
class="prh001">ここはヘッダです。</p><header>

<section>

<h1>...</h1>

<p
class="prh001">この文は「ここが台詞」です。</p>

<p
class="prh001">この文は「ここが台詞で、<strong
class="str001">ここが強調で
す</strong>」。</p>

</section>

<footer><p
class="prh001">ここはフッタです。</p></footer>

</body>

?文書要素のライブラリ化＃２（あらゆる要素）

<hed><p>ここはヘッダです。</p></hed>

<con>

<p>この文は<w>ここが台詞</w>です。</p>

<p>この文は<w>ここが台詞で、<s>ここが強調です</s></w>。</p>

</con>

<fot><p>ここはフッタです。</p></fot>

<body>

<xsl:apply-templates/>

</body>

<xsl:template
match="hed">

<header<xsl:apply-templates/><header>

</xsl:template>

<xsl:template
match="fot">

<footer><xsl:apply-templates/></footer>

</xsl:template>

<xsl:template
match="con">

<section><h1>...</h1><xsl:apply-templates/></section>

</xsl:template>

体裁（スタイル）：sample.xml

内容を読む
-->

体裁を適用
-->

結果を生成
-->

結果（リザルト）sample.htm
?文書要素の、あらゆるレベルの単位（ヘッダ、フッタ、段落落、強調、など）をライブラリ化。
特定の規約に依存しない抽象的な?文書構造。
ＨＴＭＬだけでなく、ＥＰＵＢなどにも対応。

2014.01 ?/ ?アゼロス

<body>

<header><p

<section>

<h1>論文＃１</h1>

<p
class="prh001">著者：氏名＃１</p>

<p
class="prh001">内容：内容＃１</p>

</section>

<section>

<h1>論文＃２</h1>

<p
class="prh001">著者：氏名＃２</p>

<p
class="prh001">内容：内容＃２</p>

</section>

<footer><p

関係モデルと?文書モデルの分離離（オープンデータに備える）

<usr>

<key>usr001</key>

<ttl>氏名＃１</ttl>

</usr>

...

<pub>

<key>pub001</key>

<usr>usr001</usr>

<ttl>論文＃１</ttl>

<cmm>内容＃１</cmm>

</pub>

...


<xsl:apply-templates
select="pub"/>


<xsl:template
match="pub">

<xsl:variable
name="usr"><xsl:value-of
select="usr"/></xsl:variable>

<con>

<ttl><xsl:value-of
select="ttl"/></ttl>

<p>著者：<xsl:value-of
select="/*/usr[key
=
$usr]/ttl"/></p>

<p>内容：<xsl:value-of
select="cmm"/></p>

</con>

</xsl:template>

体裁（スタイル）：sample_?rel

内容を読む
-->

<vox:via>app:sample_rel.xsl</vox:via>

<vox:via>app:sample_doc.xsl</vox:via>

結果を生成
-->

結果（リザルト）：sample.xml
?文書の内容を?文書モデルと関係モデルに分離離。意味づけ（セマンティクス）をより具体化することで、オープンデータへも対応可。
スタイルを多段に適?用。

2014.01 ?/ ?アゼロス

<body>

<header><p

<section>

<h1>トップページの記事一覧</h1>

<ul>

<li>2045.01.01
-
<a
href="arc001.htm">記事＃１の表題</a></li>

<li>2045.01.02
-
<a
href="arc002.htm">記事＃２の表題</a></li>

</ul>

</section>

<footer><p

</body>

デザインポリシーの?自動化（最新記事の?一覧）

<arc>

<ttl>トップページの記事一覧</ttl>

<cmm><new
c="25"/></cmm>

</arc>

<arc>

<key>arc001</key>

<dat>2045.01.01</dat>

<ttl>記事＃１の表題</ttl>

<cmm>記事＃１の内容</cmm>

</arc>

...

<xsl:template
mode="modcon"
match="new">

<xsl:variable
name="cnt"
select="@c"/>

<ul>

mode="modnew"
select="/*/arc[potision()
<=
$cnt]">

<xsl:sort
select="dat"
order="descending"/>

</xsl:apply-templates>

</ul>

</xsl:template>

<xsl:template
mode="modnew"
match="arc">

<li>

<xsl:value-of
select="dat"/>
-

<a
href="{key}.htm"><xsl:apply-templates
mode="modcon"
select="ttl"/></a>

</li>

</xsl:template>


内容を読む
-->

体裁を適用
-->

結果を生成
-->

結果（リザルト）：sample.htm
デザインポリシーのうち＜最新記事を２５件表?示する＞というルールを、ひとつのタグにまとめる。
記事を?日時でソートし、
?日時と表題とリンクによる記事?一覧を?生成する。

2014.01 ?/ ?アゼロス

<body>

<header><p

<section>

<h1>記事一覧</h1>

<%=
link_to
"新規作成",
new_article_path
%>

<%
@articles.each
do
|article|
%>

<p>著作：<%=
article.title
%></p>

<p>著者：<%=
article.author
%></p>

<%=
simple_format(article.text)
%>

<hr/>

<%
end
%>

</section>

<footer><p

</body>

異異種システムの統合（テンプレートのテンプレート）


<con>

<ttl>記事一覧</ttl>

<arc
s="erb"><new>新規作成</new></arc>

</con>


<xsl:template
match="arc">

<xsl:if
test="@s
=
'erb'">

<![CDATA[

<%=
link_to
"]]><xsl:value-of
select="new"/><![CDATA[",
new_article_path
%>

<hr/>

<%
@articles.each
do
|article|
%>

<p>著作：<%=
article.title
%></p>

<p>著者：<%=
article.author
%></p>

<%=
simple_format(article.text)
%>

<%
end
%>

]]>

</xsl:if>

<xsl:if
test="@s
=
'...'">

...

</xsl:if>

</xsl:template>


内容を読む
-->

体裁を適用
-->

<vox:dst>set:sample.<xsl:value-of
select="@s"/></vox:dst>

各種ＣＭＳやワークフレームのテンプレートを?生成。
?生成するテンプレートの拡張?子は、
要素の属性で指定したものに。
使?用するテンプレートごとに場合分け。
タグは評価しないようデータセクションで括る。

2014.01 ?/ ?アゼロス

-
cat001

-
trd001.htm

-
cat002

-
trd002.htm

静的サイトジェネレータ（記事キーによる?一括?生成）

<settrd>

<colkey>trd001</colkey>

<colcat>cat001</colcat>

<colttl>表題＃１</colttl>

<colcon>内容＃１</colcon>

</settrd>

<settrd>

<colkey>trd002</colkey>

<colcat>cat002</colcat>

<colttl>表題＃２</colttl>

<colcon>内容＃２</colcon>

</settrd>

<xsl:variable
name="keytrd"><xsl:value-of
select="/*/keytrd"/></xsl:variable>

select="*/settrd[colkey
=
$keytrd]"/>

<xsl:template
match="/*/settrd">

<html>

<body>

<section>

<h1><xsl:value-of
select="colttl"/></h1>

<p><xsl:value-of
select="colcon"/></p>

</section>

</body>

</html>

</xsl:template>

内容（データ）：genpge.xml
?手順（フロー）：genpge.xsl
体裁（スタイル）：genpge.xsl

select="/*/settrd"/>

<xsl:template
match="/*/settrd">

<vox:src>tag:keytrd,<xsl:value-of
select="/*/colkey"/></vox:src>

<vox:src>get:genpge.xml</vox:src>

<vox:via>app:genpge.xsl</vox:via>

<vox:dst>

set:<xsl:value-of
select="/*/colcat"/>/

<xsl:value-of
select="/*/colkey"/>.htm

</vox:dst>

</xsl:template>

ページごとのキー／分類／表題／内容を記したデータから、該当のフォルダにページを?一括?生成。
繰り返しを明?示しなくても、
パターンマッチにより全ページが処理理。

2014.01 ?/ ?アゼロス
?文書要素のライブラリ化＃３（総合）

<root
xmlns="http://common.xoxxox.net/sample">

<page>


<header/>


<section>

<title>表題</title>

<p>段落<z>強調</z>段落</p>


</section>

<section>

<title>ニュース一覧</title>

<new_articles
number_of="25"/>


</section>

<section>

<title>組織一覧</title>

<company_organization/>


</section>

<section>

<title>サイトマップ</title>

<sitemap/>


</section>

<footer/>


</page>

<header>○○社ウェブサイト</header>


<footer>○○社</footer>


<division
key="org001">


<name>第１事業部</name>

<phone>3-NNN-NNNN</phone>

<office
key="loc001"/>

</division>

<office
key="loc001">


<name>第１事業所</name>


<location>東京都　中央区　○○○</location>

</office>

<article
key="arc001">


<date>2045-01-01<date>

<title>表題＃１</title>

<comment>内容＃１</comment>

</article>

</root>

ウェブサイトで使うすべてのデータをタグとして定義し、デザインガイドラインをふくめ定型化。

2014.01 ?/ ?アゼロス
?文書要素のライブラリ化＃４（総合：?入出?力力のフロー含む）

<root
xmlns="http://common.xoxxox.net/sample">

<page
key="pge001">


<section>

<title>表題</title>

<p>段落<z>強調</z>段落</p>


</section>

<section>

<title>ニュース一覧</title>

<new_articles
number_of="25"/>


</section>

</page>

<page
key="pge002">

<section>

<title>組織一覧</title>

<company_organization/>


</section>

</page>

<page
key="pge003"
generate="dynamic">


<section>

<title>お問い合わせ</title>

<mailform
inquiry="inq001"/>


</section>

</page>

<header>○○社ウェブサイト</header>


<footer>○○社</footer>


<division
key="org001">


<name>第１事業部</name>


<office
key="loc001"/>

</division>

<office
key="loc001">


<name>第１事業所</name>


<location>東京都　中央区　○○○</location>

</office>

<article
key="arc001">


<date>2045-01-01<date>

<title>表題＃１</title>

<comment>内容＃１</comment>

</article>

<inquiry
key="inq001">


<mail_address
label="メール"
type="..."/>

<user_name
label="お名前"
type="..."/>

<comment
label="ご要望"
type="..."/>

</inquiry>

</root>

ウェブサイトで使うすべてのデータとルールをタグとして定義し、デザインガイドラインをふくめ定型化。

2014.01 ?/ ?アゼロス
簡易易ウェブアプリ＃２（ブログの基本動作）

<entity>

<colkey>setarc_001</colkey>

<colttl>あいうえお</colttl>

<colcon>かきくけこ</colcon>

</entity>

...

<entity>


<colttl>さしすせそ</colttl>

<colcon>たちつてと</colcon>

</entity>

...

<xsl:if
test="$thread
=
'conarc'">

<p>キー:
<xsl:value-of
select="/*/colkey"/></p>

<p>表題:
<xsl:value-of
select="/*/colttl"/></p>

<p>内容:
<xsl:value-of
select="/*/colcon"/></p>

</xsl:if>

...

<xsl:if
test="$thread
=
'addpre'">

<form
method="post"
action="{$urlprg}?switch=modexe">

<p>キー:
<input
name="colkey"
value="setarc_"/></p>

<p>表題:
<input
name="colttl"
value=""/></p>

<p>内容:
<input
name="colcon"
value=""/></p>

<p><input
type="submit"/></p>

</form>

</xsl:if>

...

?手順（フロー）：
体裁（スタイル）：

<xsl:if
test="$switch
=
'addpre'">

<vox:prc>

<vox:src>tag:thread,addpre</vox:src>

<vox:via>app:genfrm.xsl</vox:via>

<vox:dst>web:</vox:dst>

</vox:prc>

</xsl:if>

...

<xsl:if
test="$switch
=
'modpre'">

<xsl:variable
name="keyarc"><xsl:value-of
select="/*/keyarc"/></xsl:variable>

<vox:prc>

<vox:src>get:<xsl:value-of
select="$keyarc"/>.xml</vox:src>

<vox:src>tag:thread,modpre</vox:src>

<vox:via>app:genfrm.xsl</vox:via>

...

記事の?一覧／表?示／追加／変更更／削除を?行行う。
画?面遷移ごとの処理理を書くことで、
複雑なアプリケーションを作成できる。

2014.01 ?/ ?アゼロス
保守性を?高める＃１（汎?用プログラミング?言語への移?行行）

<entity>




</entity>

...

<entity>




</entity>

...

<xsl:if
test="$thread
=
'conarc'">

<p>キー:
<xsl:value-of

<p>表題:
<xsl:value-of

<p>内容:
<xsl:value-of

</xsl:if>

...

<xsl:if
test="$thread
=
'addpre'">

<form
method="post"

<p>キー:
<input
name="colkey"

<p>表題:
<input
name="colttl"
value=""/></p>

<p>内容:
<input
name="colcon"
value=""/></p>

<p><input
type="submit"/></p>

</form>

</xsl:if>

...


docmgr=Docmgr.new

...

if
switch
==
'addpre'
then

docmgr.tagxml('thread','addpre').

appxsl('genfrm.xsl').

outweb('h')

end

...

if
switch
==
'modpre'
then

keyarc=docmgr.getcgi('g').docxml.appxph('/*/keyarc/text()').firsts

docmgr.cnnxml(

{xml:docmgr.getfil("#{keyarc}.xml").export},

{xml:docmgr.tagxml('thread','modpre').export}).

appxsl('genfrm.xsl').

outweb('h')

...

?手順（フロー）の記述を、汎?用プログラミング?言語に移?行行（データとスタイルは変更更なし）。
フローの記述が増えてメンテしにくくなったら、
汎?用プログラミング?言語への移?行行を推奨。

2014.01 ?/ ?アゼロス
保守性を?高める＃２（データとその操作のカプセル化）

<entity>




</entity>

...

<entity>




</entity>

...

<xsl:if
test="$thread
=
'conarc'">

<p>キー:
<xsl:value-of

<p>表題:
<xsl:value-of

<p>内容:
<xsl:value-of

</xsl:if>

...

<xsl:if
test="$thread
=
'addpre'">

<form
method="post"

<p>キー:
<input
name="colkey"

<p>表題:
<input
name="colttl"
value=""/></p>

<p>内容:
<input
name="colcon"
value=""/></p>

<p><input
type="submit"/></p>

</form>

</xsl:if>

...


<xsl:if
test="/*/switch
=
'conarc'">

<vox:prc>

<vox:src>import($setarc.select('<xsl:value-of
select="/*/keyarc"/>'))

</vox:src>

<vox:src>tag:thread,conarc</vox:src>

<vox:via>app:xsl/genarc.xsl</vox:via>


</vox:prc>

</xsl:if>

...

<xsl:if
test="/*/switch
=
'modexe'">

<vox:prc>

<vox:src>cgi:p</vox:src>

<vox:dst>cnvhsh.sndobj($setarc,'update')</vox:dst>

</vox:prc>

</xsl:if>

データとその操作をオブジェクトによりカプセル化し、コードを保守しやすいようにする。
汎?用プログラミング?言語でオブジェクトを定義し、
それらのメソッドをフローの中で使?用。

2014.01 ?/ ?アゼロス
保守性を?高める＃３（ビューも定義しＭＶＣ２のかたちに）

<entity>




</entity>

...

<entity>




</entity>

...

<xsl:if
test="$thread
=
'conarc'">

<p>キー:
<xsl:value-of

<p>表題:
<xsl:value-of

<p>内容:
<xsl:value-of

</xsl:if>

...

<xsl:if
test="$thread
=
'addpre'">

<form
method="post"

<p>キー:
<input
name="colkey"

<p>表題:
<input
name="colttl"
value=""/></p>

<p>内容:
<input
name="colcon"
value=""/></p>

<p><input
type="submit"/></p>

</form>

</xsl:if>

...


<xsl:if
test="/*/switch
=
'conarc'">

<vox:prc>

<vox:src>import($setarc.select('<xsl:value-of
select="/*/keyarc"/>'))

</vox:src>

<vox:src>tag:thread,conarc</vox:src>

<vox:via>app:xsl/genarc.xsl</vox:via>


</vox:prc>

</xsl:if>

...

<xsl:if
test="/*/switch
=
'modexe'">

<vox:prc>

<vox:src>cgi:p</vox:src>

<vox:dst>cnvhsh.sndobj($setarc,'update')</vox:dst>

</vox:prc>

</xsl:if>

ウェブアプリケーションの場合は汎?用プログラミング?言語でビューも定義し、保守性をより?高める。
このときＸＳＬＴによるフローは、
ビューとモデルを呼び出すコントローラに。

2014.01 ?/ ?アゼロス
解説
??　シングルソース?パブリッシング、テキストの共有（マークダウン向け、携帯端末向け）
??　シングルソース?パブリッシング、スタイルの共有（?日英サイト）
??　オープンデータ対応（ＲＤＦ、構造化データ）
??　ページ単位からアーティクル（記事）単位への転換（マルチカテゴリ、など）
??　デザインポリシーの?自動化（サイトマップ?生成）
??　異異種システムの統合（データ形式の変換）
??　その他、アイデア次第
このほか、次のようなことにも：

2014.01 ?/ ?アゼロス
特徴
安定性?　……?　??長期に渡って使える（Ｗ３Ｃの標準仕様、コ
ミュニティやプロダクト依存でない）
表現?力力?　……?　ウェブ?文書要素のライブラリ化（あらゆる粒粒
度度の?文書ライブラリ、デザインポリシーの?自動化、独?自の?文
書構造、ページ単位からの脱却、?文書モデルと関係モデルの
分離離）、シングルソース?パブリッシング、異異種システムの
統合
保守性?　……?　学習コストが?小さい（すべての記述がマーク
アップ、スタイルと?入出?力力フローのコードが同じ）、コード
の抽象性、汎?用プログラミング?言語への移?行行可
●
●
●
ＸＭＬ／ＸＳＬ＋パイプラインは柔軟で安定的

2014.01 ?/ ?アゼロス
背景／制約
たくさんのフレームワークとフォーマットが提供されるなか、
できるだけ標準に準拠したものもあっていい
異異種ＣＭＳやフレームワーク間の＜のりづけ＞として使える
ものも必要（統合のための上位階層のツール）
すべてをＷ３Ｃ標準のＸＭＬ／ＸＳＬでやるべき、というこ
とではない（速度度の問題、など）
フローの記述が複雑になったら、汎?用プログラミング?言語へ
の移?行行も（オブジェクトや型クラスを使って保守性を向上）
●
●
※
※
ツールの向き／不不向きを知って適切切な利利?用を

狠狠撸

Docmgt_002

Recommended

More Related Content

Similar to Docmgt_002 (20)

Docmgt_002