7
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Copilotを活用してRailsで対戦型のポーカーを作ってみた

Last updated at Posted at 2025-10-05

:bulb: きっかけ

最近TVやサブスクなどでポーカー番組を観る機会が増えてきた気がします。
私もポーカー番組を観たのをきっかけにプレイしてみたくなりました。
ガチの対戦というよりは、仲間内でワイワイしながら遊びたかったのですが、スマホのアプリなどでは、あまり適したものがなかったので、いっそのこと作ってみようと思いました。

:pencil: 以下のURLでどなたでも遊べますので、友達などとプレイしてみてください。(遊び方はこちら

ルールと異なる部分や、まだまだバグなどがあるかと思います。
気になった点などがありましたら、サイトの右下にあるフィードバックからお知らせください :bow_tone1:

:clipboard: できること/できないこと

できること

  • ポーカー(テキサスホールデム)の対戦ができる
  • 2人から10人までの対戦ができる
  • 初期コイン数などのルールを設定できる
  • ゲームオーバーになったプレイヤーも最後まで観戦できる

できないこと

  • チャットなどのコミュニケーションはできない(別のツールが必要)
  • 戦績などの保存ができない(今後は出来るようにしたい)
  • 知らない人と対戦できない(対戦するには作成したゲームコードを知らせる必要がある)

:computer: 構成

一番最近の仕事(といっても10年くらい前ですが)でRailsを触っていたので、Railsの学習も兼ねて久しぶりにブラウザで遊べるポーカーを作ってみました。
通常はゲームサーバー的なものを使うのだと思いますが、知識が全くありません。
また、バリバリのリアルタイム性を求められるゲームではないので、Railsでもなんとかなるんじゃないかという気持ちで始めてみました。
とはいってもリアルタイムな更新が必要な部分はあるので、そこはWebSocketを使って実装します。

構成図

あまりコストを掛けたくないので、必要最低限な構成にすることを心掛けました。

  • ネットワーク
    AWSで一般的な構成だと思いますが、VPCを作成して、内部にパブリックとプライベートのサブネットを2つずつ配置しています。
  • ロードバランサー
    パブリックサブネットにALBを配置してプレイヤーからのアクセスを受け付けます。
  • サーバー
    ECSを使用してコンテナを起動しています。コンテナ内にRailsサーバを起動しています。
    データベースはとりあえず余計な構成が必要ないSQLiteにしました。(なので、現時点では永続的なデータの保存はできていません)
  • 情報保存
    主にフィードバックを保存するためにS3のテーブルバケットを使用しています。
    データベースに保存するのが、楽かと思いますが、これが一番コストを抑えられると思って、採用してみました。

:stopwatch:苦労した点など

初めてのことが多かった

対戦ゲームの作成や、WebSocketの使用、最新のRailsでのWebサイト構築などなど・・・なにから手を付ければ良いかわからない状態でスタートしたため、形になるまで時間がかかりました。

:arrow_right: 初めてAIエージェント(Copilot)を使ってコーディングをしてみました。
わからない部分の雛形を作成してもらうことで、やりたいことを動くようにするのが短時間でできました。Copilotは試用期間もあったので、すごく助かりました。自力ではたどり着けなかったかもしれません。

ゲームの進行管理をどうするか

Webサーバなので、リクエストが無いとレスポンスができません。
ゲームの開始、終了や、プレイヤーに順番にアクションを促す必要があります。

:arrow_right: サーバ側のみで進行管理は難しそうなので、リクエストがあったときに、その対応の他に次のアクションまでを含めるようにしました。
ただ、ポーカーには一定の間隔をあけたりする必要もあるので、通常のWebサービスではあまりやらないですが、sleepを多用したりしています。
mdp_flow.drawio.png

Turbo Streamsを見誤った

最近のRailsではTurbo Streamsという機能を使うとWebSocketが簡単に実装できるという記事があったので、採用してみました。
おかげで普通に対戦するところまではCopilotを使ったこともあって、スムーズに開発することができました。
ただ、(私の認識が足りないだけかもしれませんが)Turbo StreamsではWebSocketの切断時に処理を追加することができないことが、あとになってから分かりました。
そうなると誰かが切断したときにゲームが続行不能になってしまうので、Turbo Streamsは使えないということがわかりました。

:arrow_right: ActionCableを使えば、切断時の処理が追加できるようなので、これもCopilotに修正方法を教えてもらいながら対応しました。
最初は、大幅な修正が必要かと思いましたが、実際にやってみるとそれほどでもなかったので、良かったです。

今思うと、自力では動くところまで開発することは難しかったかもしれません。
ここ数年のAIの発展スピードはものすごいですね。

:eye: Copilotを使ってみて

コーディングで初めてAIエージェントを使ってみたので、主にいまいちだと感じたことをあげたいと思います。
初めて使ったので、プロンプトなどのカスタマイズはせずに、ほぼまっさらの状態で使用しています。

  • 正しい情報が得られない
    わからないことを聞いたときに、「〇〇すれば良い」とアドバイスをもらえます。
    ただ、その通りにやってもうまくいかなくて、うまくいかなかったと報告すると、何事もなかったかのように、「そうです、出来ません」と返ってきたりします。
  • なかなか一度で満足できる回答を得られない
    こちらが欲しい回答をすぐに得られずに、モヤモヤすることも多かったです。
    聞き方が悪かったり、前提条件を示せていないことが原因なのかと思いますが、効果的に使うには、質問の仕方などに慣れが必要だと思いました。
  • きれいなコードにならない
    AIが生成してくれるコードは直接的な記述?が多い気がしました。
    CSSやJSは分割せずに、その場所に直接挿入されるのでこのまま採用するのはどうかなぁと思いました。
    こちらで完成形を意識して、分割することを前提に質問などをしないとダメそうですね。
  • 変な場所にコードを挿入する
    自分の設定の問題なのかもしれませんが、全然違う場所にコードを挿入されることが多々ありました。
    なぜか、ファイルの先頭に挿入されることが多かったです。
    また、インデントがずれることも多かったです。手動で修正しても再度提案してもらうと、またインデントを崩されてしまったりしました。

現時点では、AIエージェントは万人が安心して使用できるレベルにはなっていないのかなぁというのが、正直な感想です。
ただ、使い方に気を付ければ、開発工数を短縮できるのは間違いないですね。
もう少し時間がたてば、誰でも安心して使うことができるようになるんでしょうね。

:game_die: 遊び方

  • 以下のURLにアクセスしてください
    みんな de POKER β版
  • 代表のプレイヤーがゲームを作成する(ホスト)
    新しいゲームを作成ボタンをクリックして、ゲームを作成してください。
    作成されるとゲームコードが発行されるので、それを一緒にプレイされる人に教えてください。
    ゲーム作成.png
  • 他のプレイヤーがゲームに参加する
    一緒にプレイする人は、ゲームに参加をクリックして、教えてもらったコードを入力して参加してください。
    ゲームに参加.png
  • ホストがゲームを開始する
    人数が揃ったら、ゲーム開始をクリックすると対戦を開始することができます。
    ゲーム開始.png
7
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?