Claude Codeとは？Web未経験エンジニアが2日でブログを立ち上げた体験記

この記事でわかること

• Claude Codeとは何か、どんなことができるのか
• Web未経験のエンジニアがClaude Codeで実際に作ったもの
• 使ってみて驚いたこと・正直に感じたデメリット
• Claude Codeが向いている人・おすすめの使い方

「プログラミングはAIに任せる時代」なんて言われても、正直ピンとこないですよね。

筆者のレイも、最初はそうでした。本業はIoT系のシステムエンジニアで、C#やPythonは日常的に書いていますが、HTMLやCSSはほぼ未経験。
ブログを作りたいと思っても、Webの知識がなくて踏み出せずにいました。

そんなとき出会ったのがClaude Codeです。
結論から言うと、わずか2〜3日でブログの立ち上げからツール開発まで完了しました。

この記事では、実際にClaude Codeを使って何をどう作ったのか、驚いたこと、そして正直に感じたデメリットまで、体験ベースでお伝えします。

Claude Codeとは？

Claude Codeは、AIスタートアップのAnthropic（アンソロピック）が提供するCLIベースのAIコーディングツールです。CLIとは「コマンドラインインターフェース」の略で、ターミナル（黒い画面）から操作するタイプのツールです。

具体的にできることは以下の通りです。

ChatGPTやClaudeのチャット画面との大きな違いは、ファイルを直接読み書きできる点です。
チャットでコードを生成してコピペする必要がなく、AIがプロジェクトフォルダの中身を理解した上で、直接ファイルを作成・編集してくれます。

「バイブコーディング」という新しいスタイル

Claude Codeのようなツールを使ったプログラミングは、「バイブコーディング（Vibe Coding）」と呼ばれています。

従来のプログラミングが「一行ずつコードを書く」作業だったのに対し、バイブコーディングは「やりたいことをAIに伝えて、AIがコードを書く」スタイルです。
自分はディレクター（指示する側）、AIはプログラマー（実装する側）のような関係です。

プログラミングの経験が浅くても、「何を作りたいか」を言語化できれば、AIが形にしてくれる。
これがバイブコーディングの最大の魅力です。

なぜClaude Codeを使い始めたのか

筆者の本業はIoTシステムエンジニアです。工場のクレーン自動化や点群処理（3Dスキャンデータの解析）など、かなりニッチな分野で仕事をしています。

普段使っている言語はC#、C++、Pythonで、Web系の技術（HTML/CSS/JavaScript）はほぼ触ったことがありませんでした。

Claude Codeを使い始めたきっかけは、シンプルに「仕事の効率化」です。

• 本業でもAIの活用が少しずつ増えてきて、その進化を肌で感じていた
• 副業でブログを始めたいけど、Web制作の知識がない
• 「AIに任せれば、自分の弱点を補えるのでは？」と思った

要するに、やりたいことはあるけど技術力が足りないという状態でした。
でもClaude Codeなら、自分が得意な「やりたいことを言語化する力」だけで、足りない技術力をカバーできるのではないかと考えたのです。

実際にClaude Codeで作ったもの

ここからは、筆者がClaude Codeを使って実際に作ったものを紹介します。
これらをわずか2〜3日で完成させました。

1. ブログのカスタムCSS

WordPressのCocoonテーマをベースに、見出しデザインやボタンの装飾をカスタムCSSで実装しました。CSSの知識がほぼゼロでも、「こんな見た目にしたい」とClaude Codeに伝えるだけで、コードが出力されます。

2. AIツール診断ツール

読者が自分に合ったAIツールを見つけられるインタラクティブな診断コンテンツを作りました。HTML・CSS・JavaScriptで構成されており、質問に答えていくとおすすめのAIツールが表示されます。

3. プロンプトジェネレーター

用途を選ぶだけでAIへのプロンプト（指示文）が自動生成されるプロンプトジェネレーターも作りました。
「メール作成」「ブログ執筆」などの用途を選択すると、すぐに使えるプロンプトが表示されます。

4. ブログ記事10本のHTML骨組み

記事のHTML構造（見出し・段落・表・リスト）を10記事分まとめて生成しました。
後述しますが、これが一番驚いた瞬間です。

5. 構造化データ（JSON-LD）

SEO対策として重要な構造化データ（検索エンジンにページ内容を正しく伝えるためのコード）も、Claude Codeで生成しました。
手作業で書くと間違えやすい部分ですが、AIなら正確に出力してくれます。

もしClaude Codeがなかったら、これらを作れたとしても何倍もの時間がかかっていたと思います。特にCSS装飾や診断ツールは、Web未経験の自分だけでは相当苦戦していたはずです。

驚いたこと3つ

Claude Codeを使ってみて、特に驚いたことを3つ紹介します。

1. 10記事の骨組みが一気にできた

これが一番衝撃的でした。

ブログ記事のHTML骨組みを10本分、まとめて作成する指示を出したところ、数分で全記事のベースが完成。通常なら各記事の構成を考えて、見出しを決めて、HTMLに落とし込んで…と、数週間はかかる作業です。

もちろん、AIが出力した骨組みをそのまま公開するわけではありません。ここから自分の体験や独自の視点を追加していく作業が必要です。
でも、ゼロから始めるのと骨組みがある状態から始めるのでは、スピードがまるで違います。

2. コードの品質が想像以上に高い

正直、AIが生成するコードは「とりあえず動く」レベルだと思っていました。
ところが実際には、そのまま使えるクオリティのコードが出てきます。

• HTML構造が正しく、セマンティック（意味的に正しい）タグが使われている
• CSSがきれいに整理されていて、レスポンシブ対応もされている
• JavaScriptのロジックも破綻がない

本業でC#やPythonのコードを見慣れている筆者から見ても、「これ、手直しほぼ要らないな」と思うことが多かったです。

3. Web未経験でも使えた

HTMLやCSSをほとんど知らない状態で始めましたが、問題なく使えました。

大事なのは「何を作りたいか」を具体的に伝えることです。
たとえば「見出しの左に青い縦線をつけたい」「ボタンをホバーしたら色が変わるようにしたい」といった日本語での指示だけで、AIがコードに変換してくれます。

プログラミング経験があると有利な場面もありますが（エラーの原因を推測できるなど）、必須ではありません。「こんなものが欲しい」を言葉にできれば、それで十分です。

正直に感じたデメリット

良いことばかり書いても参考にならないので、正直に感じたデメリットも共有します。

1. AI生成の記事はそのままでは「薄い」

これが一番大きなデメリットです。

Claude Codeでブログ記事の骨組みを作ると、構成は整っているし文章もスムーズです。でも、読んでみると「どこかで見たような内容」「当たり障りのない説明」になりがちです。

結局、読者の心に響くのは「自分だけの体験」です。
AIが作った骨組みに、失敗談や具体的なエピソード、正直な感想を追加する作業は欠かせません。
この記事自体も、AI出力をベースに筆者の体験を大幅に加筆しています。

2. コマンドライン操作に最初は戸惑った

Claude CodeはCLI（コマンドライン）ツールなので、ターミナルでの操作が前提です。
GUIのアプリに慣れている人は、最初は「これ、どうやって使うの？」と戸惑うかもしれません。

ただし、基本的な操作はシンプルで、慣れれば30分もかかりません。
筆者も最初の数回だけ手間取りましたが、すぐに自然に使えるようになりました。

3. API使用量のコスト管理が必要

Claude CodeはAPIの使用量に応じて課金されます。サブスクリプションプランもありますが、大量にコードを生成すると使用量がかさむことがあります。

特に、大きなプロジェクトで何度もやり取りすると、想定以上にコストがかかることも。
最初は小さなタスクから始めて、使用量の感覚をつかむのがおすすめです。

Claude Codeは誰におすすめか

Claude Codeは、プログラマーだけのツールではありません。
筆者の体験から、以下のような人に特におすすめです。

逆に、「完璧なコードを自動生成してほしい」「AIに全部任せたい」という人にはあまり向きません。Claude Codeはあくまで「優秀なアシスタント」であり、最終的な判断やクオリティの担保は人間の仕事です。

もし「そもそもClaudeって何？」という方は、まずClaude AIの基本解説記事をご覧ください。Claude Codeは、Claudeの性能をコーディングに特化させたツールだと考えるとわかりやすいです。

まとめ

この記事の要点を振り返りましょう。

Claude Codeは、「やりたいことを言葉にできる人」にとって最強のツールです。プログラミングの細かい文法を知らなくても、日本語で指示するだけでコードが生まれます。

ただし、AIが生成したものをそのまま使うのではなく、自分の体験や視点を加えることで初めて価値のあるコンテンツになる。これはブログ運営でもツール開発でも同じです。

AIの力を借りて、あなたのアイデアを形にしてみませんか？

AIツール選びに迷ったら「AIツール診断」、プロンプトの書き方を知りたい方は「AIプロンプトジェネレーター」もぜひ試してみてください。また、AIを使ったブログの始め方やAIでブログ記事を書くワークフローもあわせて参考になります。

この記事を書いた人

レイ｜20代の現役システムエンジニア。IoT分野で工場の自動化システムを開発しながら、話題のAIツールを片っ端から試しています。このブログでは、実際に使ってみた体験をもとに、初心者にもわかりやすくAIツールの使い方を解説しています。