Help us understand the problem. What is going on with this article?

Twig を使ってみる

More than 5 years have passed since last update.

Twig は PHP のテンプレートエンジン。ちょっと前までは PHP のテンプレートエンジンといえば Smarty なもんだと思っていたら、最近は Twig がよいと聞くので触ってみることにしました。

composer をインストールする

composer とは、PHPのパッケージの依存関係やバージョン管理を行う仕組み だそうです。公式サイトのインストール手順は composer コマンドを使った説明になってるので、これに従って、まず先に composer をインストールします。

参考: http://d.hatena.ne.jp/brtRiver/20120610/1339350390

composer も Twig も、プロジェクト個別にインストールして使うことができます。この例では、twigTest という適当なディレクトリを作って、その中にインストールしています。

command
$ mkdir ./twigTest
$ cd ./twigTest/
$ curl -s http://getcomposer.org/installer | php
output
#!/usr/bin/env php
All settings correct for using Composer
Downloading...

Composer successfully installed to: /{$currentDir}/composer.phar
Use it: php composer.phar

この結果、カレントディレクトリに composer.phar がインストールされます。

Twigをインストールする

command
$ php composer.phar require twig/twig:1.*
output
./composer.json has been updated
Loading composer repositories with package information
Updating dependencies (including require-dev)
  - Installing twig/twig (v1.15.0)
    Downloading: 100%         

Writing lock file
Generating autoload files

これを実行すると、カレントディレクトリに composer.jsoncomposer.lock というファイルと合わせて vendor というディレクトリが作成されます。その中に、composer や twig に関するファイルがたくさん生成されます。

これでインストールは終了です。

Twigを使う

公式サイトにあるサンプルコードを動かしてみます。
カレントディレクトリに test.php を作って、そこに下記の実装をします。

twigTest/test.php
<?php
require_once './vendor/autoload.php';

$loader = new Twig_Loader_String();
$twig = new Twig_Environment($loader);

echo $twig->render('Hello {{ name }}!', array('name' => 'Fabien'));
?>

この実装例はシンプルなもので、テンプレートは、 $twig->render() に、文字列として渡されているもの 'Hello {{ name }}!' がそれです。第2引数はバインドする変数で、連想配列として渡しています。

出力結果は次のようになりました。

output
Hello Fabien!

連想配列のキー name に対応する値が、テンプレート中の {{ name }} 部分に置き換えられて出力されています。

とりあえず、基本的な使い方で動かすことができました。

基本的な機能をいくつか使ってみる

簡単に動かすことができたので、基本的な機能のいくつかを試してみようと思います。

エスケープして出力

デフォルトの設定では、autoescapeがオンになっているそうで、何もしないとHTML特殊文字がエスケープされて出力されます。

test.php
<?php
require_once './vendor/autoload.php';
$loader = new Twig_Loader_String();
$twig = new Twig_Environment($loader);

echo $twig->render('{{html}}', array('html' => '<p>Hello World</p>'));
?>
output
&lt;p&gt;Hello World&lt;/p&gt;

明示的にエスケープする場合、|e または |escape をつけます。
※以下、$twigのロード部分は省略します。

test.php
echo $twig->render('{{html|e}}', array('html' => '<p>Hello World</p>'));
output
&lt;p&gt;Hello World&lt;/p&gt;

HTML以外の言語のエスケープをしたい場合、escape の引数に言語の名前を指定します。

test.php
echo $twig->render('{{src|escape("html")}}', array('src' => '<p>Hello World!</p>'))."\n";
echo $twig->render('{{src|escape("js")}}', array('src' => 'document.write("Hello World");'))."\n";
echo $twig->render('{{src|escape("css")}}', array('src' => 'body{background-color:#eee;}'))."\n";
echo $twig->render('{{src|escape("url")}}', array('src' => 'http://www.pxt.jp/'))."\n";
echo $twig->render('{{src|escape("html_attr")}}', array('src' => 'attr="Hello World"'))."\n";
output
&lt;p&gt;Hello World!&lt;/p&gt;
document.write\x28\x22Hello\x20World\x22\x29\x3B
body\7B background\2D color\3A \23 eee\3B \7D 
http%3A%2F%2Fwww.pxt.jp%2F
attr&#x3D;&quot;Hello&#x20;World&quot;

エスケープしないで出力

あえてHTMLなどをそのままソースに出力したい場合は、`|raw' で戻すことができます。

test.php
echo $twig->render('{{html|raw}}', array('html' => '<p>Hello World</p>'));
output
<p>Hello World</p>

連想配列の値を表示

test.php
echo $twig->render('{{val.key2}}', array('val' => array('key2'=>'Hello World1')))."\n";
echo $twig->render('{{val["key2"]}}', array('val' => array('key2'=>'Hello World2')))."\n";
output
Hello World1
Hello World2

オブジェクトへのアクセス

test.php
<?php
$obj = new stdClass();
$obj->val = 'Hello World';
echo $twig->render('{{obj.val}}', array('obj' => $obj))."\n";
?>
output
Hello World

オブジェクトのメソッドにアクセスする場合も、ドットシンタックスで辿るようです。次の例は Pickles Framework$px オブジェクトのメソッドをコールする例。

test.php
echo $twig->render('<a href="{{px.theme().href("/")}}">link</a>', array('px' => $px))."\n";

その他の使い方

公式のドキュメントを参考にいろいろやってみましょう。

参考: http://twig.sensiolabs.org/doc/templates.html

まとめ

Twig の Twig らしいところまでは体験できていないけど、基本的な動作の確認はできた。

いろんなサイトで調べると、テンプレートの継承ができる機能が醍醐味らしい。
でも、今日は眠いのでここまで、またいずれ続きをやってみたいと思います。

※この記事はこちらにアーカイブしました。→ http://www.pxt.jp/ja/diary/article/288/

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした