Claude Works

Vibe Coding Guide

バイブコーディング入門

AIにコードは書かせられる。でも「なぜ動くか」がわからないと詰む。

Cursor や Claude Code でコードを生成した経験がある人向けの連載です。 AIが書いたコードの意味がわかる。エラーが出ても自分で原因を特定できる。 AIへの指示の精度が上がる。全24回で、Webの仕組みを体系的に学びます。

24公開済み 3 / 24毎週更新
第1回から読み始める →

Curriculum

カリキュラム

第2部

URI — 「住所設計」はアプリ設計の出発点

04URIの読み方 — URLを「分解」できるようになる準備中
05URIの設計 — いいURLは「読むだけで意味がわかる」準備中
06クエリパラメータとパスパラメータの使い分け準備中
第3部

HTTP — 「会話のルール」を理解する

07HTTPリクエストとレスポンス — 実物を読めるようになる準備中
08HTTPメソッド — Webでできる「動作」はたった数個準備中
09ステータスコード — サーバの「返事」を正しく読む準備中
10HTTPヘッダ — メッセージに貼る「付箋」準備中
11ステートレスとCookie/セッション — 「ログイン状態」の正体準備中
12CORSとは何か — 「ブロックされました」の正体準備中
第4部

REST — API設計の「型」を身につける

13RESTとは何か — 「なんとなくREST」を卒業する準備中
14リソース設計実践 — ゼロからAPIを設計するワークショップ準備中
15Web APIのお作法 — バージョニング・ページネーション・エラー設計準備中
第5部

バイブコーダーの実践知識 — 現場で差がつくWeb技術

16JSONを完全理解する — Webの「共通言語」準備中
17認証と認可 — 「誰が」「何をできるか」を管理する準備中
18HTTPS・セキュリティの基本 — 「知らなかった」では済まない準備中
19データベースの基本 — Webアプリの「記憶」を理解する準備中
20環境変数とデプロイ — 「ローカルで動く」から「世界に公開」へ準備中
21パフォーマンスとキャッシュ — 「遅い」をどう解決するか準備中
第6部

モダンWebの技術トピック

22SPA・SSR・SSG — レンダリング方式の選び方準備中
23WebSocket・リアルタイム通信 — 「更新ボタン」なしで最新情報準備中
24これからのWeb — バイブコーダーが知っておくべき未来準備中

Who is this for

こんな人に読んでほしい

Cursor や Claude Code でアプリを作ったことがある
動くものは作れるが「なぜ動くか」は説明できない
エラーが出ると、どこを直せばいいかわからなくなる
AIへの指示が「いい感じに作って」で止まっている
フロントとバックの違いが曖昧
APIやHTTPという言葉を聞くと不安になる

バイブコーディングの限界は「Webの仕組みの理解」で突破できる

全部を深く知る必要はない。でも「地図」を持っているかどうかで、AIへの指示の質が変わる。

第1回から読み始める →