🌟
Cline 活用備忘録
最近話題のAIエージェント「Cline」だが、実際に開発に使うときには何かと工夫が必要。
Clineで開発するときに役立つ考え方をまとめておく。
Copilotとの比較
VSCodeのCopilotは一度にあまり多くの処理ができないし、参照しているコード範囲も狭い印象。
インラインで簡単な編集をするには向いているが、ファイル全体を大きく変えたり、プロジェクト全体に関わる編集をするには、Cline方が圧倒的に優秀な印象。
API Provider
ModelはClaude-3.5-sonnet:beta
が良さそう。
普通にAnthropicのAPIを使うと、RateLimitに引っかかる可能性があるので、OpenRouter
を使うのが良い。
パッケージ管理
何も言わないと、package.json
を勝手に書き換えようとする。
すると、依存関係が崩れてしまい、依存関係をLLMで直そうとする無限エラー地獄になる可能性がある。
そのため、ClineのCustom Instructionに
パッケージ操作はpackage.jsonを直接編集せず、必ずnpmを用いる
などと指示を書いておく。
Gitについて
何か変なことをしたら戻せるように、コミットはこまめに行なっておいたほうがいい。
Clineは一度に大量のファイルを修正することがあるので、貯めてしまうと、何を修正したんだかわからなくなる。
実際に使ってみた技術スタック
- フレームワーク:Next.js (14系)
- 言語:TypeScript
- CSS: TailwindCSS
- DB:Supabase → migrationsで管理するように明示するのが良い
- サーバ:Vercel
- 決済機能:Stripe
UIライブラリ
MaterialUIやNextUIは使いたくなるが、無限エラー地獄の原因になるのであまり推奨しない。
TailwindCSSだけで構築するほうがスムーズだった。
Cron(定期実行)
VercelにCronがあるので、それを使うように依頼するのが良い。
ブラウザ操作
Clineがブラウザ操作をして動作をチェックすることがあるが、まあまあ精度が低く、それによって現状のステータスを誤って理解してしまう可能性があるので、あまりおすすめしない。場合によっては、キャンセルしたほうがいいくらい。
Discussion