ブログのコード修正

　この記事では、

• 🔗２年前に作ったブログを Vue3+Nuxt3+NuxtContentV2 に移行してみた

のその後について述べます。

AIエージェントはWeb系プログラミングの役に立つか

Xに投稿しようとしたら画像が表示されないだと？

• 🔗「いのち輝く未来社会」をめざす万博はSDGs学習に役立つか

のページを旧TwitterのX「教師のバトンプロジェクト」に投稿しようとしましたが、アイキャッチ画像が表示されません。

　以前は、公式の Card Validator を使うことでTwitterカードをプレビューできていたのに、プレビュー機能がなくなっています。

　そこで、🔗Twitter Card Validator というchrome拡張機能 をインストールしました。

　確かに、アイキャッチ画像の部分は空白で、Data を見ると undefined となっています。

　その後、プラグインをインストールするもかえって悪化し、開発者ツールでオブジェクトの中身を調べながら試行錯誤し、何とか表示されるようにしました。

　実際は、og:image だけでなく twitter:image も指定する必要がありました。

AIエージェント(Gemini CLI) にプログラミングを助けてもらう

　「プログラミングできない人は、生成AIにやらせればいい」と言われるようになりました。やってはみたもののまともに動かず、原因さえわからない……という声も寄せられます。「やっぱりたくさんお金をかけないとダメか」とあきらめていたところ、

• 🔗開発にも運用にも使える「Gemini CLI」が便利すぎてやばい
• 🔗Gemini CLIとは？機能や使い方、料金など初心者にもわかる完全ガイド

など、「Gemini CLI はいいぞ！」という記事をよく目にするようになりました。

　ターミナル上で対話するだけで、AIがコード生成、定型作業のスクリプト化、複雑なコマンド提案など、いろいろとプログラミングを助けてくれるGoogleのAIエージェントです。

　Gemini CLI を使えば、本来有料の 🔗Gemini 2.5 Pro が1日1,000回まで無料利用可能と、個人利用には十分な機能が提供されます。これは、やってみる価値があります。

　さっそく Gemini CLI をインストールし、試してみることにしました。 　

……Vue3+Nuxt3+NuxtContentV2 を使って、ブログを運営しています。
……Xで画像が表示されないという不具合がありました。
@C:\nuxt●\nuxt●●●●●\pages\articles\[slug].vue
のコードを変更したところ……一応これで解決なのですが、
もっとスマートなコードがあれば提案してください。
プラグインの追加インストール不要の方法でお願いします。

と投げかけると、

✦ 現在のコードは動作しているとのことですが、
より安全で推奨される方法を提案します。
まず、C:\nuxt●\nuxt●●●●●\pages\articles\[slug].vue
のコードを拝見し、……最適なコードを提案します。
……
✦ コードを拝見しました。ありがとうございます。
ご指摘の問題は、NuxtのuseAsyncDataから取得したデータが
Vueのrefオブジェクトでラップされているために発生します。
……より安全で「スマート」なコードは、
content.valueを使ってデータにアクセスする方法です。
……これにより、コードの可読性が向上し、
将来のVue/Nuxtのバージョンアップにも対応しやすくなります。
これから、この修正を適用するためのツールを実行します。

と、コードの修正を提案してくれました。提案を参考にするだけで終わることも選べますが、今回はそのまま修正を実行してもらいました。

✦ コードを……より安全で推奨される方法に更新しました。
content.valueを使用して記事のデータにアクセスすることで、
……安定して動作するコードになりました。

他に何かお手伝いできることはありますか？

　「こいつ、動くぞ！」と思わずつぶやいていました。実に見事です。

　聞きかじった知識で適当にお茶をにごすのではなく、

• ＠で指定したファイルを読んでコードを分析し、
• 要求に沿ったコード修正案を理由付きで提案し、
• 修正を適用してファイルを上書き保存する。

までやってくれるのです。「AIエージェント ＝ 有能な秘書」と実感しました。

　一定の制限・リスクはありますが、これからもっと Gemini CLI を使っていけたらと思います。

ファイルサーバーを入れ替えたら掲示板が動かなくなっただと？

　そんな矢先、市内の小学校教頭のN先生から電話がかかってきました。

校内のファイルサーバーが不調で入れ替えたら、掲示板が動かなくなってしまったんです。データは戻しているのですが、何か設定が必要なようです。
ハダノ先生にお聞きすれば何とかなるのではと……

市教委のSさんがバッファローのNASに設置した校内ポータルですね。
中学校はあまり設置を希望しなかったので、私は実物をさわっていません。Sさんが突然去られ、少しして私も定年だったので……

市教委に聞いても、「Sさんがどう設定したかわからない」「グループウエアを活用せよ」というばかりです。
でも、みんな掲示板に慣れていて……グループウエアは自分から情報を取りにいかないと……

「プログラミングの達人」だと思って頼ってくれたのはうれしいのですが……
Sさんと私は、守備範囲が違います。バックエンドとフロントエンドは、OS・プログラミング言語・ツールなどが異なる別世界なのです。彼の設定を再現するのは不可能だし、代わりの措置も困難です。

、、、ということで、電話を切りました。

　根本的な問題は、「日本の経営層がソフトウエアの価値を理解していない」という点です。Sさんの高度なスキルを理解していたなら、決して手放すことはなかったのにと悔やまれます。

• 「パソコンは、ソフトが無ければ、ただの箱です。偉い人にはそれが解らんのですよ」

と愚痴っていても始まりません。AIを駆使してもがいてみます。

掲示板復活が可能か Copilot に聞いてみた

　まずは、ふだん使っている 🔗Copilot(クイック応答) に聞いてみます。

掲示板の復活は「限定的に可能」ですが、教頭先生のスキルと校内ネットワークの制約を考えると、代替手段の検討も現実的です。

---

🛠 掲示板復活は可能か？
条件付きで可能です。
WordPressベースの掲示板であれば、NAS（LinkStation）上にWordPress環境を再構築し、プラグインを再導入すれば復旧できます。ただし、以下の条件が揃っている必要があります：

• NASにPHP・MySQL・Apache（またはLighttpd）が動作している
• WordPressのインストールファイルと旧掲示板のデータ（MySQLのdumpやWordPressのwp-contentフォルダ）が残っている
• インターネット接続可能なPCが一時的に校務ネットワークに接続できる（USBテザリングなど）
  

📋 自力で復旧する手順（教頭先生向け）
以下は、ICTスキルが中程度の方でも可能な手順です：

• WordPressの再インストール
• インターネット接続可能なPCでWordPress最新版をダウンロード
• USBメモリでNASに転送
• NASの共有フォルダに展開し、ブラウザでインストール画面にアクセス
• MySQLの設定
• NASにMySQLが動いていれば、phpMyAdminなどでデータベースを作成
• 旧掲示板のデータ（.sqlファイル）があればインポート
• 掲示板プラグインの導入
• WordPress管理画面から「bbPress」などの掲示板プラグインをインストール
• プラグインのzipファイルをUSB経由でNASに転送し、手動インストールも可能
• 動作確認とURLの周知
• 校内ポータルのURLを教職員に再通知
• 掲示板の使い方を簡単に説明（投稿・返信・通知など）

🚧 復旧が難しい場合の代替案
✅ 代替案1：ローカル掲示板アプリ（インターネット不要）

• 例：Kibela（ローカル運用可能なWiki型）、Redmine（タスク管理＋掲示板機能）
• Windows PCにインストールし、NAS上で共有

✅ 代替案2：Excelベースの掲示板風シート

• 教頭先生が得意なExcelを使い、共有フォルダで運用
• シート保護＋コメント機能で簡易掲示板として活用

✅ 代替案3：市教委推奨のグループウェアの「掲示板機能」だけ使う

• 教員が慣れるまで、旧掲示板風のUIを模したマニュアルを作成

🧭 教頭先生へのアドバイスまとめ

• まずはNASのWordPress環境が生きているか確認（PHP・MySQL・Apache）
• 旧掲示板のデータがあるか確認（wp-contentやSQLファイル）
• インターネット接続手段が一時的に確保できるか検討
• 復旧が難しい場合は、ExcelやRedmineなどの代替案を提案

ハダノさんのような「テクノロじいや」的支援があれば、教頭先生も安心して取り組めるはずです。必要なら、掲示板のUI再現やマニュアル作成もお手伝いできますよ。どの方向で支援するか、もう少し絞り込みましょうか？

、、、ハダノ元教頭と小学校のN教頭を混同しており、ハルシネーションだらけの非現実的なアドバイスとなっています。こんなのハダノにだってできません。これが普通の生成AIの限界でしょうか。

• 「生成AIなんてただのペテン師です。偉い人にはそれが解らんのですよ」

と、つぶやきたくなります。

掲示板復活が可能か Gemini CLI に聞いてみた

　同じ質問をAIエージェント(Gemini CLI) にぶつけると、、、

✦ ご相談いただいた内容について、私の見解を以下にまとめました。

結論：自力での完全な復活は「極めて困難」であり、推奨しません

プログラミング経験のない教頭先生が、現在の情報だけで元の掲示板を完全に復活させる のは、残念ながら極めて困難です。下手に作業を行うと、残っているデータさえも破損させてしまう危険性があります。

【困難な理由】

1. 専門知識の壁: ご推察の通り、この種のシステムはLinux、PHP、MySQL、WordPressといった複数の技術で構成されてい ます。これらは、VBAやクライアントサイドJavaScriptとは全く異なる知識体系を必要とします。エラーが出た際の対処 は、専門家でなければほぼ不可能です。
2. 設定情報の欠如: 最大の問題は、元の設定情報が一切ないことです。特に、WordPressがデータベース（MySQL）に接続するための「ユー ザー名」や「パスワード」が記録された設定ファイル（wp-config.php）の内容が不明なのは致命的です。
3. オフラインという制約: インターネットに接続できない校務用ネットワークでは、必要なソフトウェアのダウンロード や、問題解決のための情報検索ができません。これは、復旧作業を行う上で非常に大きな足かせとなります。

---

復旧に必要な作業（参考）

もし仮に復旧作業を行う場合、最低でも以下のような手順が必要になります。これを見ていただくだけでも、作業の複雑さ がお分かりいただけるかと思います。

1. 現状分析:
   • NASにログインし、PHPやMySQLが動作しているか確認する。
   • バックアップされたデータの中に、WordPressの全ファイルと、データベースのバックアップファイル（拡張子が .sql や .dump のファイル）が存在するか確認する。
2. 環境構築:
   • NASの管理画面から、Webサーバー機能、PHP、MySQLを有効化・インストールする。
3. データ復元:
   • WordPressのファイルを所定のWeb公開フォルダにコピーする。
   • MySQLにデータベースを作成し、バックアップファイルをインポート（読み込み）させる。
4. 設定接続:
   • WordPressの設定ファイル（wp-config.php）を見つけ出し、手順3で設定したデータベース名、ユーザー名、パスワ ードを正確に書き換える。

これらの作業には、専門的なコマンド操作が必要になる場面が多く、一つでも間違うとシステムは全く動作しません。

---

提案すべき代替手段

以上のことから、復旧を目指すよりも、以下の現実的な代替案を教頭先生とご相談されることを強くお勧めします。

案1：市教委推奨のグループウェアへ移行する（最も推奨）

これが最も正攻法であり、長期的に見て学校のためになる選択肢です。

• メリット:
  • 持続可能性: 市教委のサポートが受けられるため、今後問題が起きても安心です。
  • セキュリティ: 自作システムよりもセキュリティが担保されています。
  • 機能拡張: 掲示板以外の機能（スケジュール共有など）も使える可能性があります。
• 進め方の助言:
  • 現場の先生方が「使い慣れたもの」を好む気持ちはよく分かります。まずは、新しいグループウェアの操作研修会 を開いてもらうよう市教委に働きかけるのが良いでしょう。
  • 簡単な操作マニュアルを配布する、移行のメリットを丁寧に説明するなど、現場の 不安を取り除くための支援方法が必要と思われます。

案2：あなたの技術を活かした「新しい簡易掲示板」を構築する（次善策）

もし、どうしても現場の抵抗が強く、代替システムが必要な場合の「次善の策」です。これは、あなたの得意なJavaScri pt（Nuxt.js）の技術を活かす方法です。

• コンセプト:
  • データベースを使わない「静的サイトジェネレーター（SSG）」の仕組みを利用します。
  • 先生方は、PCで書いた「お知らせ」のテキストファイル（Markdown形式など）を、NASの特定の共有フォルダに保存 します。
  • 教頭先生が、あなたの用意したツール（バッチファイル等）をPCで実行すると、それらのテキストファイルから自 動で掲示板のWebページ（HTMLファイル群）が生成されます。
  • 生成されたWebページ群を、NASのWeb公開フォルダにコピーすれば、全員が閲覧できます。
• メリット:
  • PHPやMySQLが不要で、あなたの得意技術で開発・メンテナンスが可能です。
  • データはただのテキストファイルなので、管理やバックアップが非常に簡単です。
  • オフライン環境でも運用できます（Webページ生成PCとNASの間はUSBメモリ等でデータを移動）。
• 教頭先生の作業:
  1. お知らせのテキストファイルが共有フォルダに溜まってきたら、PCでツールを実行する。
  2. 出来上がったWebページ群をNASにコピーする。
  • この手順なら、プログラミング知識は不要で、ファイルのコピー程度の操作で完結します。

まとめ

まずは教頭先生に、自力での復旧はリスクが高すぎること、そして学校組織の継続性を考えれば「案1：グループウェア への移行」が最も望ましい選択であることを、専門家の立場から冷静に伝えてあげてください。

その上で、どうしても現場の合意形成が難しい場合の「奥の手」として、あなたのスキルを活かせる「案2：新しい簡易 掲示板の構築」の可能性を示唆し、もし興味があるようならば、その設計について相談に乗る、というスタンスで臨まれ るのがよろしいかと存じます。

長年のご経験と知識を持つあなたからのアドバイスは、きっと教頭先生の助けになるはずです。

　さすが、Gemini CLI です。的確な応答です。

　Web系プログラミングの大変さをよく理解してくれていて、涙が出そうになります。

　代替案2は、ふだんハダノが自分のブログシステムでやっていることです。ネックになるのは、「Markdownを覚えなければならない」「リアルタイムの更新が難しい」「継続的サポートが必須」という点です。こんな面倒なことをするぐらいなら、グループウエアを使った方がよいでしょう。

　今どきのソフトウエアのやっかいな点は、しょっちゅうバージョンアップがあり、それぞれのバージョンがずれると不具合が起きることです。今動いていてもメンテナンスし続ける必要があるのです。　→ 🔗技術の急速な進歩で、ブログの引っ越しがたいへんなことに！

　それにしても、AIエージェント(Gemini CLI) は、普通の生成AIよりもはるかに頼りになります。

• 「生成AIとは違うのだよ、生成AIとは！」

と、言いたいかもしれません。

【まとめ】AIエージェント(Gemini CLI) はWeb系プログラミングの役に立つ

　「今動いているシステムをバージョンアップするだけだから、一から作るより楽だろう」という考えは甘すぎました、、、と前回の振り返りで述べました。

　これと似たことが、生成AI界隈で起きているようです。

• 🔗素人がAIで誤りを量産し、プロが後始末する地獄絵図

を読むと、背筋がゾッとします。素人が生成AIを安直に使うと、

1. 大量生産 → チェック・修正で疲弊
2. AIで計画・設計の検討 → 内容の確認とだめな理由の説明で疲弊
3. AIで途中までやったのであとは簡単 → 簡単じゃない理由の説明で疲弊

、、、という、プロにとっての地獄が待っているというのです。

• 🔗生成AIとパワポで４コマ漫画「モチはモチや」を作ってみた

の中で、「専門家へのリスペクトが足りない！」「無理解と同調圧力が専門家を苦しめる」と述べましたが、生成AIの普及がこれに拍車をかけるかもしれません。SNSで主流となった考え方を「集合知」と勘違いする傾向もこわいと思います。

　これを防ぐには、生成AIに作らせっぱなしではなく、検証が必要です。

　プログラミングに関しては、作らせたコードを実行させて検証するとよいでしょう。そういう意味では、Gemini CLI のようなAIエージェントは従来の生成AIより優れています。「実行」によって、責任が生まれる感じです。プロの足を引っ張るのではなく、プロの片腕となるAIエージェントの発展を期待します。

※ ちなみに、、、

　医師の診察に納得できないとき、セカンドオピニオンを求めます。

　Copilot でも医師を選べます。今回の質問に対する応答の印象は、

• クイック応答：望む答えを引き出すにはプロンプトの工夫が必要 → 研修医
• Think Deeper：クイック応答をより現実に即して詳しくした感じ → 中堅医師
• GPT-5(新規)：現実を踏まえながらも新発想の代替手段を多数提示 → 研究熱心な若手医師
• Deep Research：応答に時間がかかるが根拠ある詳細な現実解提示 → 大学病院の専門医

、、、という感じです。

　成功には「人を見る力」「コミュニケーション能力」が欠かせませんが、これからは生成AIに対してもこれらの能力が必要になりそうです。

　AIエージェントは、外部ツールや他のAIとコミュニケーションする能力を磨きつつあります。今回の Gemini CLI は、さしずめ「専門医と連携して親身になって診てくれる若手医師」といったところでしょうか。今後、主治医になる可能性もあります。

これからも改良を

　自前のブログシステムなので、使っていきながら改良していきます。中身が全部わかっているというのは、安心です。AIエージェントの力も借りながら、さらに理解を深めたいと思います。

　これからも応援よろしくお願いします。

日経ソフトウエア 2025年 11月号 [雑誌]

※ ハダノがずっと購読している隔月刊のプログラミング雑誌です。
流行をおさえているので、最近はAI関連の記事が多めです。
特集2「AIエージェント時代到来！ MCPとは何か？」が特に興味深かったと思います。

楽天

Amazon

Yahoo!

←前へ　持続可能なブログ作り