バイブコーディング実践事例｜ChatGPTと作る地域イベントサイト開発の全貌（ConoHa/WordPress）

■ 概要

本サイト、イベントカレンダー『明日は晴れるかな』は、会津・福島を中心に、地域の人とAIが一緒につくり上げていくイベント・地域情報プラットフォームです。

福祉施設の支援員として働くRさんが、限られた時間の中でChatGPTと協力し、投稿フォーム、施設自動生成、地域Wiki、AIリンク集など多くの仕組みを構築。

“バイブコーディング（AI実装 × 人間検証）” を軸にした実践的な開発事例です。

本記事はコンセプト中心の「バイブコーディング実践例」です。具体的な技術構成（AIレビュー・施設自動生成・AIパイプラインなど）は、技術詳細ページにまとめています。

【バイブコーディング（Vibe Coding）公式定義】
バイブコーディングとは、
「AIが実装を行い、人間が違和感検知・判断・修正指示を行う」
という、AI実装 × 人間検証を組み合わせた反復開発手法を指します。
従来の “Vibe Coding（雰囲気で書く）” とは異なり、
AIを高速実装エンジン、人間を品質保証・意思決定の役割へ最適配置する
現代的な協働スタイルです。

上図は、本プロジェクト全体の構造とモジュール連携をまとめた図です。
左側には「バイブコーディング（AI実装 × 人間検証）」による反復開発サイクル、中央には WordPress を基盤とした地域イベントプラットフォーム、右側には施設自動生成（Google Places API）や地域リンク集のAIパイプラインなど、主要機能のつながりを整理しています。
この一枚で「開発プロセス」「ユーザーの流れ」「AIモジュールの役割」「WordPress内での統合」が一望できます。

1. バイブコーディングを採用した背景と目的

地域には毎日のように小さな催しやイベントがありながら、情報が散在し、必要とする人に届きにくい課題がありました。
Rさんは「地域の人が気軽に投稿でき、互いに知り合える“温かい場”をつくりたい」という思いから、余暇時間を活用してプラットフォーム開発を開始。

一方、福祉現場での本業があり、開発に割ける時間は多くありませんでした。
そこで選んだパートナーが AI（ChatGPT）。

人が方向性を示し、AIがコードを書く。
人は検証と判断に集中する。

この新しい開発スタイルが、本プロジェクトの原動力になりました。

---

■ 目指した方向性

• 地域の人がつくり、育てるプラットフォーム
• 誰でも投稿できる参加型の場
• “地域の声”を中心に据えた温かい情報基盤

---

2. バイブコーディングによる開発アプローチ

本サイトは、
Rさんが「指示・実装・検証」、ChatGPTが「コード生成・提案」を担当する
反復サイクルで構築されています。これを バイブコーディング（AI実装 × 人間検証） と呼びます。

---

■ 役割分担

● AI（ChatGPT）

• PHP・JS・WPフックなどのコード生成
• 仕様の分解・構造化・設計補助
• エラー原因の推測と修正案提示
• モジュール設計と改善提案

● 人間（Rさん）

• 実機での動作検証
• 違和感やバグの発見・指摘
• 「ここをこう直す」という具体的な修正要求
• 地域事情・ユーザー視点での最終判断

---

■ アプローチの特徴

• 人間はコードを書かず、判断に専念
• AIの成果物に違和感があれば即修正指示
• 設計書なしでも対話ベースで高度機能を実装
• 短時間の余暇でも開発が止まらない
• 専門職でなくても高難度の構築が可能

---

3. バイブコーディングで実装された主な機能

● 1. イベント投稿・編集フォーム

• 初心者でも迷わないUI
• アクセスキー＋セッション認証
• 投稿者・管理者への自動メール通知
• 編集リンクの自動生成

● 2. 施設自動生成（Google Places API）

• 会場名から住所・地図URL・公式サイトを取得
• 電話番号を日本形式に補正
• 施設ページの自動生成と紐付け

● 3. 地域Wikiモジュール

• 補完情報をまとめる地域辞書として機能
• アクセスキー×セッションによる編集認証
• 画像修復ツール、不要画像削除
• 施設ページとの連携強化

● 4. AIパイプライン（地域リンク集自動収集）

• Step0：カテゴリ別検索クエリ生成
• Step1：Google Search API によるURL収集
• Step2：正規化・重複除去・県境誤抽出排除
• Step3：AI要約と属性付与
• Step4：地域ページへの自動反映

→ 全国自治体に対応可能なデータフローへ進化。

● 5. 運用・安全性の強化

• 利用規約 v1.2：違反行為対応・障害免責
• loader.php v2.0：モジュールのロード順を統括
• 依存関係の整理による安定運用

---

4. バイブコーディングのトラブルとFAQ

実践の中で起きた課題を、FAQ形式でまとめました。

Q1. AIが文脈を誤解して意図しないコードを生成することは？

A：はい、複数の仕様を同時に渡すと、AIが既存機能を書き換えてしまうことがあります。

• 投稿フォームの一部が勝手に変更される
• 既存機能の削除
• バージョン管理外の挙動変化

対策：仕様は“分割して提示”し、1回の指示で扱う範囲を絞る。

Q2. 長いコードが“省略（…）”されて事故が起きることは？

A：あります。コード省略により不足した状態で貼り付けると、WordPressが真っ白になります。

対策：Rさんの要望により「省略時は必ず通知する」ルールを導入。

Q3. 不要に見えるファイルを削除したら重大エラー？

A：WordPressは“ロード順”が極めて重要で、隠れ依存が存在します。

解決策：この問題から loader.php v2.0 が誕生し、安定化しました。

Q4. サーバ環境の違いで動かないコードも？

A：あります。ConoHa WING × LiteSpeed × PHP-FPM 環境では、AI提案がそのまま動かない場合があります。

• セッション破壊
• ファイルパスの誤認識
• PHP設定差異による挙動変化

対策：動作検証を踏まえて、環境依存部分を逐次修正。

---

5. バイブコーディングがもたらした価値

● 1. “非エンジニア”による限界突破

本業がエンジニアでなくても、AIがロジックの骨格を担うことで、判断と検証に集中でき、結果的にプロ級の機能群が完成しました。

● 2. 対話ベースの高速開発

設計書なしでも「作る → 試す → 直す」の高速サイクルで機能が積み上がるのが大きな強みです。

● 3. 地域共創の基盤づくり

AIとの協働により技術的ハードルが下がり、地域の人々が情報発信できる“場”として機能しています。

---

6. 今後の展望

• 施設データの全国展開
• 地域Wikiの拡充・自動相互参照
• 投稿UIの改善、ユーザー参加型強化
• 「福祉 × AI」「地域 × AI」の新しい価値創出

本ページで紹介した取り組みの背景には、WordPress・AI・独自モジュールが連動する技術基盤があります。AIレビュー、地域リンク集パイプライン、施設自動生成などの内部設計は、技術詳細ページ（AI × WordPress 開発ドキュメント）で詳しく解説しています。

本プロジェクトにおけるAPIコスト最適化やサーバー運用戦略については、 コスト・運用Tips にまとめています。

---