こんにちは!
クラウドエンジニアの浅野です。

今回は、Anthropicからリリースされ大きな話題を呼んでいるCLIツール「Claude Code」を実際に使ってみたので、その導入から実戦での活用までをレポートします。

結論から言うと、「優秀なエンジニアを一人雇ったのではないか」と錯覚するほどの衝撃でした。

微小な修正をAIに丸投げしてみる

今回は検証として、当サイトの問い合わせフォームにある「送信」ボタンのサイズ修正を依頼しました。

image1

(修正前の「送信」ボタン。PCで見ると普通ですが、スマホで見ると少し小さく押しにくいのが悩みでした)

わざわざエディタを開いてCSSのメディアクエリを調整するほどでもない、こうした「ちょっとした改善」にAIがどこまで応えてくれるかを試しました。

実施した手順

セットアップは非常にシンプルで、以下の流れで進めました。

1. ログインとインストール

まずはClaude Consoleにログインし、準備を整えます。インストールは以下のコマンドを実行しました。

irm https://claude.ai/install.ps1 | iex

2. 対象プロジェクトへの移動と実行

対象のプロジェクトディレクトリに移動し、claude コマンドを実行します。

※環境によってはコマンドへのPATH設定が必要になるので注意してください。

cd パス
claude

すると、ターミナルで利用するテキストスタイルの選択を求められます。

image2
(Claudeが実行された画面。好みのスタイルを選択すると対話が始まります)

コマンド実行後、ログイン方法の選択画面が表示されます。

image3
(アカウント連携の画面。今回はConsoleアカウントを選択しました)

これでClaudeが自分のアカウントと連携されました。

API利用にはクレジットチャージが必要とのことだったので、案内に従ってチャージを実施しました。

image4
(クレジットチャージ画面。まずは検証用に$5をチャージしました)

クレジット反映のタイムラグ

いざプロンプトにて命令を出したところ、以下のエラーが発生しました。

`Credit balance too low · Add funds: https://platform.claude.com/settings/billing`

ところが、チャージ直後はクレジットが反映されず、しばらく「残高不足」のエラーが出る状態が続きました。
一旦時間を置いてからログアウトし、再度アカウントを紐づけ直すことで、無事にプロンプトが打てる状態になりました。

image5
(チャージ&アカウント認証完了後のプロンプト。ようやく「Welcome back KIT!」と迎えてくれました)

ボタンサイズの修正依頼

準備が整ったので、以下の命令を投げました。

「contact.htmlの『送信』ボタンと文字がスマホで見ると小さいので適切な大きさにして。」

image6
(依頼を送信した画面。Claudeが思考(Thinking)を開始します)

命令を出すと、即座にプロジェクト内のコードが読み取られ、具体的なCSSの修正案が提示されました。

image7
(修正の提案画面。スマホ向けのメディアクエリを自動で生成してくれています)

内容を確認して「Yes」を選択すると、手元のファイルが自動で編集されます。 修正が完了すると、何を変更したのかのサマリーが表示されました。

image8
(提案に対して了承後の修正完了画面。フォントサイズや幅の設定が完了したことがわかります)

ブラウザで確認したところ、コードを一行も書くことなく、ボタンが適切な大きさに修正されていました。

image9
(「送信」ボタンが大きくなった結果。モバイルでも非常に押しやすくなりました!)

使ってみて感じた「Claude Code」の凄み

ボタン修正以外にもいろいろ頼んでみたところ、驚きの連続でした。

  • 高い対応力: ほかにもいくつか複雑な依頼を試しましたが、文脈を汲み取って問題なくこなしてくれました。
  • アバウトな依頼への提案: 「改善したい」といったアバウトな依頼でも、既存コードを読み込んで複数の改善提案を出してくれます。
  • 対話的な意思決定: 「どれから対応するか?」「今回はやめておくか?」といった選択肢を提示してくれるため、人間は判断に集中できます。
  • Git連携の便利さGitのプッシュまで代行してくれるのは本当に楽です。コミットメッセージも適切に考えてくれるので、まさにエンジニアを雇ったような感覚です。

コスト面での気づき

便利すぎていろいろ試していたら、最終的に USD 3.01 ほど消費していました。
API利用料としては想定よりもかなり早いペースで減っていく感覚があったので、利用する際は残高に注意が必要かもしれません。

これからのエンジニアに求められるもの

フリーランスエンジニアとして活動する私にとって、Claude Codeは最強の味方になりそうです。

実は手が回らずに作成を一時中断していたWebアプリがあったのですが、「これがあれば再開できそうだ」と確信しました。

今後、開発者がコードを書く必要性は薄れていくかもしれませんが、AIの提案に対して「善悪(最適かどうか)の判断をする能力」はずっと必要とされるはずです。

その判断にはやはり経験や基礎能力が不可欠であり、AI時代においてもコーディングスキルそのものは、形を変えて依然として重要であると感じました。