Claude Codeでホームページを作った。全165ページの作り方

2026.11.05ブログ

このサイトは、Claude Code で作っています。
2026年11月5日に sitemap.xml（検索エンジンに渡すページの一覧）を数えると、165ページありました。
作ってみて残ったのは、品質を左右するのはページの数より、決まりと確認の仕組みだという実感です。

Claude Code に任せたのは、書く・直す・動かす作業です

公式の文書によると、Claude Code はコードを読み、ファイルを直し、コマンドを実行する道具です（2026年11月時点）。
このサイトは、Next.js（Web サイトを作るための仕組み）で作りました。

最初のコミット（変更の記録）は2026年9月18日で、中身は仕様書と開発の土台でした。
最初のページ一式は、翌19日のコミットです。
コミットのほとんどに、Claude が共同作者として記録されています。

どの試作を採るかと、何を載せるかは、私たちが決めました。

内訳でいちばん多いのは対応エリアの61ページで、次が用語集の34ページ、ブログの25ページです。
この2種類だけで95ページあります。

同じ型のページは、頼めば増やせます。
だから、ほぼ同じ文面のページを増やさないことを決まりにしました。
市町村のページには、人口や主な産業など、その土地を調べたデータを入れています。
ページの下には、出典も出しています。

1つ目は、同じ言葉や値を1か所に集めることです。
たとえばサービスの名前は、トップ・一覧・詳細・フッターに出ますが、元は1か所です。
お問い合わせのボタンも、全ページで同じ文言にして、同じ部品を使います。

2つ目は、事実でないことを書かないことです。
実績や件数、お客様の名前は、確かめられないなら書きません。

こうした決まりは CLAUDE.md（プロジェクトの決まりを書いて、Claude Code に読ませるファイル）に書きました。
ただ、公式の文書は、CLAUDE.md を強制の設定ではなく文脈として扱うものと説明しています（2026年11月時点）。
書いただけでは足りないので、確認が要ります。

2026年9月19日、本番の iPhone で、トップの1つの場面が一瞬で過ぎて、次の場面へ運ばれてしまいました。
自動のテストは、マウスのホイールで画面を動かしていました。
iPhone で指を離したあとの慣性は再現できず、見つからなかったのです。

スマホとタブレットでは、場面を1つずつ再生する作りに直しました。
確認にも、再生中に次の場面の位置まで行き過ぎさせる操作を足しました。

2026年10月3日の記録です。
本番の sitemap.xml が、デプロイ（本番への反映）のときの中身のまま更新されていませんでした。
管理画面で公開した導入実績とお知らせが、一覧に載っていなかったのです。

画面に出すサイトマップのページのほうは、更新されていました。
今は sitemap.xml をアクセスのたびに作り、デプロイのあとは本番の中身を確かめることにしています。

不具合やエラーは、症状・原因・対処・再発防止の4つで書き残します。
2026年11月5日の時点で26件あります。
同じ場所を触る前に、この記録を引きます。

もちろん、記録に書いたものしか引けません。
本番で見つかって初めて分かったことも、上の2件のようにありました。

これらは、Claude Code だけで試せます。

このサイトを作り始めたときは、今の開発キットはありませんでした。
キットを入れたのは、2026年11月1日からです。
キットは、決まりと確認を、次の作業を日本語の表で見ながら進めるためのものです。
ただし、入れれば品質が上がると約束するものではありません。

「Claude」「Claude Code」は Anthropic の商標で、私たちのキットは Anthropic が提供・公認しているものではありません。
Claude Code の利用料は別に要ります。

ページを増やす前に、載せてよい事実を言えないなら。
開発キットの初めての方向けのページを読んでみてください。