AIを活用したアプリケーション開発（チャットアプリ）

今回はAIを活用したアプリケーション開発の第6弾として、リアルタイムで相手の投稿を確認できるチャットアプリを作成しました。

WebSocketを用いたリアルタイム通信はよく使われている技術ではありますが、私が未経験の技術だったため、実際に実装してみることにしました。

アプリケーション概要

今回のアプリケーションは、ブラウザを利用してリアルタイムでメッセージのやり取りをするチャットアプリです。

部屋の作成や部屋の人数の増減、メッセージの投稿などを行った際、すぐに他のユーザの画面に反映されます。

部屋は好きな数だけ作ることができ、部屋の出入りは自由です。

今回は入室できる人を制限する機能は設けていません。

アプリケーション操作の流れ

アプリケーション操作は下記の流れで行います。

1. ユーザを登録する
2. チャットルームに入る
3. メッセージを投稿する
4. チャットルームから退出する

下記は、2つチャットルームを作って会話をする様子を撮影した動画です。

実装を終えた所感

今回も、AIを利用して新しい技術の開発をスムーズに進めることができました。

今回初めて利用したWebSocketの実装に慣れることに時間がかかりましたが、それでも全体を通して8時間ほどの時間で開発が完了しました。

WebSocket通信の実装にあたり、ChatGPTに以下の内容でアプリケーションの作成を指示し、WebSocketを利用した実装サンプルの出力を得ました。

WebSocket通信を使用して、リアルタイムにメッセージをやり取りするチャットアプリを作成する

アプリの利用の流れは下記の通りです。

1. 最初にユーザが自身の名前を設定して、チャットアプリの利用を開始する
2. チャットルームが存在しない場合は新たに作成し、既存のルームがある場合は作成または入室を選択できる
3. チャットルーム内でメッセージのやり取りを行う
4. 任意のタイミングでチャットルームから退出できる

この指示によって出力されたプログラムには、下記のような課題がありました。

• 必要な機能が一部実装されていない
• 一部の処理が正常に動作しない
• 機能の仕様が私の意図と異なる
• ユーザに表示される情報が不十分
• 保守性が低く、今後の拡張や修正が困難

これらの課題の大部分は、ChatGPTに対して修正方法を具体的に指示することで解決し、開発を完了させることができました。

特に最初の3点については、私自身が該当機能の実装方法を知らなかったため、変更したいプログラムと合わせて修正方針を指示し、ChatGPTに再実装を依頼しました。その結果、処理の大枠についてはChatGPTが自動生成し、私はそれをベースにユーザビリティを高めるための細かな修正を加えました。

一方、保守性の向上に関しては、ChatGPTの提案では不十分なことが多く、最終的には私自身の手で大部分を改修しました。

こうした一連の取り組みによって、チャットアプリを完成させました。

まとめ

今回の技術を応用すると、次のような機能などを実装が可能です。

• 認証が必要なアプリにおいて、リアルタイム通知を行う機能
• 業務アプリのワークフローにおいて、承認状況のリアルタイム反映

今回WebSocketを実装の実装では、AIが出力したサンプルコードを参考にしながら、私にとって初めての技術を無事に実装することができました。

AIがプログラムの書き方とその説明をあわせて出力してくれるため、技術の学習が非常に効率的かつ分かりやすくなっていると実感しています。

今後もAIを活用しながら、新しい技術への挑戦を続けていくつもりです。