口ひげ(テンプレートシステム)

ウェブページ用のテンプレートシステム
口ひげ
原作者ジャスティン・ハイルマン、ブルーノ・スーティク、クリス・ワンストラス、リカルド・メンデス、ブルーノ・ミシェル
初回リリース2009年; 17年前 (2009)
安定版リリース
4.2.0 / 2021年3月28日; 4年前 (2021-03-28)
リポジトリ
  • github.com/mustache/mustache
書かれたJavaScript
タイプWebテンプレートシステム
ライセンスマサチューセッツ工科大学
Webサイトマスタッシュ.github.io

Mustacheはウェブテンプレートシステムです。条件文ループなどの明示的な制御フローがないため、ロジックレスシステムと呼ばれます。ただし、ループと条件評価は、セクションタグ、リスト処理、および匿名関数(ラムダ)を使用することで実現できます。「Mustache」という名前は、横向きの口ひげに似た中括弧( , )を多用していることから付けられました。Mustacheは主にモバイルアプリケーションとウェブアプリケーションで使用されます。[1] [2]ifelse { }

実装は、 ActionScriptC++ClojureCoffeeScriptColdFusionCommon LispCrystalDDartDelphiElixirErlangFantomGoHaskellIoJavaJavaScriptJuliaLua.NETObjective-COCamlPerlPHPPharoPythonRRacketRakuRubyRustScalaSmalltalkSwiftTclCFEngine、およびXQuery で利用できます。

歴史と原則

Mustache-1はctemplateとet [3]に触発され、 2009年末にGitHubディストリビューションとして開発が始まりました。テンプレートエンジンの最初のバージョンはRubyで実装されYAMLテンプレートテキストを実行していました。(維持されている)主要原則は以下のとおりです。

  • ロジックレス: 明示的な制御フロー ステートメントはなく、すべての制御はデータによって駆動されます
  • 強力な関心の分離: ロジックとプレゼンテーション: テンプレートにアプリケーション ロジックを埋め込むことはできません。

入力データはクラスとして扱うことができるため、モデル・ビュー・コントローラ(MVC)ビューとして特徴付けることができます。Mustacheテンプレートは、(入力データの)ビュー内のメソッドを参照するだけです[3]すべてのロジック、決定、コードはこのビューに含まれ、すべてのマークアップ(例:出力XML )はテンプレートに含まれますモデル・ビュー・プレゼンター(MVP)コンテキストでは、入力データはMVPプレゼンターから取得され、MustacheテンプレートはMVPビューとなります。

データ

JSONデータをMustacheテンプレートに入力すると、出力が生成されます。以下にデータの例を示します。

{ 
"name" : "World" , "より大きい" : ">" }     
     

変数

以下のような単純な Mustache テンプレートを上記のデータと組み合わせると、次のように出力されますHello World

こんにちは、{{ name }}

Mustache HTMLはデフォルトでデータを エスケープします。例えば、以下のコードは のようにレンダリングされます2 > 1

2 {{より大きい } } 1

エスケープを無効にするには、 を使用します&。以下は と表示されます2 > 1

2 {{ &より大きい } } 1

if文とforeachループ

以下はセクションタグ付きのテンプレートです。がブールx値の場合、セクションタグはif条件文のように動作します。が配列の場合、 foreach ループのように動作しますx

{{ #x }}
テキスト
{{ /x }}

特殊変数は、{{.}}配列をループするときに現在の項目、または条件でチェックされる項目を参照します。

他のテンプレートを含める

シンボルを使用して、Mustache テンプレートに別の Mustache テンプレートを読み込むように指示できます>

<form> 
{{ >テキストボックス}} {{ >送信ボタン}} </form>    
    

コメント

コメントは感嘆符を使用して示されます。

{{!コメントはここに記入してください}}

技術的な詳細

構文の強調表示はAtomCodaEmacs[4] TextMateVimVisual Studio Codeで利用できます[5]

Mustacheテンプレートのサポートは、多くのWebアプリケーションフレームワーク(例:CakePHPに組み込まれています[要出典] 。JavaScriptのサポートには、 jQueryDojoYUIなどの多くのJavaScriptライブラリAjaxフレームワークを使用したクライアントサイドプログラミングとNode.jsCommonJSを使用したサーバーサイドJavaScriptの両方が含まれます

仕様と実装

利用可能なMustache エンジン実装は多数あり、それらはすべて共通の形式仕様(外部リンクを参照) を満たしており、最終ユーザーにとっては共通の構文になります。

2011年3月時点での最新のSPEC_VERSIONは1.1.2でした。[6]

v1.X アーキテクチャのすべてのMustache エンジンには、レンダリングメソッド、Mustache_Compilerクラス、およびParserクラスがあります。[引用が必要]

バリエーションと派生

Mustache は、オリジナルのシンプルさから派生して特定の機能や用途を追加した数多くの JavaScript テンプレート ライブラリに影響を与えました。[引用が必要]

ハンドルバー

Handlebars.js [7]は次のように説明されています。

Handlebars.jsは、Chris Wanstrathによって作成されたMustacheテンプレート言語の拡張です。Handlebars.jsとMustacheはどちらもロジックレスのテンプレート言語であり、ビューとコードを分離した構造を維持しています。[8]

Handlebars が以前のバージョンと異なるのは、ブロック式(Mustache のセクションに類似) 内で、ヘルパーによってそのブロックの明示的なユーザー記述コードを通じてカスタム関数が許可される場合です。

参照

参考文献

  1. ^ アヴォラ、G.ラーシュ、J. (2012)。モバイル Web 開発を破壊するISBN 9781118348123
  2. ^ Cady, J. (2011). Web開発テンプレートへの関数型プログラミングの適用:MS Projectレポート(PDF) (レポート).
  3. ^ ab "Mustache". GitHub . 2022年4月19日.
  4. ^ 「ホーム」. web-mode.org .
  5. ^ 「Mustache - Visual Studio Marketplace」Visualstudio.com . Microsoft. 2019年8月18日.
  6. ^ 「変更点」Mustache.GitHub .2011年3月20日。
  7. ^ Katz, Yehuda (2011–2019). 「Handlebars: ステロイドによる最小限のテンプレート化」Handlebarsjs.com
  8. ^ wykatz, NPM. 「html+handlebars NPM」. html+handlebars NPM パッケージの詳細. Node Package Manager . 2016年12月20日閲覧
  • 公式サイト
  • GitHubの Mustache
Retrieved from "https://en.wikipedia.org/w/index.php?title=Mustache_(template_system)&oldid=1317282117"