なぜコードより先に拡張子で詰まるのか
バイブコーディングを学ぶ人が、コードより先に詰まる場所があります。ファイルの拡張子です。.json、.yaml、.env、.md といった見慣れない拡張子が押し寄せた瞬間、「やっぱり自分は開発者じゃないから」と手を離してしまいます。ところがこの数十の形式は、たった三つに分かれます。
データを入れる器、画面に見せるもの、設定と秘密。この三つの枝さえ手にすれば、初めて見る拡張子でも、だいたいどの箱に属するか感覚がつかめます。下の表がその地図です。
| 形式 | 分類 | 一言定義 |
|---|---|---|
| CSV | データ | 書式をすべて外した表計算 |
| JSON | データ | 名札を付けた箱(アプリとAIの共通語) |
| XML | データ | タグで包んだ旧式のデータ |
| HTML | 画面 | ウェブページの骨組み |
| Markdown (.md) | 画面 | 記号いくつかで書式を付けた文章 |
| YAML | 設定 | インデントで整理した設定 |
| .env | 秘密 | APIキー・パスワードを入れる金庫 |
| TXT | その他 | 何のルールもない素の文字 |
データを入れる形式:CSV・JSON・XML
CSVは、色も書式もすべて外し、カンマで列を分けた純粋な表です。最初の行が列名、次の行からがデータです。ショップの注文履歴やアンケート結果をダウンロードすると大抵CSVで、そのままAIに渡して分析させるのに向いています。
JSONは、今日プログラム同士がデータをやり取りする事実上の標準です。各値に名札が付き、箱の中に箱を入れる入れ子ができます。AI APIの応答、アプリの設定、データベースの結果がほぼすべてJSONなので、バイブコーディングをすると最もよく出会います。
XMLは、同じデータを開き閉じのタグで包んだ旧来のやり方です。官公庁や銀行の古いシステムで今も使われ、面白いことにExcelファイル(.xlsx)を開いてみると中はXMLになっています。新しく作るときは、たいてい軽いJSONを選びます。
見せる形式:HTML・Markdown
HTMLは、ブラウザが画面を描く設計図です。タグが「これは何か」を指定します——<h1>は見出し、<p>は段落、<button>はボタン。バイブコーディングで作ったウェブサイトやメールマガジンはすべてHTMLで、骨組み(HTML)・装飾(CSS)・動き(JavaScript)が一組で動きます。
Markdown(.md)は、#や-のような簡単な記号で書式を表す文章です。学ぶのに五分あれば足り、記号が付いたままでも読め、レンダーすればきれいな文書になります。GitHubのREADME、AIチャットボットの回答、Notionのメモの多くがMarkdownです。
設定と秘密:YAML・.env
YAMLは、JSONと同じデータを括弧の代わりにインデントで整理した形式です。人が読みやすいので、デプロイ設定やアプリの環境設定によく使われます。ただし空白ひとつ間違えると丸ごと壊れるので、インデントには注意が必要です。
.envは、APIキーやパスワードといった機密の値を、コードと分けて入れておくファイルです。AIサービスをつなぐとき、キーを入れる場所がまさにここです。鉄則がひとつあります。.envは絶対に公開リポジトリに上げてはいけません。鍵を丸ごと他人に渡す事故になるからです。だから普通は.gitignoreで除外しておきます。
拡張子を見ただけで感覚をつかむ方法
核心の感覚はシンプルです。CSV・JSON・XML・YAMLはデータ、つまり中身です。HTML・Markdownは見せる文章と画面です。.envは秘密です。拡張子を見ただけで「これはデータだ、画面だ、設定だ」と感覚がつかめれば、それで十分です。
AX(AI転換)の観点で、この感覚は思う以上に重要です。非開発者がAIで何かを作るとき、本当の障壁はコードの文法ではなく、見慣れないファイルへの漠然とした恐れであることが多いのです。拡張子を三つに分ける地図を手にした瞬間、見慣れないファイルはもう怖くなくなります。バイブコーディングは、まさにそこから本当に始まります。