AIがコードを書いてくれるのに、なぜ概念を知る必要があるのか
「AIがコードをすべて書いてくれるのに、なぜフロントエンドの知識が必要なのか」という質問をよく受けます。答えはシンプルです。概念を知らなければ、AIに任せられる仕事の水準はそこで止まります。ツールは指示を実行するだけで、何を指示するかは指示する人の頭の中の地図から生まれるからです。
React、npm、ビルド、SSRといった単語は、覚えるべき用語集ではなく問題解決の連鎖です。それぞれは、前の段階が解いてくれた問題の上に新たに生じた問題を解くために登場しました。このつながりを知らなければ、AIが出した結果を検証する基準も、次に何を任せるかを判断する根拠も失われます。
ウェブは「問題を解けば新しい問題が生まれる」形で育った
ウェブは1989年、研究文書をリンクでつなぐ共有システムとして出発しました。文書を装飾したくてCSSが生まれ、画面がユーザーに反応するようにとJavaScriptが生まれました。ページが複雑になりコードが爆発すると、それを扱うためにjQueryを経てReactが登場し、他人が作った部品を持ってきて使うためにnpmが、ブラウザがまだ読めない最新の文法をブラウザが理解できる形に移すためにビルド工程が生まれました。
アプリのような滑らかな体験を求めて、画面遷移をブラウザ内で処理するSPAへ進んだところ、今度は検索エンジンにページが拾われないという問題が起きました。そこでサーバー側で画面をあらかじめ描いて送るSSRへと再び戻ってきたのです。一歩が新しい問題を生み、その問題が次のツールを呼び出す――この流れそのものが、今日フロントエンドと呼ばれる地形の正体です。
同じツールを使っても、成果物が分かれる理由
この流れが頭の中にあれば、package.jsonがなぜ必要なのか、ビルドがなぜ割り込むのか、もう問わなくなります。何より、AIへの指示が変わります。「ボタンをきれいに作って」に留まっていた指示が、「このデータが変わったら、あの画面も一緒に変わるようにして」へと変わるのです。
前者の指示はAIを装飾家として扱い、後者は名前のついた問題を手渡します――状態が変われば画面も変わらねばならない、まさにReactが解こうとしたその問題です。同じツールを使っても成果物が分かれる理由はここにあります。結果を分けるのはツールの性能ではなく、問題をどれだけ正確な層で指示できるかです。
Vibeコーディング教育が、ツールより先に歴史を持ち出す理由
技術は、問題を解けばその場で新しい問題が生まれる形で進化します。だからこそ、非開発者がAIと働くときに本当に必要なのは、文法の暗記ではなくこの進化の地図です。地図を持つ人は、ツールが変わっても「これはどの問題を解くために出てきたのか」と位置を定め、その場で正確な指示を作り出します。
SH ConsultingがVibeコーディング教育で、ツールの使い方より先に歴史を持ち出すのはこのためです。ショートカットやコマンドは半日で覚えられますが、なぜそのツールが存在するのかという感覚は、系譜をたどってはじめて生まれます。AI時代に希少になる能力は、ツールを起動できることではなく、何を任せるかを正確に知っていることです。