メインコンテンツへスキップ
【実験記録】Claude Codeと一緒にブログを書いてみたら、思わぬ発見があった話
  1. Posts/

【実験記録】Claude Codeと一緒にブログを書いてみたら、思わぬ発見があった話

··134 文字·1 分
技術 Hugo Claude Code
じぇい
著者
じぇい
プログラミングや技術的な学びを中心に、日常の気づきをまとめています。
目次

Agent Codingツールが好きすぎて実験を始めた
#

正直に告白すると、私はClaude CodeやGemini CLIのようなAgent Codingツールが大好きです。コードを書くだけでなく、一緒に考えてくれるパートナーのような存在に感じるんです。

そんなわけで、「もっとAIと絡んでブログを書いたらどうなるんだろう?」という実験を始めました。WordPressからHugoに移行して、Claude Codeと毎日会話しながら記事を書いています。

で、いくつか面白い発見があったので、学習帳として記録しておきます。

発見1:テキストファイルの威力がすごい
#

実験データ:作業時間が1/3に
#

科学的思考が大好きなので、ちゃんと計測してみました。

  • WordPress時代:記事1本書くのに約2時間
  • Hugo + Claude Code:約40分

この差は何か?分析してみると、「ファイルを直接編集できる」というシンプルさが大きいんです。「この部分を直して」と言えば、Claude Codeがサッと編集してくれる。このスピード感は病みつきになります。

Gitで「AIとの対話」を記録できる
#

これ、実はすごく面白い発見でした。Gitのコミットログを見ると、「Co-Authored-By: Claude」という記録が残るんです。

つまり、AIと一緒に書いたプロセスが全部記録されている。これって、将来「この記事はAIとどうやって書いたのか」を分析できる貴重なデータになりそうです。

技術的な学習記録として、この「AI協働の履歴」は面白い研究対象になるかもしれません。

シンプルなアーキテクチャの威力
#

静的サイトの最大のメリットは、そのシンプルさです。

  • データベースがないので、壊れるものがない
  • 全てがファイルなので、AIが理解しやすい
  • ビルドプロセスが明確なので、デバッグが簡単

さらに、セキュリティアップデートの心配もなく、メンテナンスがほとんど不要。技術者にとっては、この「手間のかからなさ」が大きな魅力です。

発見2:「できないこと」も楽しい
#

失敗から学んだこと
#

実は昨日、「タグ一覧ページをオシャレにしたい」と思ってClaude Codeと一緒にCSSをいじったんです。結果は…大失敗。ダサくなって全部元に戻しました(笑)。

でも、この失敗が楽しかったんです。「あ、これじゃダメか」「じゃあ次はこうしてみよう」と、AIと一緒に試行错誤するのが、まるでペアプログラミングしているみたいでした。

AIとの「問答」が知識になる
#

「Hugoで関連記事を5件表示するには?」とClaude Codeに聞いたら、サンプルコードを書いてくれました。でも、ただコピペするだけじゃつまらない。

「なんでこのコードで動くの?」「.Relatedって何?」と質問を続けるうちに、Hugoの仕組みが理解できてきました。

この「AIとの問答」こそが、本当の学習なのかもしれません。

ターミナルが「魔法の箱」に
#

黒い画面、怖いですよね。わかります。

でもClaude Codeと一緒に使っていると、ターミナルが「魔法の箱」に感じてきました。「hugo server」と打つだけでブログが表示される。「git push」で世界中に公開される。

エンジニア以外の人も、AIがサポートしてくれればこの「魔法」を使える時代が来るかも?

発見3:コンテンツ作成の未来
#

高速イテレーションの可能性
#

AIと協働することで、コンテンツ作成のサイクルが劇的に速くなりました。

これが意味すること:

  • 実験回数が増える:短時間で多くのアイデアを試せる
  • 失敗からの学びが早い:すぐに修正して次に進める
  • 品質の向上:何度も推敲できるので納得いくまで磨ける

コラボレーションの新しい形
#

Gitログに「Co-Authored-By: Claude」と記録されることが象徴的です。これは単なるツールの利用ではなく、真の意味での「共同作業」。

将来、こうしたAIとのコラボレーションが当たり前になるかもしれません。

実験の次のステップ
#

次に試したいこと:画像の自動生成
#

アイキャッチ画像を毎回用意するのが面倒です。DALL-E 3と連携して、記事の内容から自動で画像を生成できないか実験中です。

イメージとしては、以下のような流れです。

  1. 記事を書く
  2. Claude Codeが要約を作る
  3. 要約からDALL-E用のプロンプトを生成
  4. 画像を自動でダウンロードして配置

技術的にはそんなに難しくないはず。やってみます。

アナリティクスとの連携
#

Google Analyticsのデータを見ながら、「この記事はPVが高いけど滞在時間が短いね」とAIが指摘してくれたら?

科学的思考を重視する私にとって、これは理想的なフィードバックループです。データに基づいて仮説を立て、改善し、検証する。

このサイクルをAIと一緒に回せるのが楽しみです。

「自己進化するブログ」の構想
#

これは妄想に近いですが…

  1. AIがサーチコンソールのデータを分析
  2. 「最近、特定のキーワードで検索が増えてますね」と提案
  3. 「じゃあ、それについて書いてみましょうか」と記事を自動生成
  4. 公開後の反応を見て、リライト

技術的には実現可能です。でも、これって「ブログ」と呼べるのかな?

現時点での成果と課題
#

成果(データ付き)
#

  • 記事作成時間:70%削減
  • コミット数:1日3回以上(実験的な編集が楽しい)
  • AIとの対話ログ:全てGitに記録

課題
#

  • 画像生成の自動化がまだ
  • CSSカスタマイズのセンスがいまいち(昨日失敗)
  • 日本語情報の少なさはやっぱりネック

まとめ:「学習帳」としてのブログ
#

この実験を通してわかったこと:

  1. AIとの協働は「効率化」以上の価値がある
    一緒に考えるプロセス自体が学習になる

  2. シンプルなシステムほどAIと相性がいい
    テキストファイル + Gitの組み合わせは最強

  3. 失敗も含めて「実験」するのが楽しい
    ダサくなったら元に戻せばいい

このブログは、私の「学習帳」です。Agent Codingツールと一緒に、新しいことを試します。失敗しても学びがあり、それを記録していきます。

次の実験は画像の自動生成です。うまくいくかな?それも含めて楽しみです。

そういえば、もしあなたもAgent Codingツールが好きで、何か実験していることがあったら、ぜひ教えてください。

技術を使って新しいものを生み出す。それが一番楽しいですよね!

参考リンク
#

関連記事

HugoブログにtextlintとClaude Codeを導入して文章品質を向上させた話
·216 文字·2 分
技術 Hugo Claude Code
textlintによる文章チェックとClaude Codeでの自動化で、ブログの文章品質を大幅に改善した手順を紹介します
HugoブログをNetlifyで公開し、独自ドメインを設定した手順
·262 文字·2 分
技術 Hugo
HugoブログをNetlifyにデプロイし、Value Domainで取得した独自ドメインをGoogle Cloud DNSで設定した手順を解説
Hugoでブログをセットアップした手順
·159 文字·1 分
技術 Hugo
Hugoを使ってブログをセットアップする手順を解説します
Claude Codeが好きすぎて「学習帳」を始めた話
··43 文字·1 分
日記 自己紹介
Agent Codingツールとの出会い、毎日の実験、失敗も含めた学びを記録していきます