【イラスト図解式 この一冊で全部わかる Web技術の基本】 「3-4.ステータスコード」を読んで
【イラスト図解式 この一冊で全部わかる Web技術の基本】
「3-4.ステータスコード」を読んで
「イラスト図解式 この一冊で全部わかる Web技術の基本」の第3章4節についての要点、自分なりの知識の整理の2点を述べていきます。
1.要点
ステータスコード
HTTPレスポンス内に含まれるHTTPリクエストに対するWebサーバーの処理結果
3桁の数字
ステータスコードの分類
＜応答の種類＞
100番台 infomational（情報）
200番台 Success（成功）
300番台 Redirection（転送）
400番台 Client Error（クライアントエラー）
500番台 Server Error（サーバーエラー）
2.知識の整理
気になったことを3点まとめていきます！
- ちょっとだけ補足
- 覚えておくと便利なステータスコード
- この数字になった理由はある？
- ちょっとだけ補足
・ステータスコードはWebブラウザが「HTMLを受信する前に」受信する
・ステータスコードを送信しているのは「Webサーバー」
・ステータスコードはHTTPレスポンスのステータス部分に書かれている
- 覚えておくと便利なステータスコード
503とは長〜〜〜いお付き合いです。（ドルオタ）
- この数字になった理由はある？
【結論】特にない
なーーーーーーーーーーにーーーーーーーー！？（やっちまったなぁ）
気まぐれで決めた
WWWの開発者ロバート・カイリューのプログラマーが決めたと言われています。
彼はハイパーテキスト構造、のちのウェブの開発者でもあります。（強強もはや神）
開発された当時は、今ほどメモリの容量がなかったため、長いメッセージを受け取るのは難しいとされていました。
（メモリの容量が64キロバイトのパソコンでプログラミングするくらい）
そこから気分で数字を当てはめていったとか。。
それが今でも使い続けられているようです。（すごい）
明日はメッセージヘッダーについてまとめます！
ご意見やご指摘、感想などコメントでお待ちしています！
最後まで読んでいただき、ありがとうございました！
【出典】
イラスト図解式 この一冊で全部わかるWeb技術の基本
「404」は部屋番号だった？ 「Not Found」エラーにまつわる噂の真偽を、「生みの親」に聞いてみた
HTTP レスポンスステータスコード
【イラスト図解式 この一冊で全部わかる Web技術の基本】 「3-3.HTTPメソッド」を読んで
【イラスト図解式 この一冊で全部わかる Web技術の基本】
「3-3.HTTPメソッド」を読んで
「イラスト図解式 この一冊で全部わかる Web技術の基本」の第3章3節についての要点、自分なりの知識の整理の2点を述べていきます。
1.要点
HTTPメソッド
HTTPリクエストを用いてWebサーバーに具体的な要求内容を伝えているもの
代表的なものにGETメソッド、POSTメソッド
両者はデータの送信方法が異なる
○GETメソッド
URLの後ろに送りたいデータを付与する
閲覧履歴に残る
○POSTメソッド
HTTPリクエストのメッセージボディ内にデータを含める
閲覧履歴に残らない
ユーザーID、パスワードが必要な会員制サイトで使用
大量にデータを送信したい場合にも使用
2.知識の整理
以下2点について気になったので深掘りしていきます！
- GETメソッド、POSTメソッドの違い
- 代表的なメソッドについて
- GETメソッドとPOSTメソッドの違い
○GETメソッド
意味：サーバー上のファイル本体を取り出す
https://blog.hatena.ne.jp/Web773/web773.hatenablog.com/edit
?entry=26006613784075456
「パラメータ名（変数）＝パラメータ値」の構成
○POSTメソッド
意味：サーバー上のプログラムにデータを送付する
GETメソッドではURLについていたリクエストパラメータ（?entry=26006613784075456の部分）がメッセージボディに格納されている
メールアドレスや住所、クレジットカード情報などの個人情報をWebサーバーに送る場合に使用される
- 代表的なメソッドについて
主に「GET」「POST」「HEAD」が使用される
○HEADメソッド
基本的にはGETメソッドと同じだが、メッセージがないバージョン
ヘッダーのみ
主にデータの更新日時やデータサイズを取得したいときに使用される
3.感想
メソッドを知ることで、ブラウザとサーバーとのやりとりの様子が具体的にわかるようになれるなと思いました。
また、総じて3章は何をやっているかよくわからなくなりがちなのですが、少しずつ解像度をあげて調べていくことで、苦手意識がなくなってきているように感じます。
コンピューターの知識があると、作るときにも役立てますよね。
明日はステータスコードについてまとめます！
ご意見やご指摘、感想などコメントでお待ちしています！
最後まで読んでいただき、ありがとうございました！
【出典】
イラスト図解式 この一冊で全部わかるWeb技術の基本
HTTP リクエストメソッド
「HTTP」の仕組みをおさらいしよう（その1）
HTTP GETとPOSTの違い
【イラスト図解式 この一冊で全部わかる Web技術の基本】 「3-2.HTTPリクエストとHTTPレスポンス」を読んで
【イラスト図解式 この一冊で全部わかる Web技術の基本】
「3-2.HTTPリクエストとHTTPレスポンス」を読んで
「イラスト図解式 この一冊で全部わかる Web技術の基本」の第3章2節についての要点、自分なりの知識の整理の2点を述べていきます。
1.要点
HTTPにおけるやりとりにはHTTPリクエストとHTTPレスポンスがある
HTTPリクエストの構成
リクエスト行、メッセージヘッダー、メッセージボディ
HTTPレスポンスの構成
ステータス行、メッセージヘッダー、メッセージボディ
2.知識の整理
構成がざっくりわかりましたが、具体的にそれぞれで何が行われているかはまだわかりません。
これを知ることでより理解が深まると考えたので、まとめていきます。
- HTTPリクエスト、HTTPレスポンスの復習
構成はざっくりわかりましたが、具体的にそれぞれで何が行われているかはまだわかりません。
これを知ることでより理解が深まると考えたのでまとめていきます。
Webサイトを閲覧するためには、まずこの工程が必要でしたね。
ブラウザからWebサーバーに送られるのはHTTPリクエスト（要求）、
Webサーバーからブラウザに送られるのはHTTPレスポンス（応答）と言います。
- HTTPリクエスト、HTTPレスポンスでは何が行われている？
【HTTPリクエストのメッセージ（ブラウザ→Webサーバー）】
○リクエスト行（画像の「POST / HTTP/1.1」と書いてあるところ）
Webサーバーに対してどんな処理を依頼するかの記述
1.「POST」...「メソッド」Webサーバーに対する要求
（POSTなので、データをWebサーバーへ送信するという意味）
2.「HTTP/1.1」...「バージョン」HTTPのバージョン
※1と2の間にパス名 （リクエスト対象のデータ、URLなど）が入ることもある
○メッセージヘッダー（画像のRequest headers、General headers、Entity headersの部分）
ブラウザの種類、対応するデータの種類、データ圧縮方法、言語などの情報の記述
1.Request headers
指定するとリクエストを変更するもの (Accept-languageなど)、状況を示すもの、条件を与えるもの
2.General headers
メッセージ全体に適用されるもの
3.Entity headers
リクエスト本体に適用されるもの
○空白行
メッセージヘッダーの終わり
○メッセージボディ（画像の「-12656974」と書いてあるところ）
Webサーバーにデータを送るためのもの
【HTTPレスポンスのメッセージ（Webサーバー→ブラウザ）】
○ステータス行（画像の「HTTP/1.1 200 OK」と書いてあるところ）
Webサーバーがブラウザに処理結果を伝える
1.「HTTP/1.1」...「バージョン」HTTPのバージョン
2.「200」...「ステータスコード」リクエストの成功失敗を伝える数字
（200なので、表示成功。代表的なのは、一時的に転送の302、表示失敗の404）
3.「OK」...「テキストフレーズ」ステータスコードの内容をテキスト化したもの
○メッセージヘッダー（画像のResponse headers、General headers、Entity headersの部分）
Webサーバーのソフトウェア情報、返信するデータの種類、データ圧縮方法などの情報の記述
1.Response headers
ステータス行で伝えられないサーバーの追加情報
2.General headers
メッセージ全体に適用されるもの
3.Entity headers
レスポンス本体に適用されるもの
○空白行
メッセージヘッダーの終わり
○メッセージボディ（画像の「-12656974」と書いているところ）
HTMLや画像などのデータを格納する場所
表示されるまでには、このような情報がやりとりされていることがわかりました。
細かく分解していくと、少しずつ解像度が上がってきて、少しずつわかってきたような？気が？します。
おまけ
デベロッパーツールでもHTTPリクエストとHTTPレスポンスが見られる！
調べていくうちにわかったのですが、ブラウザのデベロッパーツールでこの一連のやりとりが見られるんです！（すごい）
Chrome...バージョン: 91.0.4472.114（Official Build） （x86_64）
オペレーティングシステム...mac Big Sur バージョン11.2.3
デベロッパーツールを開いたら、
①「Network」タブをクリック
②Webページ内のリンクに飛ぶと出てくる「Name」タブのデータの行をクリック
③「Headers」タブが表示され、以下の画像のような表示
これで細かくどんなやりとりがされているかわかります！
普段Webページ作成で使っているデベロッパーツールでもやりとりが見られるとは知らなかったです！
また新しいことを一つ知れました！
明日はHTTPメソッドについてまとめます。
ご意見やご指摘、感想などコメントでお待ちしています！
最後まで読んでいただき、ありがとうございました！
【出典】
イラスト図解式 この一冊で全部わかるWeb技術の基本
HTTP メッセージ
閲覧しているウェブページで利用されている HTTP のバージョンを確認する方法
【イラスト図解式 この一冊で全部わかる Web技術の基本】 「3-1.HTTPメッセージ」を読んで
【イラスト図解式 この一冊で全部わかる Web技術の基本】
「3-1.HTTPメッセージ」を読んで
「イラスト図解式 この一冊で全部わかる Web技術の基本」の第3章1節についての要点、自分なりの知識の整理の2点を述べていきます。
1.要点
HTTPとは
テキストファイル、画像などのコンテンツをやりとりする際に使用するプロトコル
HTTPのはじまり
1990年代、HTMLのテキスト情報のみ配信する機能
HTTPリクエストとHTTPレスポンスがある
2.知識の整理
- HTTPの歴史を超簡単にざーっくりまとめてみたよ
HTTPは幾多のバージョンアップをして現在に至ります。
正直、すごーく複雑でした！（笑）
ポイントになりそうなところ、さまざまな共通して書かれているところを抽出してとりあえず書きました。
正直、用語や流れなど、まだまだわからないことも多いです。
詳細は次回以降深掘りしていきます。
1990年: HTTP/0.9
HTMLのドキュメントを要求して取得するだけ
1996年: HTTP/1.0
メソッドに POST などGET以外のものが増えた
レスポンスにはヘッダーがつく
ステータスコードを含める
リクエストプロトコルにバージョンを含める
1997年: HTTP/1.1
通信の高速化
OPTIONS、TRACE、CONNECTメソッドの追加
バーチャルホスト
2015年: HTTP/2.0
ストリームによる通信の高速化
サーバプッシュ
2018年: HTTP/3.0
暗号化通信（SSL証明書の利用）が前提
データの受け取り方を効率化
次回はHTTPリクエストとHTTPレスポンスについてまとめます。
ご意見やご指摘、感想などコメントでお待ちしています！
最後まで読んでいただき、ありがとうございました！
【出典】
イラスト図解式 この一冊で全部わかるWeb技術の基本
HTTPの歴史と技術の変遷
HTTP の進化
【レポート】「実務未経験からエンジニアになるための秘策とは？〜面接対策編〜」まとめてみたよ
「実務未経験からエンジニアになるための秘策とは？〜面接対策編〜」
4/12に開催されたアルサーガパートナーズ株式会社の人事はらかなさん主催のセミナー「実務未経験からエンジニアになるための秘策とは？〜面接対策編〜」の参加レポートをブログにも投稿します。
以前noteに投稿した記事を修正したものになっています。
※ちなみに投稿したnoteは消えちゃったんです。（なんで〜〜号泣〜〜〜）
1.IT業界の転職トレンドの概況（2021年4月現在）
【全体】
コロナ禍で求人数は減少している
求職者数は増加している
（特に飲食業、観光業など、コロナ禍打撃を受けている職種）
有効求人倍率は2019年末10%→2021年7%
経験者募集は増加
【求職者の状況】
経験者は求職活動をストップ（案件数も不安定なため）
未経験者のエンジニア志望者数が増加
→やはり経験者が有利、未経験者は選考が厳しい
未経験者でもエンジニアになるには、結論やる気が大事
2.転職に成功している人の類似点
【結論】決意と覚悟が明確、それがきちんと伝わる人
①アウトプットをしっかりしている人
②定性、定量で成果が語れる人
③自身が企業に活かせるスキルが分析できている人
④入社してからのビジョンが描けている人
①アウトプットをしっかりしている人
成果物のフィードバックをしてもらった事実を面接の中で伝えるといい
→業界での交流がある、自己研鑽できている事実が伝わる
②定性、定量で成果が語れる人
自身の目標を【定量】で話し、その結果どのくらいコミットしたかというのを【定量＋定性】で話す
例）勉強時間や期間（定量）、今後の展望など定量部分に肉付けできる部分（定性）
③自身が企業に活かせるスキルが分析できている人
・どういうスキルを求められるのか（求人原稿、社員インタビュー、会社ホームページなどにヒントがある。もし調べてもわからなければ担当者にホームページ経由で質問しても大丈夫）
④入社してからのビジョンが描けている人
自分史を作る
・自己分析から仕事に対する自分の価値観を考え直す
→自己分析にはWill（これからやりたいこと）Can（自分ができることの現状）Must（求められるスキル）を用いる
・短期的、中期的な目標を考える（時間軸もセット、将来的にめざすのはゼネラリストorスペシャリストなのか）
▽自分史の書き方について
就活日記～失敗談と失敗しない為のノウハウについて～｜はらかな｜note
3.自己PRと志望動機
【面接でよく聞かれる質問】
・自己紹介
・志望動機（業界、職種、企業それぞれ）
・前職について
・企業選びの軸について
・キャリアビジョン
・他社の選考状況
・逆質問
・自己紹介
すっきりと簡潔に（3〜4文目安）
話しすぎない
・志望動機
結論、きっかけ、将来、貢献できること、結論の順で話す
・企業選びの軸
会社主体での軸についての回答がベスト
（例：やりがい、社風、自身と企業の成長など）
・逆質問
基本気になることは聞くスタンスでOK（お互いにミスマッチを防ぐため）
×ホームページや企業情報を見ればわかること
×面接のフィードバック（第一志望でないことが伝わってしまう）
4.質疑応答より
現在、選考を受けている方からの情報もあったので追加
・GitHubを見る企業さんは多い
・資格の有無はあまり重要視されないところも
（企業によって評価がまちまち、資格によっては入社してから役立つものもあるので一概には言えない）
・Web面接の場合、面接開始時間の5分前〜時間ちょうどに入室がベスト
（実際の面接の感覚で大丈夫）
以下、自分の考えです。
5.考えたこと〜わたしの転職活動戦略〜
【結論】事前準備が鍵となる
事前準備のなかには、転職活動における準備（職務経歴書、ポートフォリオ、面接対策）と普段の学習（学習における準備）の2つ
・転職活動に向けた準備
転職活動に特化したサービスもあるから、これでもかってくらいこれはみんなやる
短期集中で頑張るイメージがあります。
エンジニアを目指す人はTwitterをやる人が多く、情報感度が高いです。
だから、未経験転職の現状を知ってる人が多いとは思います。
わたしも体感したけど、「未経験者向け」のセミナー、LT会への未経験者枠の参加人数えぐい（笑）
フリーランスの期間挟んでから会社に就職する人も一定数います。ある意味戦略。
・普段の学習面における準備
目指す人が多い今、より差別化を図りたいならおそらくここ！
○SNS
【結論】企業の方に見られても恥ずかしくない発信を心がける
主にTwitterの活用（学習内容、読書記録、セミナー等の参加記録など）ですかね。
普段のツイート内容、プロフィールの書き方、アイコンなどなど、どんな考えの人なのかっていうイメージがつきます。
隠しきれないアウトプットってここかなって印象です。
「企業に就職」してエンジニアのお仕事をしたい方だとしても、普段から「自由に働きたい」「稼ぎたい」「早期リタイアしたい」「フリーランスになりたい」と書いている方を、企業は採用しようと思うでしょうか。
（業界の方いわく、発信内容だけでなく、ポートフォリオからも雰囲気がわかるそうです。）
○Qiita,Zenn,GitHub,ブログの活用
【結論】目的を持って活用しよう
ここでのアウトプットも企業さんに非常に重要視されるようです。
ただ、闇雲に数を出せばいいわけでなく、それぞれにきちんとルールがあるので、しっかり規約とにらめっこ必須ですね。
○勉強会、セミナーやコミュニティへの参加
【結論】目的を持って参加しよう
いろんなコミュニティがありますが、スキル感を見て、
自分と同じくらいの立場の方や業界の先輩方がいらっしゃるものがいいと思います。
これまで勉強会にいくつか参加しましたが、勉強会がきっかけでそのテーマだけでなく、自分の知識レベルの現実がわかるんですよね。笑
参加者の方が話している用語がわからなかったらすぐに調べる、勉強会に参加した方と関わりを持てるようにするなど、ここをきっかけに、ただ学んでいるだけでは身につかない現実もわかります。
少なくともギャップを埋められるのではないでしょうか。
あと、セミナーに参加するとやる気スイッチが押されます。鼓舞されます。
体感として、取り組んでいる課題の進捗が悪いときほど、参加してよかったと思えます。
6.まとめ
【結論】定期的に立ち止まって考えてみよう
どんな仕事でもそうですが、改めて思うのは、IT/Web系の仕事は目指す人が全員なれる職種では決してありません。
技術の進歩についていくために毎日勉強が必要ですし、実力主義、職人気質な世界に見えます。向き不向きがかなり如実な仕事です。
この業界は人手不足って言われていますが、きっと単なる人手不足ではなく（企業が求めている）人手不足だと思います。
わたしの足りないところ「軸と志望理由」
昨日（もはや今日）現役でWeb業界で働かれている方とお話をする機会がありました。
そのとき、自分がどんな企業に行きたいかの軸、どうしてエンジニア（コーダー）じゃないといけないのかという志望理由が即答できませんでした。
すごく恥ずかしいです。
つくることが好きなのに、それをその場で言えなかったことがすごく悔しいです。
自分に厳しく自己分析もしていきます。
セミナーをきっかけに自分のこれからについて考え、分析することができました。
今回、きっかけをくださったはらかなさんに感謝です！
ありがとうございました！
【参考】
【面接対策】実務未経験からエンジニアになるための秘策
【番外編】表記はWEB？Web？web？ウェブ？まとめてみたよ
【番外編】表記はWEB？Web？web？ウェブ？
1.この記事を書く背景
表記バラバラすぎ！お仕事で使う用語は正しく使っていきたい
WebやITについての学習を始めて、「ウェブ」という用語を本当によく目にするようになりました。
初学者さん、現役でお仕事されている方問わず、「WEB」「Web」「web」「ウェブ」という用語を使ってツイートされているのを、Twitterでも毎日のように見かけます。
わたしがコーディングの学習を始めた昨年末から見ていますが、
正直この表記が入り混じっていることにはだいぶ衝撃を受けました（笑）
文面でのやりとりなので、意味がきちんと伝われば表記や表現の仕方はある程度許容されるべきだとは思います。
制作にはまったく影響が出ませんし。
それに、Twitterはライトな場所。楽しいSNSの空間。あまり言葉の誤字脱字等に突っ込まないのって暗黙のルールじゃないですか。。
それでも、できることなら正しい言葉を使いたいという気持ちがあったので、今回この記事を書くことにしました！
方向性としては、巷の情報を集めて、あくまでもわたしなりのひとつの解を出してみようというコラムです！（本当に正しいかどうかは分かりません！！！！！！！！）
2.検討
どのように検討していくかを考えました。
- 検索ワード数をざっくり比較
- この話題に類似したブログや記事がないか探してみる
- ニュース、利用規約など公に出ているものを探してみる
順にやっていきます。
1.検索ワード数を比較
これを調べることで、
- 検索されている母数がわかる
- さまざまな方が検索しているので、ユーザーの現状がわかる
今回はGoogle Trendを用いて比較してみました。
※なお、大文字と小文字の区別（WEB/Web/web）がつかないため、今回は英字とカタカナ表記の2種類の比較とすることにしました。
【結果】圧倒的多数英字「Web」
検索されているワードとしては英字表記のものが圧倒的に多いです。
2倍以上違いますね。
理由としては、英字は英語圏が含まれるからですね。
もはや必然的な結果と言わざるを得ないです。笑
（正直、調べるまでもなかったかも？笑）
2.この話題に類似したブログや記事がないか探してみた
これを調べることで、
・筆者の見解がわかる
・たいてい業界の方が書いてくださっているので、その業界の生の意見がわかる
計3つのブログ・記事があったので、筆者の見解とともにまとめます。
①結論「ウェブ」派
（著者 プログラミング学習コミュニティ「ともすた」運営 たにぐちまことさん）
概要
- 「Web」が一般名称になって「web」
- もともと「web」は英文の中で使う単語だが、日本人はこの表記で使用
- 日本語も一般名称になるとカタカナになる言葉があるから「ウェブ」
②結論 基本は「Web」で見出しなどは「WEB」派
（ウェブデザイナー兼コーダー Gitaさん）
概要
③結論 「Web」
（WEBデザイナーズNEXT Web制作者コラムより）
概要
・基本は「Web」（Webは「World Wide Web」の略であるため）
ここまでのところ「Web」表記を最適だと考える方が多いようですね。
ちなみに、執筆された3名とも、当時Web制作業界で働かれていた時に書かれたものです。
記事自体も少ないので全体を把握することは難しいのですが、現役の方の考えはこれが近いのかな？という印象を受けました。
3.ニュースサービスの媒体名、利用規約など公に出ているものを探してみる
これを調べることで、
・公に出ているものなので、その媒体がどの表記を最適だと思っているかわかる
・その表記にしている意味がわかる
・ある程度の共通項も見える
○ニュースサービス媒体名一覧
Yahoo!ニュースに記事を提供しているニュースサービスの一覧から「ウェブ」表記されているサービスを抜粋しました。
「WEB」表記 計7
- NHK NEWS WEB（NHK）
- MANTANWEB（MANTAN）
- MEN'S NON-NO WEB（株式会社集英社）
- PHILE WEB（音元出版）
- ハルメクWEB（株式会社ハルメク）
- ねこのきもち WEB MAGAZINE（ベネッセコーポレーション）
- キネマ旬報WEB（株式会社キネマ旬報社）
「Web」表記 計12
- Sankei Web（産経新聞）
- 東スポWeb（東京スポーツ新聞社）
- 中日新聞Web（中日新聞社）
- MonoMax Web（株式会社 宝島社）
- Number Web（株式会社文藝春秋）
- SOCCER DIGEST Web（株式会社日本スポーツ企画出版社）
- Tarzan Web（株式会社マガジンハウス）
- ドライバーWeb（株式会社八重洲出版）
- サッカーマガジンWeb（株式会社ベースボール・マガジン社）
- サッカー批評Web（株式会社双葉社）
- ベストカーWeb（講談社ピーシー）
- 岐阜新聞Web（岐阜新聞社）
「web」表記 計4
○利用規約について（あくまで肌感）
- ブラウザを扱っているところはすべて「Web」表記
- （Safari,Google Chrome,Yahoo!,Firefox,MicroSoft Edge,Internet Explorer）
- 「ウェブ」表記は少なめ
- 「WEB」表記はもっと少なめ
- 「web」表記は皆無
以上から、ニュースサービス名や利用規約ともに「Web」表記が圧倒的に多かったことがわかりました。
4.まとめ
【結論】「Web」が最適？（あくまでも個人的な意見）
いろいろ調べましたが、わたしは「Web」表記が最適だと思いました。
タイトルやサービス名に「WEB」が使われているのは「強調」の意味合いが強いと思っています。
名前を「HANAKO」にするか「Hanako」にするかみたいなものなので、この辺に関してはとやかく言えないです。むしろ尊重するべきです。
ただ、「WEB制作」や「WEBアプリケーション」というような、名前でない、もともとある概念を大文字表記にするのはまずい印象を受けました。
この表記の仕方は、WHO、NHKのように何かの頭文字を取った略称であるなら問題ありません。
しかし、「WebはWorld Wide Webの略」とすでに概念として定まっているため、それを覆すことになってしまいます。
言葉の意味に忠実に則るとすれば、この表記は誤りなのかなと思います。
以上から、「Web」表記がいいと思いました。
4.おまけ
「えっなんでこんなしょーもないことガッツリ調べたの！？」と言われてもおかしくない文量になってしまいました（笑）
でも、こういう認識のずれの積み重ねで仕事がうまく行かなくなることもあるんじゃないか、何気ない価値観や考え方をすり合わせることもチームで動く仕事において大事なのではないか、ということを伝えたくて今回まとめてみました。
あたりまえのことなんてないのでね！
なんとびっくり3100文字オーバー！！！！！！！
今日はここまでにします！
ご意見やご指摘、感想などコメントでお待ちしています！
最後まで読んでいただき、ありがとうございました！
【イラスト図解式 この一冊で全部わかる Web技術の基本】 「2-7.HTTP」を読んで
【イラスト図解式 この一冊で全部わかる Web技術の基本】
「2-7.HTTP」を読んで
「イラスト図解式 この一冊で全部わかる Web技術の基本」の第2章7節についての要点、自分なりの知識の整理、この2点を述べていきます。
1.要点
HTTPとは
Webサイトが閲覧できるのは、WebブラウザとWebサーバーのやりとりのおかげ
このやりとりの手順や内容を決めているのがHTTPというプロトコル
HTTPプロトコルのおかげでWebページの閲覧ができる
＜Webページが閲覧できるしくみ＞
①Webブラウザの検索欄に見たいサイトのURLを入力
②HTTPプロトコルはWebサーバーにデータを要求
③WebサーバーはWebブラウザから要求されたデータを解析、用意
④HTTPプロトコルは③で用意できたデータを応答
⑤Webブラウザは④で受け取ったデータを解析し、表示
2.知識の整理
- ヘッダー（ヘッダ）とは？
Webページが閲覧できるしくみとTCP/IPの構造を対応させた説明を見ると、どこにも必ず「ヘッダー（ヘッダ）」という用語が出てきます。
この「ヘッダー（ヘッダ）」とはわからなかったので、まとめていきます。
ヘッダー（ヘッダ）とは、そのデータに関する補足情報のこと
1で述べたHTTPを例に挙げて説明します。
WebブラウザとWebサーバー間でやりとりされているデータの構造をわかりやすく表示すると
（「分かりそう」で「分からない」でも「分かった」気になれるIT用語辞典）
データは「本体」と「補足情報」がセットになって送受信されることが少なくありません。
この補足情報の部分をヘッダー（ヘッダ）と言います。
（データも細かく分けられるんですね。）
手紙で例えると、ヘッダー（ヘッダ）の部分が封筒、データ本体の部分が便箋です。
また、考えたのですが、
データの構造から見ると、この<head>と</head>の範囲がヘッダー（ヘッダ）、その後から続いている<body>と</body>の範囲がデータ本体、というイメージもできるなと思いました。
イメージして考えると分かりやすいですね。
今日はここまでにします！
ご意見やご指摘、感想などコメントでお待ちしています！
最後まで読んでいただき、ありがとうございました
【出典】
イラスト図解式 この一冊で全部わかるWeb技術の基本
WebブラウザとWebサーバー間のやりとり
ヘッダとは
HTTPヘッダとは
HTTPヘッダー（MDN Web Docs）
