知っておきたい7つの言葉（後半：Git〜デプロイ）

第3回では、7つの言葉のうち最初の3つを扱いました。

LLM（賢い相棒）、コーディングエージェント（旅のエース）、IDE（マサラタウンの自宅）。ここまでで「アイデアを言葉にする」「動くものに変える」「作業する場所」が揃った状態です。

今日は残りの4つ。作ったものを「保存する」「育てる」「守る」「世に出す」の4工程に対応します。

ㅤ

4. バージョン管理（Git ／ GitHub）｜セーブポイントとポケモンHOME

アプリを作っていると、いろいろ変えたくなります。そのうち「あれ、昨日の状態に戻したい」と必ず思います。

このときに使うのが、Git（ギット）です。

変更の履歴を、セーブポイントのように残してくれます。ポケモンで「ぼうけんのきろく」をつけるあの感覚。詰んだら、好きなセーブに戻ればいい。

複数のセーブポイントが並ぶリスト図。日付付きで「機能追加前」「機能追加後」「見た目調整後」「本番公開直前」の4つのセーブが時系列で並ぶ — 変更を進めるたびに、ぼうけんのきろくを残していくイメージです。

そして、Gitと一緒に必ず出てくるのが、GitHub（ギットハブ）。こちらは、自分のセーブをネット上のクラウドに預けておける場所、ポケモンHOMEのような存在です。

自分のPCとGitHubクラウドの間の双方向矢印図。3つの役割（PCが壊れても残る・進捗を合わせられる・公開先が参照する）が下に並ぶ — PC ⇄ GitHub の関係。クラウドにセーブを預けて、3つの役割を果たします。

役割は、3つあります。

1. パソコンが壊れてもデータが残る

自分のセーブデータをHOMEに預けておけば、別のパソコンからでも引き出せます。

2. 家族や仲間と進捗を合わせられる

ポケモンの世界で、自分は炎タイプを育てて、兄弟は水タイプを育てて、それぞれ進捗が違う状態を想像してください。

「あ、その手持ち面白いね、こっちにも入れてみたい」そんなとき、HOMEを介して「ここだけ合わせていい？」と相談しながら統合できます。

これが、Vibe Codingで言う「マージ」です。

3. push と pull で、手元とHOMEを同期する

push：自分の手元の進捗を、HOMEに預ける
pull：HOMEから、最新の進捗を手元に引き出す

ローカルとGitHubの間で、push（右向き矢印）とpull（左向き矢印）が双方向で流れる図 — 送る側が push、取り出す側が pull。最初はこの2つだけ覚えれば動けます。

家族や仲間と作業を分担するときは、この2つを行ったり来たりするだけです。

最初の小さなアプリでは、自分ひとりだけが触る前提でも、GitHubは使えます。万が一に備えた「クラウド保管庫」として、最初に作っておくと安心です。

これも、ほとんどAIに頼めます。

ㅤ

5. データベース｜ボックス

たくさんの情報を、決まった形で置いておく場所のことです。

ポケモンで例えると、ボックスです。 6体しか連れて歩けないけれど、ボックスには何十体も整理した状態で保管できます。

エクセルの表を、もっと強力にしたもの。そう考えてもらえれば、ほぼ正解です。

例えば、お店の予約アプリを作るなら、「日付」「時間」「お客さんの名前」「人数」をまとめて置いておく場所が必要です。これがデータベースの役割です。

お店の予約データが大きなボックスの中に整然と並んだ図。各エントリは「日付・時間・名前・人数」の4列で構成 — ボックスのイメージ。決まった形で、たくさんの情報を整理して置いておけます。

代表的なものに、こんな種類があります。

SQLite：軽量で個人開発向き
Supabase：設定が簡単で、最近のVibe Codingでよく使われる
Firebase：Googleが提供している
PostgreSQL：本格派

代表的なデータベース4種を横並びカードで比較。SQLite（軽量）／Supabase（簡単・最近人気）／Firebase（Google）／PostgreSQL（本格派） — 最初の小さなアプリは SQLite か Supabase で十分です。

最初の小さなアプリでは、データベースなしで始めて構いません。必要になったら、AIに「この情報を保存できるようにして」と頼めば、適切なものを選んでくれます。

ㅤ

6. セキュリティ｜トレーナーIDとパスワード

これは、本当に大事な話です。

ポケモンの世界でも、自分のセーブデータが他人に勝手に書き換えられないように、トレーナーIDやアカウントのパスワードで守られています。

Vibe Codingでも同じです。

アプリを作っていくと、いろいろな「鍵」が出てきます。 APIキー、パスワード、個人情報、ログインの仕組み。

ここで「APIキー」というのは、外部のサービス（例えば天気情報や地図）を、自分のアプリから使わせてもらうための合鍵のようなもの。人によって違う鍵が発行されて、これがあれば自分のアプリから呼び出せる、という仕組みです。

これらを、コードの中にそのまま書いてしまうと、ネットに流出します。 ID・パスワードを画面に表示したまま配信してしまうのと、同じ事故です。

左にコード直書きの危険例（APIキーがハードコード、赤の警告）、右に正しい方法（.envファイルから参照、ティールのチェック）の対比図 — 左は事故、右が正解。コードに鍵を書かない、Gitに上げない。

正しいやり方は、決まっています。

鍵は別ファイル（環境変数といいます）に書く
そのファイルはGitに上げない
誰かに渡すときは、別の手段で渡す

「環境変数」というのは、コードの外側にこっそり置いておくメモみたいなもの。コードからは「鍵が必要なら、あのメモを見て」と参照する形になり、コード自体には鍵が書かれません。

3つのファイル（.env / .gitignore / index.js）の中身を縦に並べた構成図。.envに鍵を書き、.gitignoreで除外し、コードからは process.env で参照する — .env と .gitignore と参照コードの3点セット。これだけで、鍵は守れます。

これも、AIに「環境変数で安全に管理して」と一言伝えれば、設定してくれます。ただし、伝え忘れるとそのまま書かれることがあります。

「鍵は別の場所」を、口癖にしてください。

第1回でも書いた個人情報の話も、ここに入ります。氏名、住所、電話番号、生年月日。 AIに渡す前に、ひと呼吸置きます。

ㅤ

7. デプロイ｜レーティングバトル参戦

作ったアプリを、自分のパソコンの中だけで動かしているうちは、誰にも見せられません。

これを、ネット上に置いて、誰でもアクセスできるようにすること。これが、デプロイです。

ポケモンで例えると、自分が育てたパーティを、レーティングバトル（オンラインの公式対戦）に登録する瞬間。これまで自分の中だけで完結していたパーティが、世界中の誰かと出会える場に出ていきます。

左に「自分のPCの中だけ」のアプリ、矢印で「デプロイ」、右に「世界中に公開」されたアプリが各端末で見られている図 — 自分の中だけだったものが、誰かのものになる瞬間です。

代表的なサービスは、こんなところです。

Vercel：個人開発で人気、無料枠が広い
Netlify：Vercelの競合
GitHub Pages：シンプルなサイト向け
Cloudflare Pages：高速で安定

代表的なデプロイサービス4種を横並びカードで比較。Vercel（個人開発で人気）／Netlify（競合）／GitHub Pages（シンプル）／Cloudflare Pages（高速） — どれも、最初は無料で始められます。本連載は Vercel を軸に進めます。

どれも、最初は無料で使えます。

第13回・第14回で、実際にデプロイまで体験します。今は「最後はネットに出せる」とだけ覚えておけば十分です。

ㅤ

全体を、もう一度

7つを、ポケモンの旅に重ねて並べ直します。

御三家を選ぶ（LLM）
旅のエースに任せる（コーディングエージェント）
自宅・ポケセンに戻る（IDE）
セーブと、HOMEへの預け入れ（Git／GitHub）
ボックスに整理する（データベース）
トレーナーIDを守る（セキュリティ）
レーティングバトルに登録する（デプロイ）

7つの言葉の完成版。LLM・エージェント・IDE・Git・DB・セキュリティ・デプロイの7アイコンが横一列に並ぶ概念図 — 7つの完成版。アイデアから世界に届くまでの全行程が、これで揃いました。

7つ全部、一度に覚える必要はありません。作りながら、必要になったタイミングで戻ってくる、で大丈夫です。

この連載でも、各回で必要になったものから順番に触っていきます。

ㅤ

今日のまとめ

3行で振り返ります。

7つの後半は「保存する・育てる・守る・世に出す」の流れ
全部覚えなくていい。AIに頼める部分が大半
「鍵は別の場所」「個人情報はAIに渡さない」だけは、口癖にする

ㅤ

次回予告

第5回からは、いよいよ手を動かす番です。

ChatGPTひとつあれば、環境構築なしでアプリは作れます。第2回で軽く触れた、あの「動くものが手元に来る」感覚を、もう少し腰を据えて再現します。

ㅤ

専門用語は、覚えるものではなく、使ってみる中で勝手に馴染むもの。私はそう感じています。

ㅤ

連載の更新は、メルマガ「おかもんだより」でもお知らせします。よかったら登録してお待ちください。

ㅤ

演習：30分の宿題

第3回・第4回で、7つの言葉が一通り揃いました。最後に、最低限の感覚を掴む宿題を3つ。

宿題1：GitHub のアカウントを作る（10分）

github.com にアクセスして、メールアドレスでサインアップ。ユーザー名は、後で公開URLに使われることがあるので、シンプルなものを選びます。

中身は、何も置かなくてOK。「アカウントだけ用意した」が今日のゴール。

宿題2：Vercel のトップページを眺める（5分）

vercel.com を開いて、無料プランの仕様を眺めるだけ。何が無料で使えるのか、何が有料になるのか、感覚を掴んでおくと第14回が楽になります。

宿題3：自分の使っている「鍵」を1つ書き出す（15分）

外来や薬局で、ID・パスワード・APIキーのような「鍵」をいくつ管理しているか、紙に書き出してみてください。

電子カルテのID
薬局システムのパスワード
Google Drive の認証
Slack の招待リンク
病院のWi-Fiパスワード

ここで挙げたものは、AIには絶対に渡さない、と決めておく。セキュリティ意識の入口は、自分が何を守っているかを言語化することです。

医療職別実例ギャラリー：「鍵を守る」が大事だった例

例1：内科医・APIキー漏洩で7万円請求された話（架空・教訓のため再構成）

OpenAIのAPIキーを GitHub のpublicリポジトリに上げてしまい、24時間で$500（約7万円）請求された事例。キーを直書きせず、.env に分離していれば、まったく起きなかった事故。

第4回の「鍵は別の場所」が、唯一の予防策。

例2：看護師・電子カルテ ID をAIに貼ってしまった話（架空）

ChatGPT に申し送りを清書してもらおうとして、患者の生年月日・カルテ番号ごとコピペ。個人情報保護法違反のリスクが顕在化。

ダミーデータか、構造だけ共有が原則。

例3：医療事務・Vercel無料枠を使い切った話

問い合わせ定型回答ツールが想定以上にアクセスを集めて、Vercel無料枠の月100GB帯域を超過。以降は有料プラン（Pro、$20/月。2026年6月時点）に切り替え。

「無料」と「無制限」は別物。デプロイ前に、無料枠の上限を確認しておく。

もっと深く：環境変数管理の歴史

「鍵は別の場所」という発想は、最近のものではありません。

1990年代の Unix システムから、設定情報を環境変数として外出しする習慣はありました。 2010年代、Heroku というクラウドサービスが「Twelve-Factor App」という設計指針を提唱し、その3つ目が「設定は環境変数で」だったことから、世界中に広まりました。

今のVercel・Netlify・Cloudflare は、すべて Twelve-Factor の流れを汲んでいます。 GitHub に上げない .env ファイルと、デプロイ時に注入する環境変数。この2点セットが、現代Webサービスの標準です。

「鍵は別の場所」は、30年以上の積み重ねでたどり着いた答えです。

動画で見る

YouTube：paiza「バイブコーディング入門第3〜4回」：GitHub・デプロイ実演

参考・出典

安野貴博「バイブコーディング超入門講座第2回」（YouTubeチャンネル「安野貴博の自由研究」、2026年4月）
paiza株式会社「バイブコーディング入門 Claude Code編」 https://paiza.jp/works/vibe-coding-claude-code/trial
The Twelve-Factor App https://12factor.net