後期第09回 - oddmutou/jugyo-2025kyototech GitHub Wiki
フォロー機能を作ってみましょう
InstagramやX(旧Twitter)にある、ユーザー相互で行うことができる「フォロー」機能を作ります。フォロイーであるユーザーに対して、フォロワーであるユーザーが多対多(belongs to many)で紐づきます。
多対多となるデータを持つには、中間テーブル(交差テーブルと呼ぶこともあります)で関係性を保持します。
今回はユーザーとユーザーのフォロー関係を管理するテーブルのため、 user_relationships という名前でテーブルを作ってみます。
CREATE TABLE `user_relationships` (
`id` INT UNSIGNED NOT NULL AUTO_INCREMENT PRIMARY KEY,
`followee_user_id` INT UNSIGNED NOT NULL,
`follower_user_id` INT UNSIGNED NOT NULL,
`created_at` DATETIME DEFAULT CURRENT_TIMESTAMP
);
followee_user_id にはフォローされる人のidを、 follower_user_id にはフォローする人のidを保存します。
では早速フォロー関係を設定する画面を作ってみましょう。
vim public/follow.php
その画面に、プロフィールページから遷移できるようにしてみましょう。 また、既にフォローしている場合はその旨表示するようにしてみましょう。
vim public/profile.php
一度動かしてみて、MySQLで直接内容を確認 ( SELECT * FROM user_relationships ) してみましょう。
フォロー済会員一覧画面を作ってみましょう。
既にフォローしている会員一覧画面を作ってみましょう。
vim public/follow_list.php
フォロー状態のリセット( MySQLで DELETE FROM user_relationships; )もしながら、動作を確認してみましょう。
演習
動作例: http://98.89.2.158/bbs.php (自由にユーザー情報作って動作確認してもらってかまいません。)
演習1
自分(ログインしている人)がフォローしている人(フォロイー)に対して、フォローを解除する画面を実装しましょう。対象となる人(フォロイー)のプロフィール画面と、フォロー済一覧画面(public/follow_list.php)から、その画面への導線を設定しましょう。
実装例: https://github.com/oddmutou/jugyo-2025kyototech/commit/1f9b3b646d2955bdbe4db580ec98cb0a6d0d0764
演習2
自分(ログインしているひと)がフォローされている会員(フォロワー)の一覧画面を作ってみましょう。アイコン画像も表示しましょう。
実装例: https://github.com/oddmutou/jugyo-2025kyototech/commit/f98ddbf71705863745ded979def44d4c803b8027
演習3
フォローされている人のプロフィールページに、フォローされている旨を表示するようにしてみましょう。
実装例: https://github.com/oddmutou/jugyo-2025kyototech/commit/09a529f3f47640723e353a610d42dd593000d207