「AIに頼めば、アプリは一瞬で動く」——本当にそうです。でも、出てきたものが安全で、ちゃんとしているかは別の話。そこを見抜く目があるかどうかで、作れるものの質は大きく変わります。
Singularity Society の BootCamp に集まるVibe Coder（AIでどんどん作る人）に向けて、Web開発の「これだけは知っておきたい基礎」を一冊のドキュメントにまとめました。題材は、みんなが毎日さわっているTwitter。あの見慣れた挙動を、自分の手でシンプルに作りながら学びます。
📖公開ドキュメントはこちら> https://singularitysociety.github.io/societys_statement/development/twitter_supabase/README.html
どんなドキュメント？
ひとことで言うと、**「シンプルな Twitter を作るための基礎」**です。
ログイン、つぶやきの投稿、タイムライン、フォロー……Twitter には、Web開発で大事なポイントが驚くほどぎゅっと詰まっています。しかも私たちは、ユーザーとしてその動きをすでに知っている。だから「あの動き、どう作るんだろう？」という素朴な疑問から、無理なく中身に入っていけます。
全13章＋付録7本。完全未経験の方も置いていかないよう、たとえ話を多めに、コードは1行ずつ解説しています。
ふつうのWeb開発本と、どこが違う？
一般的な入門書は、たいてい「HTTPの仕組み」「認証と認可」「データベースの内部構造」といった裏側の理論から始まります。とても正しいのですが、初心者はここで心が折れがち。まだ何も作っていないのに、用語の壁が立ちはだかるからです。
このドキュメントは、思いきって逆向きに進みます。
すでに知っているTwitterの動き → なぜそうなっているのか → 自分で作るとこう書くたとえば「下書きは自分にしか見えない」「他人のツイートは消せない」。あたりまえですよね。でもこれは、作る人がちゃんと仕組みを入れて初めて成り立つものです。サボると、他人のデータが見えたり消せたりする——初心者がいちばんやりがちな事故が起きます。
だからこのドキュメントは、全体を通してひとつの問いを背骨に置いています。
🔑**そのデータは「誰のもの」か？**この一点を軸に、認証からスケールまでが一本の線でつながります。
何が学べる？（ストーリー仕立てで）
各章は「Twitterのこの動き → なぜ → どう作る」の順で進みます。ざっくり地図を描くと、こんな旅です。
-登場人物を知る：ブラウザ・サーバー・データベース・API を、レストランのたとえで
-ログインと「ユーザー」：Google認証でシンプルに。そして「ユーザーのIDって、実は何種類もある」を整理
-🔑 自分のデータを守る：user_id と RLS（行レベルセキュリティ）で「自分のものは自分だけ」を仕組みにする（ここが背骨）
-API という窓口：同じ窓口なのに人によって返る中身が違う——その「出し分け」の正体
-公開タイムライン：「自分だけ」と「みんな」をどう両立させる？
-フォロー → ホームタイムライン：人と人をつなぎ、フォローした人の投稿だけを流す（Twitterの心臓部）
-速さと安全：キャッシュの落とし穴、ありがちな失敗の総ざらい
-AIに作らせて、読む：出てきたコードの「ここが危ない／ここが安全」を見抜く目
-そして最後は、スケールの物語：「フォロワー1億人のツイートを、Twitterはどう捌いた？」を読み物で
最終章まで読むと、あなたが作った小さなTwitterが、世界中が使う本物のTwitterと地続きだと実感できるはずです。考えていることは同じ。違うのは規模だけ。
Supabaseを使ってるけど、それだけじゃない
バックエンドはSupabase（認証・DB・APIが最初から揃っていて、初心者にやさしい）で例示しています。でも、本質は道具ではなく考え方です。
だから、手元のLLM（Claude Code / Codex など）に「これを Firebase 向けに書き換えて」「自前のAPIサーバー向けに直して」とお願いすれば、他の環境の参考にもなります。「データは誰のもの？」「出し分けはサーバー側で」といった原則は、どのスタックでも共通だからです。
各章の終わりには「🤖 AIに頼むなら」というコーナーを置いて、そのままコピペできるプロンプト例と、出力をチェックするポイントを添えてあります。
こんな人におすすめ
-AIでどんどん作っているけれど、基礎に一抹の不安があるVibe Coder
-プログラミングはほぼ未経験だけど、Web開発の地図がほしい人
- AIに作らせたコードを、自信を持って「読める」「直せる」ようになりたい人
逆に「HTTPやTCPを厳密に学びたい」という方には、専門書のほうが向いています。このドキュメントは、まず一周して全体像をつかむことに振り切っています。
読み方のおすすめ
-
目次（はじめに）から、上から順に読む
-
できれば手を動かす。Supabaseは無料で始められます
-
詰まったら、各章の「AIに頼むなら」を使ってAIと一緒に進める
読むだけでも十分価値がありますが、一度でも手を動かすと、理解の解像度がぐっと上がります。
おわりに
AIの時代に大事なのは、ゼロからすべてを暗記することではなく、全体像を持って、出てきたものを判断できることだと思います。このドキュメントが、その「判断する目」を育てる最初の一歩になればうれしいです。
ここから先は、あなたの番。Twitterのクローンでなくてもかまいません。日記アプリでも、感想を記録するサービスでも、仲間内の掲示板でも。「ログインして、自分のデータを安全に保存して、人に見せる」——この型は、世の中のほとんどのアプリに当てはまります。あなたはもう、その地図を手にしています。
よい開発の旅を 🚀
📖ドキュメント全文（無料・公開）> https://singularitysociety.github.io/societys_statement/development/twitter_supabase/README.html