前回の、プログラミングに必要なタイピングスキル – プログラミング学習 準備 その2 では、タイピングについて学習しました。

今回は、Webの概念について簡単に学習します。

プログラミングを学習しても、今作っているものが一体どの様に形になるのだろう?と分からなくなることがあるかもしれません。

一度でも形にしたものをローンチする(立ち上げる)と全体像が理解できるので 戸惑う ことも少なくなりますが、最初の段階ではそうではありません。

プログラミング学習の前段階として、これから どの部分を学んでどこで活かされるのか、ざっくりと概念を理解しておきましょう。

Webの仕組み

どんな仕組みでWebサイトがブラウザに表示されているのか、プログラミングで作成したファイルをどうすれば世界中の人々に公開できるのか?
について、簡単に理解してもらいます。

なんとなく「こんな感じかー」と理解してくれたらOKです!

深堀りしすぎると果てがないので、プログラミングもそうですが 知ることが必要になったとき に改めて深堀りしていきましょう🙆‍♂️

リクエストとレスポンスの仕組み

ねこが、https://rabico.dev にアクセスする 例

Webの仕組み1

① サーバーにリクエスト!

ねこがパソコンのブラウザで rabico.dev のサーバーに リクエスト します。

② サーバーはレスポンスを返すよ!

サーバーが レスポンス を返し、ブラウザ が結果を表示します。

サーバーとは

リクエストに対して返答するファイルを保存するコンピュータです。

通常、サーバーは外部からのリクエストを受け取るために、決められた手段に限り外部からのアクセスが可能です。

Webの仕組み2

① このドメインのIPアドレスは?

→ rabico.dev というドメインの IPアドレス を DNSサーバー に尋ねます。

②  この IPアドレス だよ

DNSサーバーたちはお互いに尋ね合って IPアドレス を見つけてくれます。

③ ④ は 単純な例 の ①② と同じ

IPアドレスとは

インターネットに接続している端末の 住所 のようなものです。

インターネットに接続されているすべてのデバイスは、このIPアドレスを持っています。

サーバーに接続するためには、この IPアドレスを用いて接続 を行います。

IPアドレスの例: 216.58.197.238

ドメインとは

IPアドレスは人が使うには分かりにくく不便なので、文字列で表現 しよう!
と、IPアドレスに紐付けたものがドメインです。

ドメインの例: rabico.dev, google.com

DNSとは

DNS(Domain Name System)は、ドメイン を元に IPアドレス を保持、検索するサーバーです。

rabico.dev の IPアドレス を DNS にリクエストしたら 該当するIPアドレスを探して レスポンスを返してくれます。

このDNSサーバーから返ってきたIPアドレスに 実際のリクエスト を行います。

URL(URI)の意味

URL のことを URI と呼んだりすることがありますが、違いを特に気にすることはないと思います。

普段何気なく使っているこの URL にもそれぞれ意味があります。

Webの仕組み3

① プロトコル(規格)

httpsでリクエストしますよ。という宣言をすることで、この規格に沿った情報が付加されます。
httphttps が Web用です。

② ドメイン

www の部分は サブドメイン で、google の部分は 独自ドメイン、com の部分は トップレベルドメイン と呼ばれます。

③ サーバー内のディレクトリパス

サーバー内の どこのファイルが欲しいかという情報 です。
スラッシュ(/)を使って ファイルやデータまでのパス を指定します。
例えば、demoフォルダの中にある test ファイルにアクセスしたい場合は demo/test といったようになります。

④ パラメータ

リクエスト先の ファイル に渡すことができる 検索用の文字列 です。アンパサンド(&)で繋げることで複数の パラメータ を渡すことができます。
例えば、姓(lastName)名(firstName)をパラメータに指定する場合は、 ?lastName=野比&firstName=のび太 となります。

ポート番号について

パソコンは、メールやファイルの送受信、ブラウザの検索 など多くの通信を行います。

たくさんのデータと通信しているのに、メールが届いたときに誤ってブラウザが立ち上がることがないのはなぜでしょう?

どこで「このデータはブラウザに表示する」と判断しているのでしょうか?

この判断をしているのが ポート番号 の役割です。

「ポート番号が80番で来たから、ブラウザで表示させればいいんだね」と判断しています。

ポート番号の例:
ファイル転送(FTP)は20〜21番、メール送信(SMTP)は25番、メール受信(POP3)は110番、HTTPは80番HTTPSは443番 など

プログラミングで作成するところ

プログラミングでは、リクエストをもとにデータを返却するための ファイルを作成 します。

ブラウザで表示されるファイルを作成し、結果を返すサーバー内に保存 することで世界に公開します。

開発するときは、自分のパソコンにファイルを保存し 自分のブラウザで開いて確認するため 外部のサーバーは不要です。

Webの仕組み4

他にも、データベース・サーバー や、バックエンドサーバー など、複数のサーバー間で通信を行った結果を返却することがあります。

課題

IPアドレスってどんなもの?説明してください。

ドメインってなに?説明してください。

DNSの役割とは?説明してください。

サーバーってなにしてる?説明してください。

ポート番号の役割とは?説明してください。

プログラミングで作成したファイルを公開するときはどこに保存する?説明してください。