WEBアプリの基本的な仕組みと考え方
WEBアプリの基本的な仕組みを説明します。まずは、WEBアプリで頻繁に登場する用語の説明を交えながら、ホームページの仕組みについて復習します。
わかりやすくするためにかなり噛み砕いて説明しているため、実際の動きとは異なる箇所があるかもしれません。
また、用語は厳密に定義されているわけではなく、「このように呼ぶことが多い」という程度です。
あくまで簡単なイメージとして学習してください。
- ホームページを表示させるには、ユーザがブラウザでhtmlなどのファイルがおいてあるサーバにアクセスします。
- ブラウザでサーバにアクセスすることをリクエスト(Request)といいます。
- サーバ側でブラウザに主力するデータを作成し、ユーザ側にデータを返します。
- ユーザ側にデータを返すことをレスポンス(Response)といいます。
- レスポンスされたデータをブラウザで表示します。
- ユーザ側をクライアントサイド、サーバ側をサーバサイドといいます。
サーバのファイルがhtmlファイルの場合は、ファイルの内容がそのままレスポンスされます。
例えば下記のような内容のhtmlファイルの場合、レスポンスの内容も同じになります。
レスポンスの確認方法はブラウザで右クリックをして、コンテキストメニューの「ソースを表示」（ブラウザにより文言は若干異なります）を選択すると出力されたレスポンスを確認できます。
<!DOCTYPE HTML>
<html>
<head>
<title>商品マスタ</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
</head>
<body>
<table class="common-table">
<caption>商品マスタ</caption>
<thead>
<tr>
<th>商品コード</th>
<th>商品名</th>
<th>単価</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>ペン</td>
<td>100</td>
</tr>
<tr>
<td>2</td>
<td>ノート</td>
<td>200</td>
</tr>
</tbody>
</table>
商品名：<input type="text">
単価：<input type="text">
<input type="button" value="登録">
</body>
</html>