絶対完全無料ツールの紹介

エンジニア目線のブログです

#1 WEBとは?仕組みを解説 基本的な概念の理解が重要【講義】

youtu.be

今回はWEBの仕組みについて解説していきます
クイジェンのサイトを例に説明すると
みなさんが使用しているPCのブラウザからこのURLでアクセスすると
https://programming.quigen.info/
サーバー側でこのURL(含めたリクエスト全て)に対してどのように対応したり、表示したりするかを解釈します。その解釈を一瞬ですまし、HTML,CSS,JSのコードを表示してその表示をブラウザが解釈します。

そのブラウザが解釈して人の目で見えるページが皆さんがいつも見ているページです。

このアクセス先のサーバーの構成がこの図のようにでできています。
そもそもサーバーとは何かというと動きっぱなしのPCと考えてもらえるとわかりやすいかと思います。

実践動画#7.1.1 xamppの回でxamppをインストールしたのですが、
WindowsApache, MySQL, PHPをインストールしているので、WEBシステムが揃っています。
なので、xamppが入ったPCを動きっぱなしにすればそれがサーバーと言っても間違えではないです。

事実2005年くらいに人材紹介系のWEBサイトをプログラミング作成して公開した事があるのですが、
自宅のPCをサーバーにして公開していました。
公開にはネットワークの設定が必要ですが、自宅PCでも可能です。
しかし、家にいない時にPCの再起動が必要な時は母親に電話してPCの電源をON/OFFしてもらうとか
結構手間がかかってしまったので、クラウドとかレンタルサーバーに切り替えました。

次にデータの流れを説明すると
まずは手元にあるPCのブラウザからサーバーにアクセスします。
WEBが受け取って、PHPに渡します。PHPがDBからデータ取得、更新などをして、
HTML,CSS,JavaScriptのコードで表示します。それをまたWEBで反映して
ブラウザで解釈します。その解釈されたものがみなさんが見ているWEBページになります。

最後にDBとは?について
データベースと言ってもスプレッドシート、エクセルと似たようなものと考えれば簡単かと思います。
1枚のシートがDBでいうところのテーブル
A,B,Cの部分がカラムで、1,2,3の部分が行です。
DBからこの"item A","item B","item C"のデータを取得する時はSELECT文でデータ取得して、
追加の時はINSERT、更新の時はUPDATE文を利用します。
フィルタリングして"item A"だけを取得したい時はWHEREを用いてフィルターします。
SELECT B FROM seat1 WHERE A = 1といったSQLになります。
開発環境ではなく本番のデータでは何百万行ぐらいあるデータも珍しくないです。
実践動画ではphpMyAdminで実際にSQLを実行しながら紹介していきます。

web用語全般のクイズ集
https://programming.quigen.info/category/1/50/