講座全体の中でのこの講義の位置づけ
この講座が目指すのはバイブコーディング、つまりAIと相談しながらコードを作らせていく開発の進め方です。この進め方では、自分でコードを書く力よりも、内容をわかったうえで指示し、出てきたものを確認する力が、成果を大きく左右します。だからこそ、いちばん最初に身につけてほしいのが概念理解です。この講義は、これから積み上げていく数多くの学びに共通する、いわば入口にあたります。ここで土台をつくっておきましょう。
このスライドのポイント
- バイブコーディング ＝ AIと相談しながらコードを作らせる開発の進め方
- 分かれ目は「書く力」ではなく「わかって指示し、確認する力」
- だから最初に身につけるのが概念理解
- この講義は、この先の全講義の共通の入口
概念理解の定義——4つの要素
概念理解を、正式に定義します。概念理解とは、次の4つを自分の言葉で説明できる状態のことです。1つ目は、何の部品でできているかという構成要素。2つ目は、データがどこからどこへ流れるかというデータの流れ。3つ目は、どの部品がどこまで面倒を見るかという責任範囲。4つ目は、どこを壊すと危ないのかという危険箇所です。用語をすらすら言えることではなく、この4つを説明できることを、この講座では理解と呼びます。
このスライドのポイント
- 概念理解 ＝ 次の4つを自分の言葉で説明できる状態
なぜ概念理解が必要か
この4つを押さえていないと、バイブコーディングで3つの困りごとが起きます。まず、AIが出してきたものが正しいのかどうかを、自分で判断できません。次に、エラーが起きたときに、どの部品が原因なのかを切り分けられません。そして、危ない変更にも気づかないまま、そのまま進めてしまいます。書く作業をAIに任せるからこそ、判断する側である自分の理解が欠かせないのです。ここが、この講座を貫く考え方になります。
このスライドのポイント
- 4要素を押さえていないと、バイブコーディングで起きること
4要素の全体像——4つの問い
4つの要素は、4つの問いとして覚えると、ぐっと使いやすくなります。1つ目の問いは「部品は何か」、これが構成要素です。2つ目は「データはどこへ流れるか」、これがデータの流れ。3つ目は「どの部品がどこまで責任を持つか」、これが責任範囲。4つ目は「どこを壊すと危険か」、これが危険箇所です。何かを理解したいと思ったら、この4つの問いを、上から順番に自分へ投げかけてみてください。それだけで、見える景色が変わります。
このスライドのポイント
- 4要素は「4つの問い」として覚えると使いやすい
Webアプリでの具体例——お問い合わせフォーム
身近な例で、4要素を実際に使ってみます。題材はお問い合わせフォームです。まず構成要素は、入力する画面、送信する処理、そして保存先の3つに分けられます。データの流れは、入力から送信へ、そして保存、通知へと進みます。責任範囲を見ると、入力の内容を確かめるのは画面側、受け取って保存するのはサーバー側です。危険箇所は、入力された個人情報をどこに保存し、誰が見られる状態にするかという点です。この調子で、どんなアプリも4つに分けて眺められます。
このスライドのポイント
- 題材: お問い合わせフォームを4要素で説明する
技術サンプルカード——概念理解を確かめる質問
概念理解を確かめるための質問を、AIへの依頼文としてまとめました。種別はプロンプトです。目的は、4つの要素をそれぞれAIに説明させて、自分の理解を点検することです。読み方のポイントは、4つの質問が、構成要素、データの流れ、責任範囲、危険箇所に、1つずつ対応していることです。まずはこの雛形をそのまま使い、返ってきた答えを4要素の言葉で受け取る練習から始めてみてください。慣れるほど、確認が速くなります。
このスライドのポイント
- 種別: prompt
- 目的: 4要素それぞれをAIに説明させ、自分の理解を点検する
- サンプル本体:
混同しやすい概念——「暗記」と「理解」
ここで、混同しやすい2つを比べます。用語を暗記している状態と、概念を理解している状態です。暗記は、言葉を知ってはいても、初めて使うツールには応用できません。理解は、流れと責任を説明できるので、見たことのないツールにも当てはめられます。この講座が目指すのは後者、つまり応用のきく理解のほうです。用語を覚えること自体が目的ではない、という点を、ここではっきりさせておきます。
このスライドのポイント
- 比較表:
バイブコーディングでの確認点
バイブコーディングでの確認点です。AIから説明を聞いたら、その内容を4要素の言葉に置き直せるかどうかを、自分に問うてみてください。もし置き直せないなら、それはまだ理解ではなく、なんとなくわかったつもりの状態です。そのときは、AIへこう頼みます。「いまの説明を、部品、流れ、責任、危険の4つに分けて言い直してください」。このひと手間が、わかったつもりと、本当の理解とを分ける分かれ目になります。
このスライドのポイント
- AIの説明を聞いたら、4要素の言葉に置き直せるかを自分に問う
- 置き直せないなら、まだ「わかったつもり」の状態
- AIへの質問例:
まとめと次回への橋渡し
最後に一問一答です。問い。概念理解の4要素は何でしょうか。（間）答えは、構成要素、データの流れ、責任範囲、危険箇所の4つです。30秒でまとめます。この講座で言う理解とは、用語を言えることではなく、この4つを自分の言葉で説明できることでした。次回は、Webサイト、Webアプリ、SaaS、APIの違いから始めます。関連資料は「AI Builder 技術ロードマップ」「非エンジニアが最初に覚えるべき開発概念30」「AI Builder受講前準備キット」です。
このスライドのポイント
- 一問一答: 「概念理解の4要素は？」 → 構成要素・データの流れ・責任範囲・危険箇所
- 30秒まとめ: 理解とは、用語を言えることではなく、4つを自分の言葉で説明できること
- 次回: Webサイト・Webアプリ・SaaS・APIの違いから始める
- 関連資料: AI Builder 技術ロードマップ ／ 非エンジニアが最初に覚えるべき開発概念30 ／ AI Builder受講前準備キット
