AIと学ぶPHPの学校
ch04 8章中 4章目

ch04 — HTML と PHP の共存

スライドで見る

この章を AI と学ぶ

💬 AI に聞く質問例 3 件

  1. 「ch04 — HTML と PHP の共存」のつまずきやすいポイントを、初学者向けに3つ教えてください

    ChatGPT Claude Gemini

  2. 「ch04 — HTML と PHP の共存」について、自分の手で試せる練習問題を3つ出してください (難易度を上げながら)

    ChatGPT Claude Gemini

  3. 「ch04 — HTML と PHP の共存」を学んだ後、次に学ぶと良いトピックは何ですか？理由も教えてください

    ChatGPT Claude Gemini

概要

PHP は元々「Personal Home Page Tools」という名前で、HTML の中に部分的にプログラムを差し込んで動的なページを作る ための道具として 1995 年に生まれた。本格的な Web アプリを支える言語に育ったあとも、「HTML がベースで、必要なところだけ <?php ?> で囲んでスクリプトに切り替える」 という設計思想は文法の根っこに残っている。

具体的には、.php ファイルの中で <?php ?> タグの 外側 に書いた文字はそのまま出力され、内側 だけが PHP として実行される。しかも <?php ?> ブロックは 1 つのファイルに複数置ける ので、HTML の途中に何度でも処理を差し込める。<h1>こんにちは <?php echo $name; ?> さん</h1> のような書き方が成立するのはこの仕組みのおかげだ。なお ?> 直後の改行 1 つは PHP の仕様で自動的に消える、というクセも覚えておくと混乱しない。

現代の実務では Twig や Blade のような テンプレートエンジン を間に挟むのが主流で、<?php ?> をベタ書きする機会は減っている。ただしそれらも内部ではこの「HTML と PHP の混在」を整理した上に成り立っているので、もとの形を一度自分の手で書いておくと、後でフレームワークを学んだときに 裏で何が起きているか が見える。

学習目標

  • .php ファイルの中に HTML と PHP を混ぜて書ける
  • <?php ?> タグの 外側 に書いた文字はそのまま出力されると理解する
  • <?php ?> ブロックを 複数 置ける

ドリル

no 内容
01 HTML テキストと <?php echo ?> を 1 ファイルに書く
02 <?php ?> ブロックを複数置く

解説スライド 全 6 枚

右の › ボタンか → キー(またはスワイプ)で次のスライドに進めます。 下の「縦表示」を開くと全スライドを一気に読めます。

  1. HTML と PHP の共存

    Lesson 1 / Chapter 4

  2. <?php ?> の外は「そのまま出力」

    こんにちは
<?php
echo "PHP からの出力\n";
?>
おわり

    実行結果:

    こんにちは
PHP からの出力
おわり
    • <?php ?> の 外 は文字としてそのまま出る
    • <?php ?> の 中 だけが PHP として実行される

  3. HTML と混ぜて書ける

    <h1>タイトル</h1>
<p>
  今日は <?php echo "晴れ"; ?> です。
</p>

    実行結果:

    <h1>タイトル</h1>
<p>
  今日は 晴れ です。
</p>
    • .php ファイルの中身は HTML + PHP で OK
    • PHP の出力したい場所だけ <?php ?> で囲む

  4. <?php ?> は複数置ける

    名前: <?php echo "Taro"; ?>

年齢: <?php echo "20"; ?>

    実行結果:

    名前: Taro
年齢: 20
    • <?php ?> ブロックは 1 ファイルに いくつでも 置ける
    • 注意: ?> の直後の 改行 1 つ は PHP に食われる → 改行を出したい時は空行をもう 1 つ入れる

  5. ファイル末尾の ?> は省略してよい

    <?php

echo "本文\n";
    • ファイル全体が PHP の場合、末尾の ?> は 書かなくてよい
    • むしろ書かない方が安全 (?> の後ろに空白が混ざると出力が壊れる)
    • HTML と混ざるファイルでは ?> を書く

  6. このチャプターでできるようになること

    ✅ .php の中に HTML と PHP を混ぜられる ✅ <?php ?> の外はそのまま出ると理解している ✅ <?php ?> ブロックを複数置ける

    → ドリルへ

1 / 6
📜 スライドを全部一気に読む(縦表示)

Lesson 1 / Chapter 4

<?php ?> の外は「そのまま出力」

こんにちは
<?php
echo "PHP からの出力\n";
?>
おわり

実行結果:

こんにちは
PHP からの出力
おわり
  • <?php ?> の 外 は文字としてそのまま出る
  • <?php ?> の 中 だけが PHP として実行される

HTML と混ぜて書ける

<h1>タイトル</h1>
<p>
  今日は <?php echo "晴れ"; ?> です。
</p>

実行結果:

<h1>タイトル</h1>
<p>
  今日は 晴れ です。
</p>
  • .php ファイルの中身は HTML + PHP で OK
  • PHP の出力したい場所だけ <?php ?> で囲む

<?php ?> は複数置ける

名前: <?php echo "Taro"; ?>

年齢: <?php echo "20"; ?>

実行結果:

名前: Taro
年齢: 20
  • <?php ?> ブロックは 1 ファイルに いくつでも 置ける
  • 注意: ?> の直後の 改行 1 つ は PHP に食われる → 改行を出したい時は空行をもう 1 つ入れる

ファイル末尾の ?> は省略してよい

<?php

echo "本文\n";
  • ファイル全体が PHP の場合、末尾の ?> は 書かなくてよい
  • むしろ書かない方が安全 (?> の後ろに空白が混ざると出力が壊れる)
  • HTML と混ざるファイルでは ?> を書く

このチャプターでできるようになること

✅ .php の中に HTML と PHP を混ぜられる ✅ <?php ?> の外はそのまま出ると理解している ✅ <?php ?> ブロックを複数置ける

→ ドリルへ

この章で取り組む 演習問題の流れ (2ステップ)
  1. 01 ドリル 01 — HTML テキストと PHP を混ぜる README.md starter.php answer.php
  2. 02 ドリル 02 — `<?php ?>` ブロックを複数置く README.md starter.php answer.php

演習問題の詳細

この章の演習問題の内容を読めます。実際に手元で解くには教材リポジトリを clone してください。

ドリル 01 — HTML テキストと PHP を混ぜる

問題

.php ファイルの中に タグの外の文字 と <?php echo ?> を混ぜて、次の出力を出してください。

期待される出力:

今日の天気は 晴れ です。

条件:

  • 「今日の天気は 」と「 です。」は <?php ?> の 外側 にそのまま書く
  • 「晴れ」だけ <?php echo "晴れ"; ?> で出力する

ヒント

  • 形:
    今日の天気は <?php echo "晴れ"; ?> です。
  • 末尾の改行を忘れない (タグの外で改行を入れて OK)

🧪 ブラウザで試す

スライドのコードを写経して ▶ 実行、自分で書いて 📝 採点 で答え合わせ。初回のみ PHP ランタイム読込で数秒かかります。

PHP ランタイム未読込 

          

        

              

          

        

          ドリル 02 — `<?php ?>` ブロックを複数置く
        

        


問題


1 ファイルの中に <?php ?> ブロックを 2 つ以上 置いて、次の出力を出してください。


期待される出力:


名前: Taro
年齢: 20


条件:


    

  • 名前: と 年齢: の部分は <?php ?> の 外側 に書く
    • 

  • Taro と 20 は 別々の <?php echo ?> ブロックで出力する
    • 



ヒント


    

  • 形:
    名前: <?php echo "Taro"; ?>
年齢: <?php echo "20"; ?>
    

    • 

  • それぞれ別の行にして、<?php ?> ブロックを 2 つ並べる
    • 

        

                        

          
🧪 ブラウザで試す

          
スライドのコードを写経して ▶ 実行、自分で書いて 📝 採点 で答え合わせ。初回のみ PHP ランタイム読込で数秒かかります。

          
          

            
            
            
            PHP ランタイム未読込
          

          

          

        

              

      

  
    

    
 演習問題(2問)

    
    
              
  1. 
          
    ドリル 01 — HTML テキストと PHP を混ぜる
    
          
    
                          README.md
                          starter.php
                          answer.php
                      
    
        
    2. 
              
  2. 
          
    ドリル 02 — `<?php ?>` ブロックを複数置く
    
          
    
                          README.md
                          starter.php
                          answer.php
                      
    
        
    3. 
          

    
サイト内で問題文・雛形・解答例を確認できます。実際に手元で解くには教材リポジトリを clone してください。

  

  
  
  
  
  

  

  

    
    
完了にすると進捗に反映されます