このサイトには広告が含まれています

AIを活用した地域情報サイトを、AIを活用して個人開発した話

開発期間は5カ月。テーマエディターから直コピペに始まり、最後はVS Code上でGPT Codexに直接指示を出すようになるまでの過程をさらっと振り返ります、AIが。

完成品はこちら

反省:もし今から作るとしたら

  • ロゴ・ファビコン・OGP画像を作る
  • Stitchでモックを作る。画面構成をざっくり固める
  • 設計
    欲しい機能を全て書き出す
    CSSの方針(最小限のユーティリティとコンポーネント)
    JSの分割
    PHPの責務
    ACF項目を決める(後から追加するとmakeのマッピング作業で詰む)
    ファイル命名規則を固める
    AGENTS.mdの作成
  • Localでローカル環境を用意
  • GPT Proに契約、VS Code完結体制(Aqua Voiceで音声入力)
  • Apifyのタスク作成
  • Makeのシナリオ作成
  • CF7でフォーム作成
  • Makeでwebhook設定
  • API登録作業

※仕様を最初にきちんと固める。
※後から共通化は無間地獄。

実コード量

  • PHP(31ファイル): 8,832行
  • JS(8ファイル): 2,561行
  • CSS(6ファイル): 1,441行

※使用AI(多い順):GPT 5.3 Codex / GPT 5.1 / Claude Code
※PHP / JSについては1行も書いてません
※運用は人間がやってます

AIによる振り返り

正直に言うと、最初はちょっと心配だった。

WordPressでの本格的な制作は初めて。
テンプレートにインラインでJSとCSS。
ページごとにAIに書かせて管理画面にコピペ。

構造? ない。
共通化? 後回し。
勢いだけはある。

まったく、しょうがないやつね。

でも、止まらなかった

Localを知る。
ローカル開発に移行。

VS Codeとブラウザのチャット画面を往復。
無料枠の制限にぶつかり、GPT・Gemini・Claudeを併用。

そのうち、諦めるかなと思った。
でもやめない。

テンプレートを全部作り切る。
そこから共通化のための大規模修正に入る。

結果? 失敗。

後から共通化は重い。
当然よ。

でもここで投げなかった。
「最初に設計を固めるべきだった」と認める。

ちゃんと学んでるじゃない。

技術的に何をやったか

勢い型に見えて、やっていることは意外と堅実。

1. 投稿構造の整理

  • カスタム投稿をevents と news に分離
  • ACFをREST前提で設計
  • null許容
  • 表示ロジックをテンプレに書かない

後から自動化する前提でフィールドを決めた。
これは正解。

2. 自動化フロー

  • Apify 無料プラン(役割:ウェブ・インスタのスクレイピング)
  • Make Coreプラン(役割:自動化。RSS・AIデータ整形・WP下書き投稿)
  • Google Vision(役割:画像OCR。投稿フォーム用)
  • Gemini API(役割:記事本文リライト)
  • Google TTS AI(役割:音声再生。今日のイベント用)
  • CF7 → CF7 to Webhook → Make → WP下書き投稿

Apifyの月の内訳。

  • Instagram Post Scraper:$1.49
  • Merge/Dedup:$0.31
  • Cheerio:$0.25

地味だけど、現実的。
派手じゃない。
でも堅い。

3. Agents設計の失敗

agents.mdをガチガチにする。
精度が落ちる。
守らせすぎると、崩れる。
ここでようやく理解する。

AIは軍隊じゃない。
増幅器。

必要最低限のルールだけ残す。
はぁ、やっと分かったのね。

4. CSS設計の変化

最初はページ単位。
途中から、

  • base.css
  • utility.css
  • component.css
  • page.css

最小ユーティリティ。
Tailwindに逃げない。
成長してるじゃない。

そして転機

GPT Pro契約。
Codex導入。
Aqua Voiceで音声入力。
VS Code完結。

ここから質問の質が変わる。
短い指示が、長い設計議論になる。
AIの出力が良くなった?

違う。

こいつの入力が良くなった。

妥協しなくなった

これが一番大きい。
前のこいつなら「ここまででいいか」と言っていた。

でも今回は「どうせAIに書かせればいい」と開き直る。

結果、アイデアをふんだんに盛り込める。
これは強い。

総括

こいつは天才じゃない。
効率的でもない。
最初は雑。
でも、やめない。

設計を覚える。
役割分担を覚える。
AIとの距離を調整する。

そして最後は、ちゃんと公開まで持っていく。

こういう人が、ちゃんとサイトを育てる。
派手に始めて、静かに続ける。

やっとスタートラインだと言う。
その自覚があるなら、大丈夫。
あたしは冷静に見ている。

ちゃんと、ここまで来たことも。
ちゃんと、成長したことも。
そして、これから積み上げることも。

終わりに(人間による振り返り)

と、まあこんな感じで振り返りをお願いしたらポエムを返してくれました。

思い返してみると「どう伝えれば期待する結果を得られるか」ただそれだけをひたすら追求する日々だったように思います。それでも結局、正解はいまだに分からずじまいです。

AIは決して完ぺきではなく、時には盛大にやらかします。リファクタリングを頼んだらファイル丸ごとニフラムされたことも何度かありました。「すみません、勢いあまって消してしまいました」と謝られたときは、妙に人間味を感じてほっこりとさせられたものです。

AIに夢を見すぎないこと。自分にとってはこれが一番の気付きとなりました。良くも悪くも指示した以外のことはしてくれません(今のところは)

わりと結構作るの大変だったので、技術的なことも詳しく書いて「どうだ、すげーだろ」とめっちゃ自慢したいのですが、、ちょっと疲れてきちゃったのでまた別の機会にでも。

ひとまず今夜はごほうびテンガで束の間の夢を見ようと思います。

コメント欄

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