元Webデザイナー兼コーダーの備忘録

ウェブデザインやプログラミング、ブログのカスタマイズなどについてアウトプットしています。

 メニュー

» HTML入門のまとめはこちらです。

【mustache入門:Ruby版】データの埋め込み

mustacheの基本的な記述を見ていきます。まず、データファイルとテンプレートファイルを用意します。データファイルにデータを、テンプレートファイルにテンプレートを記述します。mustacheコマンドでデータがテンプレートに埋め込まれることを確認します。

作成するファイル

  • データファイル:data.yml
  • テンプレートファイル:template.mustache

データファイルとテンプレートファイルを以下のように作成します。

#data.yml(データの記述)
name: hoge
id: 1

YAMLでは、#コメントアウトします。

{{! template.mustache(テンプレートの記述) }}
- {{name}}
- {{id}}

テンプレートファイルでは、{{! }}コメントアウトします。

データの埋め込みの確認

mustacheコマンドを実行して、データがテンプレートに埋め込まれるかを確認します。

mustache data.yml template.mustache
- hoge
- 1

コマンドを実行すると{{name}}がhoge、{{id}}が1に置き換わっていることが確認できると思います。

まとめ

今回、ご紹介した書き方が基本形です。まずは、基本形をしっかりと理解します。

参考サイト

» HTML入門のまとめはこちらです。