【はじめに】参考書のコードに手が止まる
こんにちは! 普段はフロントエンド(HTML/CSS/JS)をメインに書きつつ、最近はバックエンドの「PHP」を絶賛学習中のフロントエンジニアです。
今日は、PHPの学習中に直面した違和感と、その解決策を備忘録としてシェアしたいと思います。
まずは下記のコードをご覧ください。
<?php
$title = "マイページ";
$name = "山田太郎";
echo "<div class='container'>";
echo "<h1>" . $title . "</h1>";
echo "<p>ようこそ、" . $name . "さん!</p>";
echo "</div>";
?>
……なんか、echoがいっぱいで、くどくないですか?
JSのテンプレートリテラル(`${expression}`)に慣れた目で見ると、この「文字の連結の嵐」と「PHPの中にHTMLが閉じ込められている窮屈感」に猛烈な違和感を覚えました。
「これ、class の名前を変えたくなったら面倒そう…」「記号だらけで目がチカチカする!」と、心がざわざわしてしまったんです。
もちろん、参考書は「プログラムがどう動くか」をわかりやすく教えるために、あえてシンプルに書いているのだと思います。でも、もしこれを実務でそのまま書いたら、後から読む人が大変な思いをしそうです。
そこで、「脱・echo連打」を目指して、もっとスマートで保守しやすい(直しやすい)書き方を調べてみました!
なぜ「echo連打」は避けるべきなのか?
「echoが悪い」というよりも、実務ではHTMLを文字列として組み立てる設計が可読性・保守性を下げやすいため、あまり推奨されません。それはどういうことか、以下の3点でまとめてみました。
- エディタの恩恵が受けられない
多くのエディタでは、PHP文字列内のHTMLは構文として完全には解析されません。拡張機能で補助はできますが、通常のHTMLファイルほどの補完や整形は期待できません。タグのハイライトも効かないし、入力補完も使えない。これはフロントエンドエンジニアとしては致命的に書きづらいです。
- クォーテーション問題(エスケープ問題)
HTMLの属性にはダブルクォーテーション(“)を使いたいですよね。でも、PHPの出力もダブルクォーテーションで囲むと、そのままではエラーになってしまいます。 そのため、echo “<div class=\”box\”>”; のように、バックスラッシュ(\)という記号を挟んで回避しなければなりません。……見た目がごちゃごちゃして読みにくいですよね。
- XSS(クロスサイトスクリプティング)の温床になる
ユーザー入力など外部から受け取った値をエスケープせずに出力すると、XSS(クロスサイトスクリプティング)攻撃の原因になる可能性があります。この点も常に注意が必要ですね。
では、どう書くのが正解なのでしょうか? 調べて実践してみた「より良い書き方」を4つ紹介します。
【パターン1】PHPタグを閉じて「素のHTML」を書く
これが最も基本かつ、WordPressのテーマ開発などでもよく見る標準的な書き方です。 PHPはあくまで「HTMLに埋め込む言語」。HTMLを出力するためにPHPを使うのではなく、HTMLの中にPHPを少しだけお邪魔させるという発想の転換ですね。
<div class="container">
<h1><?php echo htmlspecialchars($title, ENT_QUOTES, 'UTF-8') ?></h1>
<p>ようこそ、<?php echo htmlspecialchars($name, ENT_QUOTES, 'UTF-8') ?>さん!</p>
</div>
ポイント:安全第一の「htmlspecialchars」
長くて呪文のような htmlspecialchars は「HTMLエスケープ」を行う関数です。
< や > などの特殊文字を安全な文字列に変換し、ブラウザにHTMLとして解釈されないようにします。 セキュリティを守るための「安全フィルター」として、セットで覚えるようにしています。
【パターン2】制御構文には「コロン構文」を使う
HTMLの中にPHPを埋め込むとき、if 文の波括弧 { } が混ざると、閉じタグ } がどの if に対応しているのか迷子になりがちです。 そこで使えるのがコロン構文です。
<?php if ($is_login): ?>
<div class="alert alert-success">
<p>ログインしています</p>
</div>
<?php else: ?>
<div class="alert alert-warning">
<p>ゲストさん、こんにちは</p>
</div>
<?php endif; ?>
これなら、HTMLのインデントが崩れにくく、ブロックの終わりが endif と明記されるので可読性がグッと上がります。 コロン構文はテンプレート用途を想定したPHPの正式な文法です。
HTMLと混在する場面では波括弧よりも読みやすくなるため、テンプレートファイル(Wordpressのファイルなど)ではよく使われます。
【パターン3】ヒアドキュメントを活用する(変数の場合)
「HTMLをそのまま画面に出す」のではなく、「HTMLをひとつのデータとして変数にしまっておきたい」(例:自動返信メールの本文テンプレートを作るときなど)というケースでは、ヒアドキュメントが便利です。
<?php
// <<<EOM で始まり、EOM; で終わる
$html_body = <<<EOM
<div class="card">
<h2>{$title}</h2>
<p class="text-body">
{$description}
</p>
</div>
EOM;
// echo $html_body;
?>
これなら、ダブルクォーテーションをそのまま書いてもエラーになりませんし、改行もそのまま反映されるので、とても直感的に作れます。
※ 終了識別子(EOM;)は行頭に書く必要があるので、インデントには注意が必要です。
【パターン4】ロジックと表示(View)を分ける
さらに学習を進めると、そもそも「データの処理(計算や取得)」と「HTMLの表示」を同じファイルに書くこと自体が、コードが複雑になる原因だと気づきました。
これは「ロジック(処理)」と「ビュー(表示)」を分離する考え方で、MVCという設計思想の基本にもつながります。
■logic.php(計算担当)
<?php
$title = "マイページ";
$user_name = "山田太郎";
// XSS対策関数(簡易版)
function h($str) {
return htmlspecialchars($str, ENT_QUOTES, 'UTF-8');
}
// 最後に表示用のファイルを読み込む
include 'view.php';
?>
■view.php(表示担当)
<!DOCTYPE html>
<html lang="ja">
<body>
<div class="container">
<h1><?= h($title) ?></h1>
<p>ようこそ、<?= h($user_name) ?>さん</p>
</div>
</body>
</html>
※<?= ?> は <?php echo ?> の短縮記法です。PHP5.4以降では常に使用可能です。
こうすることで、フロントエンドエンジニアは view.php のHTML/CSSコーディングに集中できますし、バックエンドの複雑なプログラムをうっかり壊してしまう心配も減ります。
【まとめ】コードの「美しさ」は「メンテナンス性」
今回、「参考書のコードがごちゃごちゃしている」という直感的な違和感を掘り下げてみたことで、以下のことが学べました。
- 素のHTMLを活かす: PHPタグは最小限にしてHTMLの形を保つ。
- セキュリティ意識: htmlspecialchars の安全フィルターは必ず通す。
- 役割分担: 「データの準備」と「表示」はファイルを分ける。
参考書のコードはあくまで「仕組みを理解するための第一歩」であり、実務で書くべきコードとは目的が違うのだと理解できました。
「動けばいい」から一歩進んで、「読みやすい」「後から直しやすい」コードを書く意識を持つことが、エンジニアとしての成長への近道かもしれません。 もし、学習中に「なんか書きづらい」「直しづらそう」と感じたら、その感覚はきっと正しいです。その違和感こそが、より良いコードへの入り口なのだと思います。
PHPはまだまだ奥が深いですが、少しずつ仲良くなっていこうと思います!