背景：作業量に対して明らかに足りない納期
- 対応：リニューアルページ 4ページ
- 期間：8日
- 既存パーツの流用率：2割
初日で「これ間に合わなくね？」と悟る。
手作業の流れ（当初）
- WordPressの管理画面を開いて、固定ページを編集
- ソースを読む（色も整形もないので激見づらい）
- 編集画面上でHTMLを直接編集する
- 意図しないタグが増える or 消える
- めんどくさくなって VSCode に貼って編集する
- 編集結果を再度WPにコピペ → 更新 → プレビュー確認
- 修正したらまたコピペして更新…
- 以下ループ
ChatGPTに相談：「こういうツールないの？」
- 無いって言われた
- まぁ、そりゃそうだよなと思った
- 「じゃあ作ればよくね？」
- 要件をまとめて再度ChatGPTに相談 → 「作れます」即答
- 2秒でやる気スイッチオン
- 半日で最初の試作品が完成（荒削り）
思わぬ感動：VSCode保存でWP編集画面に即反映された
- 最初は「保存 → API反映」だけの構成
- でも実際には WPの固定ページ編集画面のHTMLソースまでリアルタイムで書き変わる
- おぉ…これはアツい。
なぜNode.jsを選んだのか
- 最初はPythonを提案された → 無理（読めん）
- 代替案を求めた → Node.jsを提示された
- JavaScriptなら分かる → Node.js一択に
- 構成もChatGPTに丸投げで構築開始
連携地獄：REST APIが見つからない問題
- Node.js周りは一通り揃えた
- 「REST APIで連携しよう」と言われる
- でも該当の「API登録画面」が見つからない
- http:// じゃないとダメとか言われて詰んだ気がする
- ローカルDocker環境だったため「これは無理では…？」となる
- でも、ChatGPTに聞いたら「できます」
- 手順どおりに対応 → 無事、API登録画面が表示される
認証情報セット → POST_IDの意味も理解できた
- APIキーをJSに直接書く
- 最初は全然うまくいかない
-
POST_IDの意味も場所もわからなかった - ようやく理解：「固定ページの編集URLの
post=◯◯の数字がPOST_ID」 - 連携成功 → 保存で反映されるように
そして再び布団の中で気づく：「プレビューの自動更新も欲しくね？」
- WP編集画面に反映されるだけで満足していたが、
- 「手動保存してF5押すのダルくね？」と寝る直前に気づく
- ベッドの中でChatGPTに再度質問：「自動でブラウザ更新できる？」
- 「できます」と返ってくる
- 翌朝、言われた通りにやってみる
- 何度か失敗するが、ついに構成が完成
一発起動したくなる → .bat ファイルにして爆速へ
- あとはコマンド2つ打つのが面倒になる
- ChatGPTに聞く：「一発起動できる？」
- 「
.batにまとめればOKです」 - 言われるがままに
.batを書く - ダブルクリックで実行した瞬間、俺の夢見た世界が広がる
けど、ウィンドウが複数開いて鬱陶しい
-
watcher.js用とbrowser-sync用でCMDが2枚開く - 「まとめて1枚にしたい」→ 今後は全統合JSにする予定
- 余力があればGUI化までやるつもり（たぶん）
さらに、保存時には現在のHTML内容をMySQLに保存するようにしており、
履歴としてDBに蓄積される仕組みにしている。
（将来的には履歴からの復元や差分比較もできるようにする予定）
GitHub リポジトリ
📂 ソースコード・ツール一式はこちらで公開しています：
🔗 https://github.com/msfactory1103/wp-history-logger
最後に
まだまだ荒削りではありますが、自分が求めていた環境は確実に形になりました。
今は個人開発用途にとどまっていますが、似た課題を感じている人の参考になれば嬉しいです。
今後の展開に…