dackdive's blog

新米webエンジニアによる技術ブログ。JavaScript(React), Salesforce, Python など

CursorでWebアプリ個人開発メモ Day1:要件定義と技術選定

Devin の記事とか読んで自分も手を動かさないとだめだと思ったので、個人開発でちょっとずつ試してみることにする。
Devin は個人で契約するには厳しいので Cursor を使ってみる。

Cline を一瞬試していたのだが、併用する DeepSeek がセキュリティ上懸念がありそうで(個人開発なら別にいいけど)
そうすると Cursor の代わりに Cline + LLM の何か、をわざわざ選択する理由があまり浮かばず
まずは Cursor に慣れることにした。

前提

Cursor は $20/月の Pro プラン を契約する。
また、Yolo モードを有効にして git, npm あたりのコマンドを許可しておく。

基本的に Composer の agent モードで動かしている。

進捗はここのリポジトリで管理する。

要件定義

Cursor を使って何作ろうかなと考えた結果、なんとなく前から作りたいと思ってたアプリを題材にすることにした。
が、詳細な要件を自分で考えるのも面倒なので、そもそもの要件を言語化するところから依頼した。

とあるWebアプリケーションを開発したいです。 まず、要件定義から一緒に始めましょう。なお、ここで決まったことはdocs/spec.mdとしてドキュメントに残すことにします。

その後、指示通りファイルを作ってくれて、質問に答えながら要件定義書っぽいドキュメントが作成されていく。

技術スタックの選定

要件がなんとなくわかったので、次は技術スタックを決めたい。ここも Cursor に相談する。

だいたいいい感じかなー。Remix とか shadcn/ui を使ってみたいですという注文をつける。
また、DB やホスティング先のサービス選定については、いくつかの選択肢から比較検討したい。
ので、ADR(Architecture Decision Record)を書いたうえで決定しませんかとお願いしてみる。

Cursor が提案してくれたものに「AWS だったらどうです?」みたいな選択肢を追加しつつ、一旦 Supabase と Fly.io でいくことに決める。また画像の保存先は Cloudinary がいいらしい。

これらの意思決定は docs/adrs/ 配下 に残しておく。

※決めたあとで、全部 Cloudflare のサービスでできないか?と思った。今度相談してみる

タスク管理ファイル(todo.md)の作成

技術選定が終わったら、向こうから「こんな感じで進めましょうか」という提案があった。
これを todo.md としてリポジトリで管理しながら進めることにする。

Remix プロジェクトのセットアップ

TODO の1個目にあった Remix プロジェクトの作成をやってもらう。
ここも基本的には提案されたコマンドを実行する、もしくは勝手に実行するのを眺めているだけ。

最初なんか存在しないテンプレを使おうとして失敗してるが自分で軌道修正してた。

プロジェクトの雛形ができあがったあとで、少し難易度高そうな注文をする。

依存ライブラリを極力減らしたいので、ESLintではなくBiomeを使いたいです

これはしばらく一人で試行錯誤してた。

なぜか古いバージョンの Biome を入れて解決しようとしてたので、そこは最後に指摘する。

.cursorrules の作成

これは実際には Biome のバージョン変更ではなく ESLint → Biome への移行が差分に含まれる。
あとさっきまで英語でコミットしてくれてたのに急に日本語になる。

コミットメッセージは今までと同じように英語でお願いします。 また、今後も同様なのでcursorrulesに書いておきたいです

これで一度 docs/cursorrules.md にファイルを作り始めたんだけど違う違う .cursorrules だよっつって直させる。

作業ログも残す

作業した内容と、Cursor を使って作業したふりかえりをログとして残せるといいかなと思い提案してみる。

私の所感ではなく Cursor の所感を勝手に書かれたので違うそうじゃないと訂正。

これで今日のところは終わり。

今日のコスト

Cline の、セッションごとにコスト表示してくれるやつ好きだったな。

わからないこと