やあ､ お帰りなさい｡
ここで､ サーバーからブラウザへのデータ転送について､ 少しお話ししたいと思います｡
さて､ デベロッパーツールを開いてみると､ こんな感じでした｡
ネットワークタブを開いて､ 実際にサーバーからどのようなデータが送信されるかを確認することができます｡
そして､ ここでは､ さまざまなタイプがあることを確認しましたが､ 主にHTML､ CSS､ JavaScriptについて説明しました｡
例えばHTMLをクリックすると､ コンテンツタイプというフィールドがあり､ テキストHTMLファイルであることがわかります｡
これは､ MIMEタイプと呼ばれるものを使用するため､ 非常に重要なもので､ multipurpose Internet
mail extensionsの略称です｡
とても印象的な響きですね｡
ブラウザはファイルの拡張子ではなく､ このMIMEタイプを使ってURLの処理方法を決定していることがわかります｡
そのため､ Flaskアプリがブラウザに自動的に送信するコンテンツタイプを見て､
そのファイルをどう扱うかを判断しています｡
CSSファイルでしょうか？
JavaScriptのファイルでしょうか？
さて､ 結局のところ､ 私たちが転送しているデータはすべて単なるテキストですが､ それらはさまざまな形式を持ち､ ブラウザはさまざまな方法でそれらとやり取りすることができます｡
例えば､ ここでずっと下にスクロールしてみると｡
さまざまなタイプがありますが､ ここではWeb開発者にとって重要なMIMEタイプに焦点を当てたいと思います｡
プレーンテキストなどがあります｡
CSSを搭載しています｡
HTMLがあります｡
JavaScriptがあります｡
に行けばいいように｡
JavaScriptのファイルをここに置いて､ コンテンツタイプに移動します｡
アプリケーションJavaScriptであることがわかり､ なぜアプリケーションJavaScriptなのかについての注意書きがここにあります｡
テキストJavaScriptの代わりに
どっちでもいい｡
こうすることで､ ブラウザは知ることができます｡
これからJavaScriptのファイルを読み込むところです｡
JavaScriptのファイルなので､ ある種のことをする｡
さて､ 下にスクロールしていくと､ 画像の種類もありますね｡
画像を見ると､ 例えばPAGの場合､ 下にスクロールしていくと､
画像のPAGであることがわかります｡
この知識に基づいて､ ウェブサイトはこれらのデータをすべて送信し､ ブラウザが私たちのためにページを構築することをうまく処理することで機能しているのです｡
さて､ ここまではHTML､ CSS､ JavaScriptの話でしたが､ 通常､ ウェブサイトはこのように表示されます｡
しかし､ APIエンドポイントと呼ばれるような､ サーバーを利用する方法もあります｡
そこで､ ここに「Sloppy SEO」という､ スターウォーズAPIの略称を掲げます｡
そして､ このようにデータを送ってくれるのです｡
つまり､ ウェブページを表示するのではなく､ 情報を送ってくるだけなのです｡
だから例えば､ これをコピーすると
そうそう｡
そして､ こっちで人をやるとします｡
だから､ 人をやりましょう｡
エンターキーを押すと
あれを見てください｡
こんなデータが出るんです｡
そして､ このコンテンツタイプはJSONと呼ばれるものです｡
JSONは､ アプリケーションで使用できるデータの形式です｡
このデータをもとに､ あるウェブサイトでは「ルーク・スカイウォーカー」という名前をトップページに表示することができるかもしれません｡
このエンドポイントでは､ HTML､ CSS､ JavaScriptを送信する代わりに､
このJSONデータを送信します｡
データを提供するものです｡
例えば､ このロボハッシュのサイトなど､ いろいろなものを送ることができます｡
例えばここに好きなことを書いてエンターキーを押すと､ スタンドポイントの何かを変更した場合､ ランダムにロボットの画像が送られてきます｡
違うロボットが出るんです｡
ウェブ開発者やモバイル開発者は､ 世界中のサーバーから情報を取得し､ サーバーからデータを取得し､
ブラウザに有用なものを表示しようとするこのアイデアを使用しています｡
そして､ これでサーバーの持つ力を知ってもらえたらと思います｡
何でもできるんです｡
選択肢は無限大です｡
そして､ Pythonでいろいろなサーバーを構築して､ いろいろなことをやってもらうことができるのです｡
わかりました｡
それでは､ ポートフォリオサイトに戻りましょう｡