Phoenix + Reactでチャットアプリを作ろう（Part 4）

React Hooksを使ったMessage作成機能の追加

アプリ概要はPhoenix + Reactでチャットアプリを作ろう（Intro）参照。

ここまでのコードはP3_GROUP_CHANNEL参照。

Part 3で紹介したGroup Channel APIが構築されていることを前提とする。

本章ではReact Hooksを使ってGroup詳細画面にMessage作成機能を追加する。

作業項目は以下の通り。

• クライアント側GroupChannel作成
• GroupDetailPageにGroupChannelを追加

クライアント側GroupChannel作成

Websocketの処理にはPhoenixのJSライブラリを使用する。

npm install --save phoenix

Websocketの基本的な処理を定義しよう。

/src/Channel/GroupChannel.js

あとは、このChannelをGroupDetailPageで使うだけ。

GroupDetailPageにGroupChannelを追加

🚧（このセクション、作成中。。。）

ここまでのコードはP4_GROUP_DETAILS_PAGE_MESSAGE_CREATION参照。