ローカル開発ガイド
このドキュメントでは、Rin プロジェクトをローカルで開発およびデバッグする方法を説明します。
クイックスタート
1. プロジェクトをクローン
または
2. 依存関係をインストール
3. 環境変数を設定
4. 開発サーバーを起動
これにより自動的に以下が実行されます:
- ✅
wrangler.toml設定ファイルを生成 - ✅
.dev.vars機密情報ファイルを生成 - ✅ データベースマイグレーションを実行
- ✅ 開発サーバーを起動(ポート 11498 - フロントエンドとバックエンドを統合)
http://localhost:11498 にアクセスして開発を開始してください!
環境変数の設定
すべての設定は .env.local ファイルに集約されています:
サイト設定
:::tip サイト設定(名前、アバター、説明、ページネーションサイズなど)は現在バックエンドから動的に提供され、デプロイ後に設定ページから変更できます。環境変数はデフォルト値としてのみ使用されます。
以下の環境変数は任意です:
バックエンド設定
機密設定(必須)
よく使うコマンド
開発ワークフロー
初回セットアップ
- プロジェクトリポジトリをフォーク
- ローカルにクローン
- 依存関係をインストール:
bun install .env.localを設定bun run devを実行
日常の開発
- コードを変更
- フロントエンドは自動ホットリロード、バックエンドは変更時に自動再起動
- 機能をテスト
- コードをコミット
データベースの変更
server/src/db/schema.tsを変更bun run db:generateを実行してマイグレーションファイルを生成bun run db:migrateを実行してマイグレーションを適用
テスト
プロジェクトはクライアントとサーバーで異なるテストフレームワークを使用しています:
クライアントテスト(Vitest)
クライアントテストは React コンポーネントテスト用に jsdom 環境で Vitest を使用します。
テストファイルの場所: client/src/**/__tests__/*.test.ts
サーバーテスト(Bun)
サーバーテストはインメモリ SQLite データベースで Bun のネイティブテストランナーを使用します。
テストファイルの場所:
- ユニットテスト:
server/src/**/__tests__/*.test.ts - 統合テスト:
server/tests/integration/ - セキュリティテスト:
server/tests/security/
新しいテストの追加
新機能を追加する際は、対応するテストを含めてください:
- クライアント:
client/src/**/__tests__/*.test.tsにテストを追加 - サーバー:
server/src/**/__tests__/*.test.tsまたはserver/tests/にテストを追加
API アーキテクチャ
カスタム API クライアント
プロジェクトは型安全な API 通信のために Eden の代わりにカスタム HTTP クライアントを使用します:
- 場所:
client/src/api/client.ts - 機能: 型安全なリクエスト、エラーハンドリング、認証トークン管理
- 使用方法: すべての API 呼び出しは型付きクライアントを経由します
共有型(@rin/api)
@rin/api パッケージはクライアントとサーバーの両方に共有 TypeScript 型を提供します:
- 場所:
packages/api/ - 目的: API 契約のエンドツーエンド型安全性
- 使用方法: クライアントとサーバーコードの両方で
@rin/apiから型をインポート
新しい API エンドポイントを追加する場合:
packages/api/src/types.tsに型を定義server/src/services/にサーバーハンドラーを実装- クライアントは共有型を通じて自動的に型安全性を得る
トラブルシューティング
ポートが既に使用中
ポート 5173 または 11498 が使用中の場合、.env.local の設定を変更できます:
データベースマイグレーションに失敗した
設定ファイルが生成されない
GitHub OAuth 設定
ローカル開発では GitHub OAuth を設定する必要があります:
- https://github.com/settings/developers にアクセス
- 新しい OAuth App を作成
- Authorization callback URL:
http://localhost:11498/api/user/github/callback - Client ID と Client Secret を
.env.localに記入
プロジェクト構造
本番デプロイ
本番デプロイ手順については デプロイガイド を参照してください。
ヘルプ
- 📖 羊角快車二次創作版ドキュメント
- 🐛 羊角快車二次創作版 issues
- 💬 羊角快車二次創作版 discussions
- 📖 公式アップストリームドキュメント
- 💬 公式アップストリーム Discord: https://discord.gg/JWbSTHvAPN