Insights·2026-07-07

バイブコーディングで出会うファイル形式、どう見分けるか

非開発者がバイブコーディングで出会う数十のファイル形式は、実はたった三つに分かれます。データを入れる器(CSV・JSON・XML)、画面に見せるもの(HTML・Markdown)、そして設定と秘密(YAML・.env)です。拡張子を一つひとつ覚える必要はありません。見慣れないファイルに出会ったとき、「これはデータか、画面か、設定か」だけ見分ければ、参入障壁の半分は消えます。

なぜコードより先に拡張子で詰まるのか

バイブコーディングを学ぶ人が、コードより先に詰まる場所があります。ファイルの拡張子です。.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で何かを作るとき、本当の障壁はコードの文法ではなく、見慣れないファイルへの漠然とした恐れであることが多いのです。拡張子を三つに分ける地図を手にした瞬間、見慣れないファイルはもう怖くなくなります。バイブコーディングは、まさにそこから本当に始まります。