[Codeigniter] Smartyを使わずにテンプレートパーサーだけでhtmlコーダーと協業する方法

2014年7月4日

スクリーンショット 2015-02-21 16.11.53

こんにちは、榊原です。素材サイトみてたら、海いきたいなと思って貼り付けただけなので、写真は全く関係ないです。
 
小ネタ的な記事ですが、Codeigniterのテンプレートパーサーの隠しコマンドのお話です。

htmlコーダーとの協業を考える

システムを組んでてMVCというか、Viewを切り分けることができたら、誰にView部分の仕事を振って分業しようかを考える人は多いと思います。少なくても決して私だけではないかと。
 
少なくても、近年の単価でいうと、「プログラミング > htmlコーディング」なわけですから、作業が同工数ぐらいだとするとhtmlコーディングを先に外注に出す方が、外注単価は低くなります。10倍ぐらい単価違いんじゃないかな。
 
といっても、htmlコーダーな人はWordpressのテンプレートですらさわるのが嫌でhtmlコーディングの枠で仕事をしている人が多いです。もちろん、デザイナーも兼ねていたり、「レシポンシブ対応!」「HTML5で書いて、IE7まで対応します!」的な価値を持っている人が多いですが。
で、そういった人に、phpガリガリなViewを渡して「あとはよろしくやっておいて!」というのは無理です。やはりそういったアレルギー的反応をする人にも作業してもらえるように環境を揃える必要があります。
 

Codeigniterのテンプレートパーサー

で、そういった人のためにCodeigniterではテンプレートパーサー機能を積んでいます。

<html>
<head>
<title>{blog_title}</title>
</head>
<body>

<h3>{blog_heading}</h3>

{blog_entries}
<h5>{title}</h5>
<p>{body}</p>
{/blog_entries}
</body>
</html>

 
まぁ、こんな感じでphpを書いたら、{}部分を置き換えてViewとして出力しますよ、という機能です。
普通の変数と連想配列を用いたloop文に対応していまして。まぁ、最低限はできるかな、という感じ。(公式ページ
しかしながら、私的にhtmlコーダーと協業するための必須機能が2つありまして
 

  • Viewファイルはhtmlファイル
  • 置き換え文字は{}ではなく<!– –>を使う

 
前者は、そもそもMAMP(もしくはXAMP)をhtmlコーダーにインストールを求めることが現実的でないからです。phpはサーバ内でしか動かないわけですから、拡張子はhtmlでなければなりません。
後者は、画像パスの先頭部に{}が入ってると、その画像が表示されなくなるからです。絶対パスで指定したい時のためです。
 
Smartyに代表されるテンプレートエンジンはマニュアルみているとこういったことは当たり前のようにできました。
しかしですね。さすが専用テンプレートエンジンだけあっていろいろと機能を積んでいて魅力的ではあったのですが、{}を使ってif文がかけます!であったり、変数内の文字数が数えれます!であったり、{}でくくってPHPを書けますであったり、そんなことPHPでやれって内容ばかりでして、いまいちこちらには惹かれない。
 
 

Codeigniterのテンプレートパーサー隠し機能

で、もう仕方ないから基幹システム書き換えるかー、と思っていろいろ潜ってみたのですが、結論からいうと両方標準機能で実装できました。ただただ、公式ドキュメンテーションにも乗ってなかっただけで。
 

1.Viewファイルはhtmlファイルで読み込む

こちらですが、調べてみるとただViewの呼び出しに拡張子つけたら終わりでした。

$this->parser->parse('common/header', $data);

で呼び出すと、header.phpが呼び出されるのですが、

$this->parser->parse('common/header.html', $data);

 
で呼び出すと、htmlファイルが呼び出されます。何というPHPerへの配慮(笑)
 

2.置き換え文字は{}ではなく<!– –>を使う

で、こちらも対応する関数が用意されておりまして

$this->parser->set_delimiters('<!-- ',' -->');

をparseする前に置きますと、置き換え文字が{}から<!– –>に変更されます。
 
機能は最小限搭載してるといっても、痒いところに手が届く実装してますね!でもドキュメントには書いていて欲しかった。まぁ、おかげ様で、テンプレートエンジンをわざわざ入れることなく作業を進めれています!
それでは、また。

slackチームに参加下さい

ng-onsenui2.slack.com

OnsenUI2(Angular2)について知見を共有する場です。Angular2に限ってOnsenUI2を議論できる場がなかったのでつくりました。これから使い始めるという方はぜひご参加ください。
https://ng-onsenui2.herokuapp.com/

Ionic2.slack.com

日本語情報が少ないのでこちらで知見を共有できればと思います。お陰様で参加者100名を超えました。ありがとうございます。
https://ionic2-ja.herokuapp.com