ローカル開発方法 - Ryo555-pra/trading-app GitHub Wiki
ローカル開発方法
このページでは、Trading App のローカル環境での開発・実行方法について説明します。
📁 ディレクトリ構成(概要)
trading-app/
├── frontend/ # Reactフロントエンド
├── src/ # Javaソースコード(Spring Boot)
├── sql/ # 初期SQLファイル(テーブル作成など)
├── build.gradle.kts # Gradleビルド設定
└── README.md
⚙️ バックエンド(Spring Boot)実行方法
- プロジェクトルートに移動
cd trading-app
- アプリケーションを起動
./gradlew bootRun
- 起動後、APIは
http://localhost:8080
で待ち受けます。
💻 フロントエンド(React)実行方法
frontend/
ディレクトリに移動
cd frontend
- 依存ライブラリをインストール
npm install
- 開発サーバーを起動
npm run dev
- 起動後、ブラウザで下記URLにアクセスしてください:
http://localhost:5173
※ フロントエンドはバックエンドの API に http://localhost:8080
経由で接続します。
🔁 同期タイミングと注意点
- フロントエンドとバックエンドは別プロセスで同時に起動する必要があります。
- バックエンドを修正した場合:
bootRun
を再実行 - フロントエンドを修正した場合:Vite の
npm run dev
により自動で再読み込みされます
📝 .env / application.yml の例(PostgreSQL設定)
spring:
datasource:
url: jdbc:postgresql://localhost:5432/trading_app
username: postgres
password: password
または .env
ファイルに以下を記述することで環境変数で管理できます。
ご不明な点は FAQ(よくある質問) を参照してください。
---