Twigの構文まとめ!初心者でもわかる変数出力・フィルター・制御構文の使い方
生徒
「Twigって、どうやって変数とか条件分岐を使うんですか?」
先生
「Twigには、変数の出力や条件分岐、繰り返し処理などを行うための構文がそろっています。」
生徒
「構文っていうのが難しそうです…。初心者でも理解できますか?」
先生
「もちろんです。これから、Twigの基本構文をひとつずつ、やさしく解説していきますね!」
1. Twigの構文とは?
Twigの構文とは、テンプレート内で特定の命令を行うための書き方のルールのことです。たとえば、「この変数を表示したい」「ある条件のときだけ表示したい」「繰り返し表示したい」といった処理を、Twig構文で簡単に書くことができます。
Twig構文には以下の3つがよく使われます:
- 変数出力(値を表示)
- フィルター(値を加工)
- 制御構文(条件分岐や繰り返し)
2. Twigの変数出力の書き方
まずはTwigの中で変数を表示する方法を学びましょう。Twigでは、変数の出力に{{ }}を使います。これは「この中にある値を表示してください」という意味です。
例として、名前を表示してみましょう。
<p>こんにちは、{{ name }}さん!</p>
このコードでは、nameという変数の中に「たろう」が入っていれば、画面には次のように表示されます。
こんにちは、たろうさん!
このように、Twigでは{{ }}を使って、どこにでも変数の値を差し込むことができます。
3. Twigのフィルター(filter)とは?
フィルターは、変数の中のデータを加工(かこう)するためのTwigの機能です。フィルターを使うと、「すべて小文字にする」「文字数を数える」などの処理が簡単にできます。
フィルターは|(パイプ)を使って書きます。パイプは、「この変数に○○の処理をしてください」という意味です。
すべて大文字に変換(upper)
{{ name|upper }}
最初の1文字だけ大文字に(capitalize)
{{ name|capitalize }}
文字の長さを表示(length)
{{ name|length }}
フィルターを使うと、Twigテンプレートの中で簡単に見た目や内容を調整できます。
4. Twigの制御構文とは?
制御構文とは、「条件によって表示するか決める」や「複数のデータを順番に表示する」など、表示内容を制御する仕組みです。よく使う制御構文はif文とfor文です。
4-1. if文(条件分岐)
if文は、「ある条件が正しければ、そのときだけ表示する」という処理です。
{% if age >= 20 %}
<p>成人です</p>
{% else %}
<p>未成年です</p>
{% endif %}
この例では、ageが20以上なら「成人です」と表示され、それ以外なら「未成年です」と表示されます。
4-2. for文(繰り返し処理)
for文は、配列(リスト)などの複数のデータを順番に取り出して、繰り返し表示するときに使います。
<ul>
{% for fruit in fruits %}
<li>{{ fruit }}</li>
{% endfor %}
</ul>
fruitsに「りんご」「みかん」「バナナ」が入っていれば、次のように表示されます。
<ul>
<li>りんご</li>
<li>みかん</li>
<li>バナナ</li>
</ul>
このように、Twigの制御構文を使うと、状況に応じて表示内容を切り替えたり、リストを自動で並べたりできます。
5. Twig構文を使った応用例
ここまでの内容を使えば、Twigでちょっとした画面の制御ができるようになります。例えば、次のように「こんにちは」+名前+メッセージというような構成を作ることもできます。
<p>
{% if name %}
こんにちは、{{ name|capitalize }}さん!
{% else %}
名前が登録されていません。
{% endif %}
</p>
このコードでは、nameという変数があるときは「こんにちは、○○さん!」と表示し、なければ「名前が登録されていません」と表示します。
6. Twig構文でよくあるエラーと注意点
Twigでは、構文(書き方)が正しくないとエラーになります。たとえば、{% endif %}を忘れたり、{{ name }}を{ name }のように間違えたりすると、画面にエラーが出てしまいます。
Twigの構文は、「波かっこ({{ }})」や「ブロック({% %})」の組み合わせで動いていることをしっかり覚えておきましょう。
{{ 変数 }}→ 表示用(出力){% 処理 %}→ 制御用(命令){# コメント #}→ メモ用(表示されない)
これらをきちんと区別して書けば、Twigテンプレートはとても強力で便利なツールになります。
まとめ
この記事では、Twigの基本構文について、初心者の方でも無理なく理解できるように、変数出力・フィルター・制御構文を中心に解説してきました。Twigは、SymfonyをはじめとしたPHPフレームワークで広く使われているテンプレートエンジンであり、HTMLの中に動的な処理を安全かつ分かりやすく書ける点が大きな特徴です。画面表示に関する処理をTwigに任せることで、プログラムの役割分担が明確になり、読みやすく保守しやすいコードを書くことができます。
まず重要なのが、Twigの「構文の種類」を正しく理解することです。Twigでは、変数を表示するための構文、値を加工するためのフィルター、条件分岐や繰り返しを行う制御構文が明確に分かれています。このルールを理解しておくことで、「これは表示用」「これは処理用」と自然に書き分けられるようになります。特に、二重波かっこで囲む変数出力と、パーセント付きのブロック構文の違いは、Twigを使ううえで最初に覚えておきたいポイントです。
変数出力では、コントローラから渡された値を、そのままHTMLの中に埋め込むことができます。Twigは自動でエスケープ処理を行うため、初心者でも比較的安全に値を表示できる点も安心材料です。名前や年齢、メッセージなど、画面に表示したい情報をシンプルに書けるため、テンプレートの可読性が大きく向上します。
フィルターの使い方を覚えることで、Twigの表現力は一気に広がります。文字を大文字に変換したり、最初の一文字だけを整えたり、文字数を数えたりといった処理を、テンプレート内で簡単に行えるのは大きなメリットです。こうした加工をコントローラ側で行わず、Twigで表現できるようになると、表示に関する調整がとても楽になります。
制御構文では、if文やfor文を使って表示内容を切り替えたり、リストを繰り返し表示したりできることを学びました。条件によってメッセージを変えたり、配列の要素を順番に並べたりする処理は、実際のWeb画面では非常によく使われます。Twigの制御構文はHTMLに近い形で書けるため、プログラムが苦手な方でも視覚的に理解しやすいのが特徴です。
また、Twig構文でよくあるエラーや注意点についても確認しました。波かっこやブロックの閉じ忘れといったミスは、初心者がつまずきやすいポイントです。しかし、構文の役割を意識して書くようになれば、エラーは自然と減っていきます。表示用、制御用、コメント用という役割を正しく使い分けることが、Twigを上手に使いこなすコツと言えるでしょう。
Twigは、単なるテンプレートエンジンではなく、画面表示を整理し、アプリケーション全体の品質を高めてくれる重要な存在です。今回学んだ基本構文をしっかり身につけることで、SymfonyやPHPを使ったWeb開発が、より楽しく、より分かりやすいものになります。まずは小さなテンプレートからで構いませんので、Twigの構文を実際に書きながら慣れていきましょう。
<p>
{% if name %}
こんにちは、{{ name|capitalize }}さん!
{% else %}
名前が登録されていません。
{% endif %}
</p>
このサンプルでは、Twigの変数出力、フィルター、if文を組み合わせて表示を制御しています。値が存在するかどうかで表示内容を切り替える処理は、実際の画面でも頻繁に使われます。Twig構文を組み合わせることで、柔軟な画面表示が実現できることが分かります。
生徒:Twigの構文って難しそうだと思っていましたが、役割ごとに分かれていて分かりやすいですね。
先生:そうですね。表示と処理を分けて考えるのがTwigの基本です。
生徒:変数の出力やフィルターを使うだけでも、画面の表現がかなり変わるのが面白いです。
先生:表示の調整をTwigに任せられるようになると、コントローラもスッキリしますよ。
生徒:if文やfor文もHTMLの中で自然に書けるのが助かります。
先生:Twigは初心者にもやさしい設計なので、安心して使ってください。
生徒:これからは、Twigを使って画面を作るのが楽しくなりそうです。
先生:その気持ちが大切です。基本構文をしっかり押さえて、どんどん使っていきましょう。