LESSON 01 / 03 約3分
5つの技術で、ひとつのサービス
まずは仕組みをつかもう。細かい書き方は覚えなくて大丈夫。
01 これは何？
Webサービスは、画面を作る部分と、データを処理して保存する部分の組み合わせです。投稿サイトなら、見出しはHTML、色はCSS、操作への反応はJavaScript、保存の処理はPHP、保存先はMySQLです。
02 なぜ必要？
役割を知ると「ボタンの色を変えたい」「投稿を保存したい」を、どの技術に頼むか分かります。最初からコードを暗記する必要はありません。今どの部分を作っているかを説明できれば、AIに具体的な相談ができます。
03 最小限のコード・図
ブラウザ：HTML（構造）＋ CSS（見た目）
JavaScript（操作への反応）
↕ 通信
サーバー：PHP（受け取り・確認・処理）
↕
MySQL（データの保存）04 ここだけ理解する
- HTMLとCSSが、読める画面を作る。
- JavaScriptはブラウザでも動く。PHPはサーバーで動く。
- MySQLは投稿や利用者の情報を保存する。
05 覚えなくていいこと
それぞれの言語の細かい書き方は、まだ覚えなくてOKです。
ASK AI
06 AIに聞いてみよう
質問文をコピーして、ChatGPTやCodexなどに貼り付けてみましょう。
私は初心者です。投稿サイトで「投稿ボタンを押して、投稿一覧に表示されるまで」を、HTML・CSS・JavaScript・PHP・MySQLの役割に分けて説明してください。専門用語にはその場で説明を付けてください。
07 AIの回答を見るポイント
- 画面の役割と、保存する役割が分かれているか。
- ブラウザからMySQLへ直接つなぐ説明になっていないか。
08 だいたい分かったら、次へ
「理解できた」はいつでも取り消せます。記録せずに次へ進んでも大丈夫です。