記事の一覧、登録画面

さて、ここからはコンテンツ部分を修正していきましょう。
まずは記事一覧をmain.phpに表示するところです。

データの作成

SQL課題〜ブログ用のデータベースを作成しよう！でちゃんとレコードまで作成した方は、すでにpostsテーブルにレコードが存在しているはずです。
一覧に表示するときに表示されたか確認したいので、まだ作成されていない人は作成しておきましょう。

そのため、ダミーデータとしていくつかインサートしておきましょう。
MySQLにログインし、下記のインサート文をインサートしておいてください。

それではmain.phpに一覧表示をしていきましょう。
とはいえ、基本的な一覧表示の方法はPDO実装でやったので、ヒントのみの記載とします。

SQL文での検索

postsテーブルから全件取得すれば良いので、そこまで難しくはありません。
ただ、それだと面白くないので、最新のものから順番に並べ替えてみましょう。

MySQLにおいて、表示順を操作するためにはORDER BYを使用します。
例えば、idの昇順、降順で並び変える場合は以下のようになります。

# id昇順に並び替え
SELECT * FROM posts ORDER BY id ASC;
# id降順に並び替え
SELECT * FROM posts ORDER BY id DESC;

ちなみに、デフォルトは昇順なので、下記は同一です。

# 両方ともid昇順に並び替えている
SELECT * FROM posts;
SELECT * FROM posts ORDER BY id ASC;

取得したレコードをHTMLの中でループさせる

さて、SELECTでレコードが取得できればwhileを使用するんでしたね。

今回はまず表示例を示します。

列ごとに整って表示されていることが分かります。
このような表示にはHTMLのtableタグを利用します。
ただ、PDO実装では、HTMLタグの中にループ表示させるようなことはしませんでした。

PHPはHTMLとの親和性が非常に高いので、下記のようにHTML文中でループ文を記載することもできます。

<table>
    <tr>
        <td>記事ID</td>
        <td>タイトル</td>
        <td>本文</td>
        <td>投稿日</td>
    </tr>
    <?php while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) { ?>
        <tr>
            <td><?php echo $row['id']; ?></td>
            <td><?php echo $row['title']; ?></td>
            <td><?php echo $row['content']; ?></td>
            <td><?php echo $row['time']; ?></td>
        </tr>
    <?php } ?>
</table>

PHPの構文で必要な部分は<?php 〜 ?>で囲みます。
PHPにマークアップやスタイリングまでやらせるとコードが長くなってしまうので、専門のHTMLに任せてしまいましょう。

本項では全体を通して、HTML、CSSに関する解説は必要最小限でしか行いません。
そのため、見た目が気に入らない方は、各自でスタイルを当てましょう。