info 当サイトはアフィリエイト広告を利用しています
技術箱

フロントエンド現場で使っているAIコーディング支援ツールと使用感のまとめ

最近エンジニアの現場では、AIコーディング支援ツールを使うことが当たり前になってきたと思います。

元々個人では、ChatGPTClaudeを使用することがありましたが、
今の職場では会社として開発生産性を向上させることを目的に、様々なAIコーディング支援ツールを使用しています。

今回は私がこれまで使用してきたAIコーディング支援ツールと実際の使用感について紹介していきたいと思います✨

私が使用してきたAIコーディング支援ツール

私がこれまで使用したことのあるものは以下です。

一つ一つ使用感について書いていきます。

各AIコーディング支援ツールの使用感レビュー


前提情報ですが、私はVS Codeの拡張機能として各AIツールを使用しています!

Claude Code

個人的には、Claude Codeが一番気に入っています。
というのも、単なるコード生成やコード改修に留まらず、Git操作などターミナル操作についても自動的に行なってくれるので、総合点が高い印象です。

check_circle よく使用している例

  • 新規コードの生成
  • バグの修正
  • 実装方針についての壁打ち
  • コードから既存仕様について言語化してもらう
  • コードレビュー
  • GIt操作やターミナル操作などを代わりにしてもらう
  • ultrathinkモードでの深層分析
  • パッケージのアップグレード

というように色々な場面で使っているのですが、
今回はこの中からいくつか抜粋して紹介します💡

コードから既存仕様について言語化してもらう

システムの仕様は、仕様書などのドキュメントにまとめられていることがほとんどかと思いますが、
ちゃんとメンテナンスがされず情報が古くなっている/結局見てもわからない、というのはよくある話ではないでしょうか。

そのため、コード = 仕様 という考えから、実際にコードを見た方が仕様を把握するのには正確だと考えています。

とはいえ、膨大なソースコードを把握することは現実的に無理ですよね。

私があるタイミングで、プロジェクト異動が命じられ、そのプロダクトの仕様についてキャッチアップしなければいけないときがありました。

そのときに、Claude Codeを使ってリポジトリを読み込んでもらい、
全体像の説明から、細かい仕様までをすべて説明してもらいました。

オンボーディングのときは、大体コードリーディングが必要になってくると思いますが、
こういったAIツールを使うことで、格段に効率がアップしたなと思います!

ちょこすこーん

私はフロントエンド専門なので、バックエンドの処理についてもClaude Codeに説明してもらえたことでかなり助かりました!

ultrathinkモードでの深層分析

皆さん、ultrathinkモードって使っていますか?

使っていない方は是非一度使用してみてほしいのですが、
ultrathinkというキーワードをプロンプトに含めることで、
より深い分析をしてくれるようになります。

実際に私もClaude Codeを使っている中で、
ultrathinkを使用したときと、そうでないときの回答精度を比較してみたのですが、全く異なっていることがあり、
最近では、ほぼすべてのプロンプトにultrathinkをつけるようにしています。

もしまだ使ったことがないという方は、是非一度使ってみてください💡

ちょこすこーん

ただし、ultrathinkモードを使うと消費されるトークンが増えるので、コスト面では注意が必要です⚠️

Github Copilot

Github Copilotは主にコード補完が便利で使用しています。
かなり精度が高く、実装する際にはとても助かっています。

ですが、最近は単なる補完ツールとしてではなく、
Github CopilotのAgentモードを利用して開発することが増えてきました。

Claude Opus のモデルが賢すぎる

Claude Codeを使い始めたとき、
Github CopilotのAgentモードも同時に使用し、比較していたのですが、

そのときはClaude Codeの方が精度が高かったことから、Github Copilotを使うことはほとんど無くなりました。

ですが、Githubが2025年11月24日に「Claude Opus 4.5」のモデルを公開したのですが、
このモデルがかなり賢く、最近はClaude CodeよりもGithub Copilotを使う頻度の方が高くなってきました。

check_circle

  • バグや不具合の原因調査
  • コードの実装/改修
  • テストコードの作成

このような作業については、最近はほどんとAI任せで行っています。

自分が手を動かすより、圧倒的に速いスピードで作業を終わらせてくれますし、
ほとんど手直しせずに完了することも多くなってきました。

ちょこすこーん

使用するモデルによって精度はかなり異なってくるので、色々なモデルを試してみてください!最新のオススメは、Claude Opus 4.5 です💡

Continue

Continue は、Claude CodeやGithub Copilotを使用する前に試していました。

結局のところ、あまり使うことなく終わってしまいました。
使用時期的にも、AIコーディングが流行し始めたときで、そのときは精度的にもそこまで高くなかったと記憶しています。

今はどうなっているかはわからないのですが、
Claude CodeやGithub Colipotがあるので、敢えて使用するといったことはないかなと思います。

Cline

Clineも一時期使用してみたのですが、
Claude Code や Github Copilotで賄えてしまうので、使用することはほとんど無くなりました。

職場でもClineの使用率が他のツールより低いことから、今では利用終了しています🙇‍♀️

PR-Agent

PR-Agentは、AIを活用してPRのレビューを自動化してくれるツールです。

check_circle PR-Agent の使用例

  1. 開発者がPRを作成する
  2. PR-Agentにレビューを行ってもらい、指摘修正をする
  3. 修正が完了したら、チームメンバーへレビュー依頼をする

このようなフローで取り入れていました。
ですが、個人的にはあまり使用感は良くなかった印象です。

check_circle 使用感が良くなかった理由

  • プッシュする度にレビューが行われ、同じことを何度も指摘される
  • 一度のレビューですべての指摘が返ってこない(レビューごとに新たな指摘が行われ、いつまでレビューをお願いすれば良いか迷う)
  • 指摘内容に対し、返信コメントをしても学習してくれないため何度も同じことを伝える必要がある(これは今は解決されているかも?)

このように使用する中で、いくつか微妙だなと感じる点があったため、積極的に使うのは少し避けていました。

タイポやケアレスミスなど見落としがちなポイントを教えてくれるのはとても有り難かったのですが...

今後AIレビューに関しては、Github Copilotのものを使おうかなと思っています。

普通の生成AIツールではダメなのか?


もしWebブラウザで使うAIサービスを使用して、コーディングをしているなら、
ぜひ一度今回紹介したAIコーディング支援ツールを使用してみてください。

理由としては以下です。

check_circle

  • エディタ内で使用できるため、ブラウザとエディタを行き来する必要がない
  • リポジトリ全体をAIが自動的に読み取ってくれるので、プロジェクトに沿った書き方や仕様を意識してくれる
  • 自動的にコードの修正/ファイル作成/コミット等まで行なってくれるので、開発作業全体の効率化を行うことができる

AIコーディング支援ツールが出てきたことにより、
実装の作業は本当に楽になってきたと思います。

私はまだまだ新米のフロントエンドエンジニアですが、
最近は何か分からないことがあってもほとんどはAIで解決できるようになってきたので、
先輩エンジニアに質問に行くということは減ってきたと感じています。

AIからの回答で学べる部分はかなり多いですし、
自走力は非常に上がったと思います(AI様様ですね...)

とはいえ、AIが出してきたものを何も考えずにマージするわけには行かないので、
人によるレビューは欠かせませんし、レビュースキルも非常に大事になってくると思います。

ちょこすこーん

ここはかなり課題ですね

おわりに


本記事では、私が使用したことのあるAIコーディング支援ツールについて紹介しました。

AIの成長スピードは著しいので1年後の状況はまた変化していると思いますが、
現時点での使用感や感想を記載してみました。

もし「まだ使用したことない」「使用してみようとおもったけどよく分からなくて試したことがない」
という方がいれば是非一度何か一つでも良いので試していただければと思います✨

この記事が参考になれば嬉しいです。

タイトルとURLをコピーしました