PR本記事にはプロモーション（アフィリエイトリンク）が含まれる場合があります。
CONTENTS目次
結論から言うと、AIに頼めば「ブラウザから記事を書ける管理画面」を後付けで作ってもらえました。しかもかなり本格的に。でも、その過程で私は本番サイトのブログを一時的に全部消すという派手なやらかしもしました。この記事は、管理画面を自作した便利さと、非エンジニアが実際にハマった設定ミスをセットで、包み隠さず共有する記録です。AI開発の失敗談として、これから同じことをやろうとしている人の「事故ポイント」の目印になれば嬉しいです。
この記事でわかること
- AIに頼めば公開後のサイトに管理画面（ログイン付き）を後付けできること
- 非エンジニアがやりがちな「環境変数のミス」で本番が一時全消えした実例
- AIは実装は得意でも、設定値の貼り付けは人間の事故ポイントだという学び
そもそも管理画面を自作したかった理由
サイトを公開したあと、しばらくは記事を追加するたびにコード側のファイルを直接いじっていました。プログラミング未経験の私にとって、これが地味にストレスでした。ちょっとした誤字を直すだけでも、ファイルの場所を探して、書き換えて、また公開の手順を踏む…という流れが毎回発生します。
そこで「ブラウザから記事を書けるようにしたい」と思い立ちました。いわゆる管理画面（ログインしないと入れない、記事の編集や公開ができる裏側のページ）を自作するという発想です。
普通ならこういう仕組みはWordPressのような既製のツールが持っています。でも私は自分のサイトをAIと一緒にゼロから組んでいたので、その仕組み自体が無い状態でした。ないなら後付けで作ってもらえばいい、と考えたわけです。ここが今回のテーマである「管理画面 自作」の出発点でした。
💡 ポイント： 管理画面は最初から作り込む必要はなく、サイトを公開したあとで「後付け」でも十分間に合います。まず記事を出すことを優先して、運用が面倒になってから足す、という順番でも問題ありませんでした。
AIに後付けしてもらった管理画面の中身
AIにお願いして作ってもらった管理画面は、想像していたよりずっと本格的でした。実際に付いた機能を並べると、こんな感じです。
- ログイン認証（パスワードを入れないと入れない仕組み）
- 記事一覧の表示
- 記事の編集
- 公開承認（下書きを公開状態に切り替える）
- アイキャッチ画像の設定
- カテゴリの管理
- 投稿カレンダー
- 各種の設定画面
つまり、記事の管理に必要そうなものがほぼ一式そろった状態で出てきたわけです。コードを一行も書けない自分が「こういうのが欲しい」と言葉で伝えるだけで、ここまで形になるのは正直かなり驚きました。実装のスピードと完成度については、AIは本当に頼りになります。
ひとつ運用上こだわったのが、管理画面へのアクセス方法です。管理画面へのリンクはサイト上にあえて置かず、URLを直接打ち込んだときだけ入れる運用にしました。 リンクがどこにも表示されていなければ、そのページの存在自体が外から気づかれにくくなります。もちろんこれだけで安全というわけではなく、あくまでログイン認証と合わせての「気休めの一手」くらいの位置づけです。それでも、入口を目立たせないという発想は自分なりの工夫でした。
やらかし①：パスワード欄にAPIキーを貼ってしまった
ここから失敗談です。管理画面ができあがって、ログイン用のパスワードを設定しようとしたときのことでした。
設定画面のパスワード入力欄に、なぜか別サービスのAPIキーを誤って貼り付けて、そのまま保存してしまったんです。APIキーというのは、外部サービスとやり取りするための「合言葉のような長い文字列」のことです。作業中にいくつかの文字列をコピペで扱っていたので、クリップボード（コピーした内容が一時的に入っている場所）の中身を取り違えてしまったんですね。
幸いこれはすぐ気づけました。対処自体はシンプルで、貼ってしまった値を削除して、あらためて新しいパスワードで設定し直しただけです。
⚠️ 注意： パスワード欄やキーの入力欄は、貼り付けた文字が「●●●●」と伏せ字で表示されることが多く、何を貼ったのか目視で確認しづらいです。伏せ字だからこそ、貼る前に「いまコピーしているのは本当にこれで合っているか」を一呼吸置いて確認するクセが要ると痛感しました。
この時点では「まあ、こういう小さいミスはあるよね」くらいの気持ちでした。本当にヒヤッとしたのは、このあとの②です。
やらかし②：環境変数の整理で本番ブログが全消え
次にやったのが環境変数の整理でした。環境変数というのは、サイトを動かすための接続設定などをまとめて保管しておく場所のことで、データベースへの接続情報などが入っています。ここに正しい値が入っていないと、サイトはデータをうまく読み込めません。
設定が増えてきて見づらくなってきたので整理しようとしたところ、本番用の設定行を1つ消してしまいました。 その結果どうなったかというと、公開中の本番サイトのブログが一時的に全部消えたんです。記事一覧を開くと、まっさらの空っぽ。あの瞬間の血の気が引く感じは、しばらく忘れられません。
ただ、ここで冷静に思い出せたのが救いでした。記事のデータそのものはデータベースの中に残っていて、消えたのは「接続するための設定」だけだったんです。表示できなくなっただけで、中身が破壊されたわけではありませんでした。
復旧の手順はこうでした。
- 消してしまった設定行を、正しい値であらためて登録し直す
- その状態でもう一度デプロイ（変更をサイトに反映して公開すること）する
- 記事一覧が元通り表示されるか確認する
これでブログは無事に元に戻り、実害はありませんでした。とはいえ、本番サイトが一時的にでも空になったのは、非エンジニアの私にとってかなり肝を冷やす出来事でした。AI開発の失敗談として、これはぜひ共有しておきたい環境変数のミスです。
AI開発でいちばんの事故ポイントは「人間の貼り付け作業」
今回の一連の出来事を振り返って、はっきり分かったことがあります。それは、AIは実装は完璧にやってくれるけれど、管理画面での設定値の貼り付けは人間の作業なので、そこが一番の事故ポイントになるということです。
管理画面という機能そのものは、AIが安定して作ってくれました。バグらしいバグもなく、指示した通りに動きます。一方で、私がやらかした2つのミスは、どちらも「人間が値を貼り付ける・消す」という手作業の部分で起きています。
- パスワード欄への誤貼り付け → 人間の操作ミス
- 環境変数の設定行を削除 → 人間の操作ミス
つまり、事故はコードではなく設定のオペレーションで起きたわけです。ここから私が次にやろうと決めたのは、設定をいじる前にいまの値をメモしておくこと、そして一度に複数の設定を触らないことです。特に本番環境の設定は、消す前に必ず控えを取ってから作業する、という当たり前のルールを自分に課すようになりました。
AIに開発を任せる時代でも、最後に手を動かすのは人間です。だからこそ、AIが得意なところと人間がミスしやすいところを切り分けて考えると、どこに注意を集中すべきかが見えてきます。この感覚は、実際にやらかしてみて初めて腹落ちしました。
まとめ
AIに頼めば、公開後のサイトにもログイン認証つきの管理画面を後付けで作ってもらえました。記事一覧・編集・公開承認・カテゴリ・投稿カレンダーまで、機能はかなり本格的です。一方で私は、パスワード欄にAPIキーを誤って貼り付けたり、環境変数の設定行を消して本番ブログを一時全消えさせたりと、設定まわりで2つのやらかしをしました。いずれも復旧できて実害はありませんでしたが、学びは明確です。AIは実装は完璧でも、設定値の貼り付けは人間の作業であり、そこが一番の事故ポイントだということ。設定をいじる前に控えを取る、一度に複数を触らない。そんな地味な習慣が、非エンジニアの自分には必要でした。
FAQ
よくある質問
Qプログラミング未経験でも管理画面は自作できますか？
私自身がコード未経験ですが、AIに「ブラウザから記事を管理したい」と言葉で伝えることで、ログイン認証つきの管理画面を後付けで作ってもらえました。ただし、パスワードや接続設定を入力する手作業は自分で行うため、そこでのミスには注意が必要でした。
Q環境変数を消して本番サイトが空になったら、記事は復元できますか？
私のケースでは、記事データ自体はデータベースに残っていて、消したのは接続用の設定だけだったので、正しい値を再登録して再デプロイしたら元に戻りました。ただしこれは状況次第なので、設定をいじる前に今の値を控えておくことを強くおすすめします。
Q管理画面へのリンクをサイトに置かないのは安全ですか？
リンクを置かずURL直打ちだけにするのは、入口を目立たせない工夫にはなりますが、それだけで安全とは言えません。あくまでログイン認証と組み合わせての気休めの一手という位置づけで考えるのが現実的だと感じています。