開発ログ - Recursion-Group-C/card-game GitHub Wiki

Sprint#1 2023/03/11 キックオフMTG

目標

  • Sprint#1で実施するタスク決め
  • 各開発ツールのグループ作成
  • 開発環境の合意

出席者

やったこと・決まったこと

次回MTG

  • 2023/03/13 (月) 21:00~

定例MTGの日程

  • 水曜日 21:00~, 土日どちらか(水曜日の定例で相談して決める)

Sprint#1で実施するタスク

Sprintの設定

  • 1Sprintは1Weekとする
  • 活動期間は、2023/03/11-2023/04/22 (6 Sprint)
  • 土日の定例MTGでPlanningとRetrospectiveを行う
  • 2SprintごとにAdminとSprint Reviewを行う

ソフト開発ツール群

技術選定

  • Platform: Web, Desktop, Mobile
  • Architecture: MVC
  • Frontend: TypeScript + Phaser + React + Tailwind CSS
  • Backend: Node.js web server
  • Infrastructure: AWS

開発環境

  • Static Code Analysis: ESLint, Prettier
  • CI/CD: Github Actions
  • Environment: Docker

Git運用ルール

  • Gitflowに従い、issueからfeature branchを作成、developにマージ。develop branchでまとまったものが完成してからmain branchにマージする。
  • マージを行う際は、必ず他のメンバーがレビューを行う
  • コミットメッセージは、フォーマットに従う
  • タスクの粒度はRetrospectiveで適宜調整する
  • プルリクのメッセージはフォーマットに従う
  • 開発に余裕があれば、単体テストをGithub Actionsで実行できるようにする

Sprint#1 2023/03/13 進捗確認、要件定義のブレスト

目標

  • 進捗確認
  • 要件定義決め
  • サイトマップ作成

以下は、時間があれば取り組む。時間が足りなければ、各自担当を決めて宿題にする。

  • ワイヤーフレーム
  • アクティビティ図
  • クラス図

出席者

やったこと・決まったこと

次回MTG

  • 2023/03/18 (土) 時間未定

要件定義決め

サイトマップ作成

宿題

Sprint#1 2023/03/18 進捗確認、技術スタック再考

目標

  • 進捗確認
  • 技術スタック再考

出席者

進捗確認

クラス図(@y0uk1

Project5のブラックジャックを基に作成。ブラックジャック以外のゲームの詳細は追々追加していく。設計#クラス図

Q. クラス図の完成度を求めると、時間がかかってしまう。最初の段階でどこまでの完成度を求めればよいか?

A.

最初はクラス間の包含関係と参照関係を考えるためにクラス図を作るとわかりやすい。 この段階のクラス図はルール無用、思うがままのスケッチでいい。 クラスのプロパティや関数を網羅する必要もなく、最低限クラスの名前、包含関係、参照関係と役割が分かればよい。

From Qiita

TODO

  • 現在作成したクラスを元にブラックジャックを実装していき、適宜更新していく。

アクティビティ図(@YzIori

ゲーム全体、ログイン、各ゲームのアクティビティ図が完成。設計#アクティビティ図

WarのルールはカジノWarを採用する。

Linter, Formatter(@YzIori

TODO

  • Next.js向けに作成する。(3/18中)

ワイヤーフレーム(@daitennn

以下画面は完成。figma

  • ホーム画面
  • ログイン画面
  • 各ゲーム画面
  • ゲーム一覧画面
  • チュートリアル画面
  • 設定画面

TODO

  • 残りのページを追加する(3/18)
    • マイページ
    • 退会画面
    • 戦績、ランキングページ
    • パスワード再設定画面

やったこと・決まったこと

次回MTG

3/21(火)21:00~

技術選定再考

  • Platform: Web, Desktop, Mobile
  • Architecture: MVC
  • Language: TypeScript
  • Frontend: Phaser + React (State Management: redux) + Tailwind CSS
  • Backend: Next.js API routes
  • DB: PostgreSQL
  • Infrastructure: Vercel (Next.js), Supabase (PostgreSQL)

システム構成図の作成

設計#システム構成図

Sprint#2 2023/03/21 進捗確認、Sprint#2の計画確認

目標

  • 進捗確認
  • 今週の計画確認

出席者

進捗確認

NextjsとPhaser3の連携方法調査(@daitennn

  • Phaser3とNextjs、TypeScriptを連携させたリポジトリを発見。このリポジトリをベースに開発を進めていく。

開発環境の構築(@YzIori

  • Jest、TailWindCSSの設定を追加
  • Jestドキュメントをwikiに追加(テストツール

チュートリアル実施(@y0uk1

  • Nextjs, Phaser, TypeScriptのチュートリアルを実施

やったこと・決まったこと

Sprint#2の計画確認

  1. 各自チュートリアルを終わらせる

    • Nextjs
    • Phaser3
    • Typescript
    • Reactのstate管理ライブラリ <- 必要性を感じたときにライブラリの選定から相談
  2. 以下の条件を満たす、Nextjsのベースプロジェクトを作成する

    • Linter, Formatter等の設定が行われている
    • TSの設定が行われている
    • Tailwindの設定が行われている
    • リモートコンテナの設定が行われている
  3. ベースプロジェクトを使用して、技術検証を兼ねて、各自ページを作成していく

    • ゲーム画面(Nextjs + Phaser3の検証)
    • ユーザー認証機能(Nextjs + Prisma + PostgreSQLの検証)
    • 画面のデザイン作成(まずはゲーム一覧ページから)

Q. ファイル構成は最初の段階から厳格に決めるか?

A. 最初はラフに実装し、まずは動くものを作成する。ファイル構成は、後からリファクタリングで対応する。

次回MTG

  • 2023/03/25 (土) 午後

Sprint#2 2023/03/25 進捗確認、Sprint#3のプランニング

目標

  • 進捗確認
  • Sprint#3のプランニング

出席者

進捗確認

Supabaseを使用した認証機能の確認(@y0uk1

  • 認証機能の確認が完了

デザイン作成(@YzIori

  • ホーム画面のデザイン作成(figma
  • 残りのログイン画面、代表のゲーム画面を3/26(日)までに作成する

Phaser3とNextjsとの連携(@daitennn

  • PhaserとNextjsの連携完了
  • 背景画像のリサイズができなくて困っている->これが参考になりそう

やったこと・決まったこと

Sprint#3のプランニング

以下のゲームの実装を開始する。

  • Blackjack (CPUをなくして、HouseとPlayerの対戦にする)(@daitennn
  • Porker(@YzIori
  • Speed(@y0uk1

流れ

  1. 抽象クラスとカードクラス、デッキクラスを作成する
  2. クラス図に従い、Blackjack, Porker, Speedを各自実装していく。リファクタリングで共通化できそうな関数があれば、抽象クラスを更新する。

フォルダ構成

  • pages/game/porker.tsx
  • scenes/PorkerScene.tsx

Prettier, ESLintについて相談

Q. huskyがまだ使えない。PrettierとESLintの適用はどうすればよいか?

A. Huskyの設定が完了するまでは、VS Codeの拡張機能で対応する

次回MTG

  • 3/29 (水) 22:00~

Sprint Reviewに向けた確認

出席者

相談したいこと

  • 特になし
  • 何か思いつけば、各自確認する

Sprint#3 2023/03/26 Sprint#1, #2のスプリントレビュー

出席者

確認したこと

開発の方針

  • 最優先は、ゲームを実装すること。ログイン機能は付けてもいいけど、まずはゲームの実装を優先する。
  • Sprint#3からは、実際にゲームを実装していく。War, Blackjack, Speedが最初のスタートにはよさそう。Speedは非同期なゲームなので、他と少し違う。
  • ゲームを作りながら、クラス図をアクティビティ図を変更してもOK。設計も実装の一部と捉えて、柔軟に変更していけばよい。
  • Cordovaを使えば、Frontendのアプリを簡単にAndroidやiOSのアプリに変換できるらしい。ただ、チームではNextjsを使っているので、Nextjsとの互換性がよいものを使いたい。

相談

Q. 参考にしているプログラムがJavaScriptで書かれていてTypeScriptに変更するのが大変(特にPhaser3のクラスの型アノテーション)。どうすればいいか?

A. JSのまま使用するのでもいいと思う。Recursionでは、TypeScriptで実装するところと、JavaScriptで実装するところを分けている。状況に合わせて、どちらを使用するか考える。