diff --git a/.github/images/gameplay.jpg b/.github/images/gameplay.jpg new file mode 100644 index 0000000..4e24747 --- /dev/null +++ b/.github/images/gameplay.jpg Binary files differ diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..425847a --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2026 Rinto Hasegawa, Shimoji Ryuki + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md index e69a8a7..08a9193 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,110 @@ -# SkillSemiWebGame +# Pixel Paint War -## デプロイ・環境変数 +![タイトル画面](apps/client/public/title.png) + +チーム対抗のリアルタイム陣取りペイントバトルゲームです。 +最大4チームのプレイヤーがブラウザ上で同じフィールドに参加し、制限時間内に自チームの色でマスを塗りつぶして陣地を広げます。 +終了時に最も多くのセルを塗ったチームが勝利です。 + +![ゲーム画面](.github/images/gameplay.jpg) + +## 技術スタック + +| 区分 | 技術 | +|---|---| +| フロントエンド | Vite + Preact + TypeScript | +| バックエンド | Node.js + TypeScript | +| 通信 | Socket.IO (WebSocket) | +| 描画 | Pixi.js (WebGL) | +| パッケージ管理 | pnpm workspaces (monorepo) | +| 開発環境 | Docker Dev Container | + +## 開発環境のセットアップ + +**必要なもの**: Docker、VS Code、VS Code拡張機能「Dev Containers」 + +1. リポジトリをクローンする +2. VS Codeでフォルダを開く +3. 左下の「><」アイコン →「Reopen in Container」を選択する +4. コンテナの起動を待つ(初回は数分かかります) + +起動後、以下のコマンドで動作確認できます。 + +```bash +# 共有パッケージのビルド +pnpm --filter @repo/shared build + +# クライアント起動(http://localhost:5173) +pnpm --filter client dev + +# サーバ起動 +pnpm --filter server dev +``` + +詳細は [ENV_04_環境構築手順書.txt](docs/02_ENV/ENV_04_環境構築手順書.txt) を参照してください。 + +## デプロイ + +クライアント(静的ファイル)とサーバ(Node.js)を別々にデプロイします。 +ビルド時に `VITE_PROD_SERVER_URL` にサーバのURLを設定する必要があります。 + +詳細は各手順書を参照してください。 + +| デプロイ先 | ドキュメント | +|---|---| +| Render | [ENV_09_Renderデプロイ手順.txt](docs/02_ENV/ENV_09_Renderデプロイ手順.txt) | +| 研究室サーバ(Nginx + Docker) | [ENV_10_研究室サーバデプロイ手順書.txt](docs/02_ENV/ENV_10_研究室サーバデプロイ手順書.txt) | +| 環境変数一覧 | [ENV_08_環境変数設定.txt](docs/02_ENV/ENV_08_環境変数設定.txt) | + +## ドキュメント + +### 開発ガイド | ドキュメント | 内容 | |---|---| -| [ENV_08_環境変数設定.txt](docs/02_ENV/ENV_08_環境変数設定.txt) | 全デプロイ先共通の環境変数一覧と設定方法 | -| [ENV_09_Renderデプロイ手順.txt](docs/02_ENV/ENV_09_Renderデプロイ手順.txt) | Render へのデプロイ手順 | -| [ENV_10_研究室サーバデプロイ手順書.txt](docs/02_ENV/ENV_10_研究室サーバデプロイ手順書.txt) | 研究室サーバへのデプロイ手順 | +| [GUIDE_01_ドキュメント作成ガイド.txt](docs/01_GUIDE/GUIDE_01_ドキュメント作成ガイド.txt) | ドキュメントの書き方・フォーマット規則 | +| [GUIDE_02_ファイル命名規則.txt](docs/01_GUIDE/GUIDE_02_ファイル命名規則.txt) | ファイル・ディレクトリの命名規則 | +| [GUIDE_03_Git運用ルール.txt](docs/01_GUIDE/GUIDE_03_Git運用ルール.txt) | ブランチ・コミットの運用ルール | +| [GUIDE_04_コードコメント規則.txt](docs/01_GUIDE/GUIDE_04_コードコメント規則.txt) | コードコメントの書き方 | +| [GUIDE_05_プロトコル追加手順.txt](docs/01_GUIDE/GUIDE_05_プロトコル追加手順.txt) | Socket.IOイベントの追加手順 | + +### 環境・構成 + +| ドキュメント | 内容 | +|---|---| +| [ENV_01_環境構築・技術スタック.txt](docs/02_ENV/ENV_01_環境構築・技術スタック.txt) | 技術スタックとプロジェクト構成 | +| [ENV_02_ディレクトリ構造.txt](docs/02_ENV/ENV_02_ディレクトリ構造.txt) | ソースコードのディレクトリ構造 | +| [ENV_04_環境構築手順書.txt](docs/02_ENV/ENV_04_環境構築手順書.txt) | 開発環境のセットアップ手順 | +| [ENV_05_Docker運用操作ガイド.txt](docs/02_ENV/ENV_05_Docker運用操作ガイド.txt) | Dockerの運用・操作コマンド | + +### 仕様 + +| ドキュメント | 内容 | +|---|---| +| [SPEC_01_ゲーム概要_画面遷移.txt](docs/04_SPEC/SPEC_01_ゲーム概要_画面遷移.txt) | ゲーム概要・画面遷移フロー | +| [SPEC_02_ロビー仕様.txt](docs/04_SPEC/SPEC_02_ロビー仕様.txt) | ロビー画面の仕様 | +| [SPEC_03_ゲームプレイ仕様.txt](docs/04_SPEC/SPEC_03_ゲームプレイ仕様.txt) | ゲームプレイの詳細仕様 | +| [SPEC_04_HUD_UI仕様.txt](docs/04_SPEC/SPEC_04_HUD_UI仕様.txt) | HUD・UIの仕様 | +| [SPEC_05_リザルト仕様.txt](docs/04_SPEC/SPEC_05_リザルト仕様.txt) | リザルト画面の仕様 | + +### 技術詳細 + +| ドキュメント | 内容 | +|---|---| +| [TECH_01_通信最適化.txt](docs/05_TECH/TECH_01_通信最適化.txt) | 通信量削減・最適化の実装方針 | +| [TECH_02_時刻同期_ラグ対策.txt](docs/05_TECH/TECH_02_時刻同期_ラグ対策.txt) | 時刻同期・ラグ補正の実装方針 | +| [TECH_03_描画最適化.txt](docs/05_TECH/TECH_03_描画最適化.txt) | 描画パフォーマンス最適化の実装方針 | + +### テスト + +| ドキュメント | 内容 | +|---|---| +| [TEST_01_負荷テスト仕様.txt](docs/06_TEST/TEST_01_負荷テスト仕様.txt) | 負荷テストの仕様・実行手順 | + +## 作者 + +Rinto Hasegawa, Shimoji Ryuki + +## ライセンス + +[MIT](LICENSE)