Claude Code運用のベストプラクティスと細々としたTipsを残しておきます。
① Claude Code or Claude Desktopで要件定義を行う
アプリを形にするには、詳細な要件定義が肝心です。Claude CodeもしくはClaude Desktopで「○○というアプリを作るので、僕にヒアリングしてください」と問いかけましょう。
Claudeが人間にヒアリングしてくれるので、痒いところまで要件を詰める事ができます。ヒアリングが終わったら「今までの内容をマークダウンファイルで要件定義書を作成して」と依頼します。Claudeであれば、アーティファクトで作成してもらい、Claude Codeであれば、CLAUDE.md
ファイルまたは/docs/requirements.md
ファイルに書き出してもらいましょう。
ステップ③で、この要件定義書から細かい実行ファイルに分割してもらいます。次のステップで早速プロジェクト作成を開始します。
② TailwindCSSを使うなら、まずは手動でプロジェクトの初期化を行う
TailwindCSSを使うプロジェクト、例えばNext.jsを使った開発であれば、手動でnpx create-next-app@latest pj-name
を実行しましょう。
理由はClaude CodeはTailwindCSSのセットアップが苦手だからです。TailwindCSSがv4になったのが原因かなと思います。これも後に修正されると思いますが、今のところは手動でプロジェクトを立ちあげましょう。
③ /initコマンドを実行する
初期化コマンドの/init
を実行してCLAUDE.mdファイルを作成しましょう。ここにステップ①で作った要件定義書を貼り付けます。
また、要件の中に「実装する上で守ってほしいルール」も記載することをおすすめします。例えば
- Next.js App Routerのベストプラクティス
- Supabase AuthとNext.jsのベストプラクティス etc…
まで記載しておくことがベターです。ベストプラクティスはそれぞれGoogle検索でドキュメントのURLをClaude Codeで渡せば読んでくれます。それを追記させましょう。おすすめのドキュメントは以下です。
- https://zenn.dev/akfm/books/nextjs-basic-principle
- https://supabase.com/docs/guides/auth/server-side/nextjs
これで、Claude Codeが今から作るプロジェクトを理解することができます。
④ 機能チケット毎にファイルを分割する
Claude Codeでは「並列開発」が可能です。そのために、CLAUDE.mdファイルで作った要件を機能ごとにチケットに分割する作業を行います。Claude Codeに以下の指示を与えてください。
「CLAUDE.mdに記載されている要件定義書を元に、/docs配下に機能毎に連番でチケット(001, 002, 003, …)を作成してください。それぞれのファイルでTodoも管理したいので-[]としてTodoの記載もお願いします。後でClaude Codeで並列で開発をします。」
これで連番でチケット作成をしてくれます。
その他:Claude Code上級者Tips
より細かい設定でClaude Code開発の時短になるTipsを紹介していきます。