ローカル開発方法 - 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)実行方法

  1. プロジェクトルートに移動
cd trading-app
  1. アプリケーションを起動
./gradlew bootRun
  1. 起動後、APIは http://localhost:8080 で待ち受けます。

💻 フロントエンド(React)実行方法

  1. frontend/ ディレクトリに移動
cd frontend
  1. 依存ライブラリをインストール
npm install
  1. 開発サーバーを起動
npm run dev
  1. 起動後、ブラウザで下記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(よくある質問) を参照してください。


---