development.md

開発資料

開発環境の準備

開発環境を構築するために必要な手順です。一度実行すればOKです。

1. Node.jsのインストール

Node.jsをインストールします。すでにインストールされている場合はスキップしてください。

https://nodejs.org/enからダウンロードしてインストールします。 LTS版で問題ありません。

インストール後、バージョンを確認します。

node -v

v21.X.Xのようにバージョンが表示されればOKです。

2. pnpmのインストール

本プロジェクトではパッケージマネージャーとしてpnpmを使用しています。 pnpmをインストールします。すでにインストールされている場合はスキップしてください。

corepackを使用してpnpmインストールします。(corepack自体はNode.jsのインストール時に勝手にインストールされています。)

corepack enable

3. 依存パッケージのインストール

pnpm install

開発サーバーの起動

pnpm run dev

http://localhost:3000で開発サーバーが起動します。

APIクライアントの生成

バックエンドのOpenAPIに変更があった場合は、APIクライアントを再生成する必要があります。 openapi-generator-cliを使用しています。 次のコマンドを実行すると、src/lib/api以下にAPIクライアントが生成されます。実行にはDockerが必要です。

pnpm run gen:api-client

APIモックの作成

本アプリの開発環境ではMock Service Workerを使用してAPIモックを作成しています。

OpenAPI定義からモックを自動生成する場合は、次のコマンドを実行します。src/mocks/handlers.tsが上書きされます。この自動生成にはzoubingwu/msw-auto-mockを使用しています。

pnpm run gen:api-mock

手動でモックを作成する場合は、src/mocks/handlers.tsを編集してください。