開発環境セットアップ
BluePeriodのローカル開発環境を構築する手順
開発環境セットアップ
ディレクトリ用語の定義
本ドキュメントでは、以下のディレクトリを区別して記載します。
| 用語 | パス | 説明 |
|---|---|---|
| プロジェクトルート | blueperiod/ | README.md や package.json が配置されている一番上の階層 |
| アプリケーションディレクトリ | next-app/ | Next.js のソースコード |
| デスクトップアプリ用ディレクトリ | tauri-app/ | Tauri (Rust) の設定とソースコード |
前提条件
以下のツールが必要です。
- Bun — JavaScript ランタイムおよびパッケージマネージャー
- Docker Desktop — ローカルSupabase環境用
- Supabase — プロジェクトのデータベース・同期基盤
- APIキー — Google AI Studio または OpenRouter
- Rust ツールチェーン — デスクトップ版の開発・ビルドに必要(Web版のみの場合は不要)
インストールとローカル開発
1. リポジトリをクローン
git clone https://github.com/miyahara-aika/blueperiod.git
cd blueperiod2. 依存関係をインストール
各サブプロジェクトが独立したパッケージとして管理されているため、作業するプロジェクトのディレクトリで個別にインストールします。
# ルートのdevDependencies(Biome, TypeScript等)
bun install
# アプリ本体(必須)
cd next-app && bun install
# ドキュメントサイト(開発する場合)
cd fumadocs && bun install
# LP(開発する場合)
cd astro && bun installデスクトップ版(Tauri)の依存関係
デスクトップ版を開発する場合は、Rustツールチェーンのインストールに加えて、初回のCargo依存関係ビルドが必要です。
- 必須:Rustツールチェーンのインストール(未導入の場合)Install Rust - Rust Programming Language
- 次にCargo依存関係のダウンロードとビルドをします(初回のみ)
# Cargo依存関係のダウンロードとビルド(初回のみ)
cd tauri-app/src-tauri && cargo checkcargo check はコンパイルチェックのみを行い、実行可能ファイルは生成しません。初回はRustの依存クレートのコンパイルに数分かかります。以降は bun tauri 実行時に差分ビルドが行われます。
3. Supabase 開発環境のセットアップ
プロジェクトのデータベースと同期基盤を準備します。本番環境(Remote)とローカル環境(Local)のどちらかを選択してください。
A. ローカル開発環境(推奨)
Docker Desktop を使用して、PC 内に隔離された Supabase 環境を構築します。
# DBの起動とステータス確認
bun supa初回起動時に表示されるキー(Anon Key、Service Role Key)を next-app/.env.local_db に記述します。サンプルファイルをコピーして使用してください。
cd next-app
cp .env.local_db.sample .env.local_db
# 表示されたキーを .env.local_db に記述Windows環境: Hyper-Vの動的ポート予約との競合を回避するため、本プロジェクトはポート
2543xを使用します(supabase/config.tomlで設定済み)。
B. 本番(Remote)プロジェクトとの連携
# ログイン (初回のみ)
bunx supabase login
# プロジェクトと連携
bunx supabase link --project-ref <YOUR-PROJECT-REF>
# データベースマイグレーションを適用
bunx supabase db pushローカル開発の詳細は
"ローカル開発リファレンス": 2026-03-30_0100_reference_local-supabase-development.mdを参照してください。
4. 環境変数を設定
next-app ディレクトリに移動し、サンプルファイルをコピーして .env.local を作成します。
cd next-app
cp .env.local.sample .env.local- 本番用 (
.env.local): 本番の URL と Anon Key を記述します。 - ローカル用 (
.env.local_db):http://localhost:25432などのローカル設定を記述します。
.env.local.sampleに必要な変数名の詳細が記載されています。
5. 開発サーバーを起動
用途に合わせてコマンドを使い分けます。全てのリクエストはデフォルトで Port 3703 を使用します。
| 環境 | Web (Next.js) | Desktop (Tauri) |
|---|---|---|
| ローカルDB (Docker) | bun next:local | bun tauri:local |
| 本番DB (Remote) | bun next | bun tauri |
ローカルDB版は、実行時に自動で supabase start が行われます。
ブラウザで http://localhost:3703 を開きます。
Supabase 管理コマンド
| コマンド | 説明 |
|---|---|
bun supa | ローカルDBの起動+ステータス表示 |
bun supa:stop | コンテナ停止+データ削除 |
bun supa:reset | ローカルDBの全再構築 |
型生成
| コマンド | 対象 | 説明 |
|---|---|---|
bun next:gen:types | 本番DB | --linked で本番スキーマからTypeScript型を生成 |
bun next:gen:types:local | ローカルDB | --local でローカルスキーマから型を生成 |
マイグレーション開発サイクル
1. マイグレーションファイル作成: bunx supabase migration new <name>
2. SQLを記述
3. ローカルに適用: bun supa:reset
4. 型を生成: bun next:gen:types:local
5. コードを修正
6. 本番に反映: bunx supabase db push
7. 本番の型を再生成: bun next:gen:typesデスクトップアプリの開発
BluePeriodは Tauri V2 を使用したデスクトップアプリケーションとしても提供されています。デスクトップ版では、ローカルLLM(LM Studio, Ollama等)とのCORS制限のない通信や、ネイティブファイルシステムへのアクセスが可能です。
開発モードの起動
# プロジェクトルートで実行
# 本番DB参照
bun tauri
# ローカルDB参照
bun tauri:localこのコマンドは、DBの起動、Next.jsの開発サーバーの準備、ネイティブウィンドウの表示をすべて自動で行います。
ビルド
# プロジェクトルートで実行
bun tauri:buildビルド成果物は tauri-app/src-tauri/target/release/bundle/ 配下に生成されます。
デスクトップアプリ開発の詳細は 17_tauri_development_guide を参照してください。
Rust / Cargo 開発について
デスクトップ版のネイティブ機能(Local LLMプロキシ等)はRustで実装されています。
- 依存関係の解決:
tauri-app/src-tauri/Cargo.tomlを編集した後は、bun tauriの実行時に自動的にダウンロード・ビルドされます。 - 手動チェック:
bun tauri:checkでRustコードのコンパイルエラーを確認できます(内部でcargo checkを実行)。 - デバッグ: Rust側の
println!やlog::info!の出力は、bun tauriを実行しているターミナルに表示されます。
品質チェック
PRを提出する前に、以下のコマンドでコードの品質を確認してください。
# 全サブプロジェクトの一括チェック(next, fuma, astro, tauri)
bun all:check
# 個別チェック
bun next:check # next-app の型チェック + Biome
bun fuma:check # fumadocs の型チェック + Biome
bun astro:check # astro の型チェック + Biome