madoi-sample-ts-react-chat

Madoiを利用したシンプルなチャットアプリのサンプルです。

実行するにはMadoiサーバが必要です。

Madoiサーバの起動

適当なディレクトリで以下のコマンドを実行し、Madoi の madoi-volatileserver を起動してください。 詳細は、MadoiのREADMEも参照してください。

git clone https://github.com/kcg-edu-future-lab/madoi
cd madoi
docker compose up

docker compose upを実行すると、Madoiのビルドが行われ、madoi-volatileserverが起動します。

必要なソフトウェアのインストール

下記のバージョンのnodejsで動作確認を行なっています。

• nodejs (v22.12.0)

ビルドと起動

まず、このリポジトリをcloneし、リポジトリのディレクトリに移動してください。

git clone https://github.com/kcg-edu-future-lab/madoi-sample-ts-react-chat
cd madoi-sample-ts-react-chat

次に /src/keys.ts.sample をコピーして、 /src/keys.ts を作成し、適切に設定を行なってください。

// Madoi設定
export const madoiUrl = "ws://localhost:8080/madoi/rooms";
export const madoiKey = "MADOI_API_KEY";

MadoiサーバのデフォルトのMADOI_API_KEYは、docker-compose.ymlを参照してください。

次のコマンドを実行して関連ライブラリをインストールしてください。

npm i

devコマンドを実行すると、ブラウザが起動し、チャットアプリケーションが表示されます。

npm run dev

静的ビルドを行うには、buildコマンドを実行してください。

npm run build