オリジナルアプリ作成記 6 ~チャットルームの実装~

次にユーザー間でチャットできるような機能を実装する。

まず大前提として準備するものが二つある。
チャットルームとチャット画面の二つである。

レイアウト
完成した後に書くのもアレだけど、こんな感じで作成した。
参考にしたものはスクールのレイアウト。

画面左側にチャットルームが配置されて、真ん中にチャット画面が出る流れ。
試しにチャットルームを作成してみる。

レイアウトに関しては、完全にスクールの課題を参考にしている。
ここでルーム名を入力して、チャットメンバー(登録されているユーザー名)を選択すると一対一のチャットルームが作成される。

ちなみにルーム名にはバリデーションを組んでいるので、空で登録することはできない。
ここで問題になるのが多対多の関係。
ユーザーは多くの部屋に入る(持つ)ことができる。
ルームは多くのユーザーを持つことができる。
お互いにhas_manyの関係になると、いざ登録した時に無駄なカラムを作成してしまう。
ここで必要なのは中間テーブルと呼ばれるもの。

中間テーブル
room_userと名付けた中間テーブルを作成する。

マイグレーションには、room_id(作成する部屋)とuser_id(誰が入っているか)を記述する。
他のテーブルの要素を参考にするのでreferencesで。
外部キー制約?とか言ってたかな、foreign_key: true と記述するのも忘れずに。

これで多対多の問題は解消される。
流れとしては、部屋を作るとこの中間テーブルに
作成した部屋のid 部屋にいるuserのid
作成した部屋のid 指名したuserのid
と二つ記録されることになる。

部屋単体のテーブルには、部屋の名前だけ記録される。

実際に作成してみると…。

roomテーブルには…。

中間テーブルには…。

試しに作成した部屋がたくさんあるのでわかりづらいが、一番下の2項目が今回作成した部屋に該当する。

アソシエーションを組んでいることにより、互いのユーザー間であれば共通の部屋に入ることができる。

このcurrent_user.roomsの記述で操作しているユーザーと紐づいているroom(部屋)を表示する。

部屋の作成自体はこれで終了。
細かいアクセス制限は次回にする。