0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

CaludeCodeを使用したAIコーディングを試してみた

0
Last updated at Posted at 2026-09-27

はじめに

近年、ChatGPTやClaudeをはじめとする生成AIをコーディングに活用する「バイブコーディング」という開発スタイルが急速に広がっており、自分は、コーディングの際に分からない部分などがあれば生成AIに質問を行うなどの活用は行っていたのですが、これまで本格的にAIにコーディングを任せるような開発を行ったことがありませんでした。
そのため、ClaudeCodeを使用したバイブコーディングで、タスク管理のWebアプリケーションの作成を試してみました。

開発の実施

Claude Codeの導入

今回Claude CodeはVSCodeの拡張機能として追加し、エディタ上のチャットパネルから直接対話しながら実装を進める形で使いました。ターミナルを別途開かず、コード編集・ビルド・テスト実行・git操作まで一連の流れをすべてClaude Codeとのやり取りの中で完結させています。

導入にあたっては、まずAnthropicのアカウントを作成しClaudeのサブスクリプションプランを契約したうえで、VSCodeの拡張機能マーケットプレイスから「Claude Code」を検索してインストールしました。インストール後は拡張機能からAnthropicアカウントでログイン認証を行い、対象のプロジェクトフォルダをVSCodeで開くだけで、エディタ上のチャットパネルからすぐに利用を開始できました。

開発の進め方

実装は基本的に次のサイクルの繰り返しで進めました。

  1. 要望を伝える(「カレンダーに本日の日付が分かるようにしたい」など、機能追加や改善を自然文で依頼)
  2. 調査: Claude Codeが該当するコントローラー・サービス・テンプレートなどの既存実装を読み、設計方針(パッケージ構成、命名規則、既存のテストパターンなど)を把握してから変更方針を提案
  3. 提案・すり合わせ: 変更規模が大きい場合は「プランモード」という仕組みが使われ、実装前に調査結果と設計方針をまとめたプラン(計画書)を提示してくれる。内容に疑問点があれば選択式の質問で確認してくれるので、認識のズレをコードを書く前に解消できる
  4. 実装: 既存のコードスタイル(Controllerは薄く、業務ロジックはServiceに寄せる、コンストラクタインジェクション主体のMockitoテストなど)に合わせてコードを追加・修正
  5. 動作確認: mvn testでユニットテストを実行するだけでなく、実際にmvn spring-boot:runでアプリを起動し、curlや画面操作を通じてブラウザ上での見た目・挙動まで確認してから完了報告される
  6. コミット・プッシュ: 動作確認が取れた内容だけをその都度コミットし、都度自分の承認を得たうえでリモートへプッシュ

例えば「ダッシュボードに継続日数や目標達成率を追加したい」という曖昧な要望を伝えた際は、いきなり実装が始まるのではなく、

  • 既存のダッシュボード実装・テストパターンを調査した上で選択肢を提示してくれる
  • 「学習ストリークとゴールトラッキング、どちらを先に実装するか」といった優先順位を選択式で確認される
  • 目標値を保存する仕組みが元々アプリになかったため、DBのテーブル追加を含む実装方針が事前に文章化され、承認してから着手される

という流れで進みました。「なんとなく丸投げして終わり」ではなく、要所要所で人間側の判断を挟みながら進められる点は、想像していたバイブコーディングよりも手堅い印象でした。

最終的な成果物

開発の進め方に記載の方法でAIにコーディング等を行わせた結果、以下のような画面を持つWebアプリケーションが開発できました。

・カレンダー画面 各日の計画、実績を押下することでその日のタスクの計画と実績を入力可能
image.png

・計画登録画面
image.png

・実績登録画面
image.png

ClaudeCodeを使用した感想

数回のやり取りでアプリケーションの作成や機能追加などが行え、自分が一から作成するよりも簡単、短時間で画面を作成することができました。
また、不具合についても数回発生して自分が動作確認で気が付いた際に指示を出し、修正を行わせたが、自身で作成する際よりも体感不具合の数は少なくなりました。
ただし、今回は試しに使用したこともあり、全てClaudeCodeへの指示で作成を行ったため、コードの中身の確認が行えておらず、想定外のバグが残っている可能性は十分にあります。
そのため、実際にClaudeCodeなどのAIコーディングツールを使用する際は、安全に使用するための対策を学び、適切に使用できるよう心がけたいと思いました。
また、今回のように一切コードを自身で書かず、AIに任せると、コードを書く機会がなくなり、AIを使用しないと十分に開発がすすめられない、と言ったことになる可能性もあるため、AIコーディングツールについて学ぶのと並行して、プログラミング自体の学習についても今後続けていきたいと思いました。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?