ディレクトリを用意する
プロジェクトを作成するためのディレクトリを用意します。
任意の場所にexpense-tracker-app
ディレクトリを作成し、移動します。
mkdir expense-tracker-app
cd expense-tracker-app
移動したら、Cursorを開きます。
解説動画
YouTubeに解説動画を公開しています。
こちらもあわせて、ぜひご覧ください。
モノレポとは
まずは、モノレポのついて解説します。
モノレポとは、複数のプロジェクトやパッケージを単一のリポジトリで管理する開発手法です。
従来の方法では各プロジェクトを別々のリポジトリで管理しますが、モノレポではすべてを1つのリポジトリにまとめます。
主な特徴と利点は以下の通りです。
まずは、コード共有の容易さと依存関係管理の簡素化にあります。
1つのリポジトリ内にすべてのプロジェクトが存在するため、共通コンポーネントやユーティリティの再利用がスムーズになります。
また、開発環境とワークフローの一貫性も大きな利点です。
チーム全体が同じ設定、同じツール、同じルールの下で作業できるため、新メンバーの参加時やプロジェクト間の移動時の学習コストが大幅に削減されます。
さらに、APIの変更やライブラリのアップデートなど大規模な変更が必要になった場合、それをすべてのプロジェクトに一度に適用できる点も非常に効率的です。
最後に見逃せないのがテストの統合と自動化の容易さです。
全プロジェクトに対する統合テストを一カ所で管理でき、変更がシステム全体に与える影響を即座に確認できるため、品質保証プロセスが強化されます。
モノレポを構築するには、いろんなツールがあります。
今回はbun
が用意しているbun workspace
を導入します。
モノレポを構築する
それでは、CursorのAgentを使って、bun workspace
を導入してモノレポを構築しましょう。
構築した後に、詳しく解説します。
以下のプロンプトを使います。
https://bun.sh/guides/install/workspaces
URLを参考にモノレポを導入したい
workspacesはappsディレクトリを作成して
appsディレクトリには空のfrontendディレクトリと空のbackendディレクトリだけ用意して
frontendディレクトリとbackendディレクトリにpackage.jsonは要らない
.gitignoreを作成して
README.mdを作成して
プロンプトを解説します。
最初のURLはbun workspace
のドキュメントです。
Agentはネットの情報も参照できます。
次に、ドキュメント通りだと、workspaces
という名前でディレクトリが作成されるので、apps
という名前で作成するように指示します。
そして、apps
ディレクトリにはfrontend
ディレクトリとbackend
ディレクトリを作成する様に指示します。
ドキュメントを参考にしているので、frontend
ディレクトリとbackend
ディレクトリにpackage.json
を作成してしまいます。
そこで、package.json
を要らないと明確に指示します。
あとは、.gitignore
とREADME.md
を作成するように指示します。
それでは、貼り付けて実行します。
あえて、早送りはせずに見てください。
終わったら、Accept allをクリックしてください。
モノレポの構成を確認する
作成されたものを確認します。
apps
ディレクトリには、frontend
ディレクトリとbackend
ディレクトリが作成されています。
各ディレクトリを確認すると、どちらのディレクトリにも、package.json
はありません。
同じプロンプトを投げても、その都度結果が違うことがありますので、気をつけてください。
もし何かファイルが作成された場合は、削除しておいてください。
次にルートディレクトリのpackage.json
を見てみます。
{
"name": "expense-tracker-app",
"version": "1.0.0",
"description": "Expense Tracker Application Monorepo",
"private": true,
"workspaces": ["apps/*"],
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
root
のpackage.json
には、dependencies
やdevDependencies
などを含めてはいけません。
個々のパッケージは自己完結し、それ自身の依存関係を宣言すべきだからです。
そこで、private
はtrue
しておきます。
trueに設定することで、このパッケージが公開されないようにします。
モノレポのルートパッケージは通常、個別のパッケージとして公開する必要がないためです。
workspaces
はモノレポ内のワークスペースを指定します。
apps/*
は、apps
ディレクトリ内のfrontend
やbackend
などのサブディレクトリをワークスペースとして扱うことを意味します。
これにより、依存関係の管理やスクリプトの実行が容易になります。