『ちゃんと使える力を身につける Webとプログラミングのきほんのきほん』を読みました

『ちゃんと使える力を身につける Webとプログラミングのきほんのきほん』を読みました。

ちゃんと使える力を身につける Webとプログラミングのきほんのきほん

ちゃんと使える力を身につける Webとプログラミングのきほんのきほん

 

 今回は本書を読んで出てきた事柄の中で、自分が覚えておきたいと思った知識・要点をサマリしてみました。

Chapter1:WebブラウザでWebページが表示される仕組み

・リファレンスマニュアル

http://cdn-ak.f.st-hatena.com/images/fotolife/t/tuto0621/20120425/20120425030302_original.png?1335290654

プログラミング言語の機能がまとめられた仕様書のこと。機能別やアルファベット順などで、プログラミング言語がもつ機能の一覧が記載されている。

フレームワーク

https://connpass-tokyo.s3.amazonaws.com/event/56988/fee3e3c8570b48538b92745a60439fe1.png

フレームワークとは、プログラミングにおいて、一般的な機能をもつ共通コードをユーザーが選択的に上書きしたり特化させたりすることで、ある特定の機能をもたせようとする抽象概念である。あらかじめ用意された環境のこと。

PHPフレームワークCakePHPRubyフレームワークRuby on Railsが有名。

 ・ライブラリ

http://www.softantenna.com/wp/wp-content/uploads/2015/02/Iawesome-ruby.jpg

プログラミング言語において、よく利用すると思われる関数や機能、データなどをまとめたファイルのこと。無償で使えるフリーのライブラリも多い。

RubyGems.org | your community gem hostRubyのライブラリ)

Webクライアント

https://img1-kakaku.ssl.k-img.com/images/maga/10608/img05.jpg?d=201707141312

情報を取得する端末(Webブラウザが動作しているパソコンやスマートフォンのこと)

URLの構造

URLにはプロトコルの名前、サーバーの名前、パスの名前が含まれる。

http://www.mynaviaqua.co.jp/index.html

プロトコルサーバー名    パス名

・静的ページと動的ページ

https://sitest-wp.s3.amazonaws.com/blog/wp-content/uploads/2015/03/static-and-dynamic-page.png

静的ページ:アクセスしたときに同じ内容が表示されるページ。

サーバーにあらかじめファイルとしてページを置いておく。(動画やアニメーションで動くコンテンツがあっても静的ページ!)

動的ページ:サーバー上のプログラムが毎回ページを生成している。ユーザーの入力や現在の状態を見てコンテンツを生成(例:Google検索結果などのページ、掲示板、通販サイト)

レンダリング

https://www.adminweb.jp/wmt/fetch-as-google/img/p2-5.png

WebブラウザがHTMLを解釈して整形すること。(Fetch as Googleの「取得してレンダリング」はそういう意味だったのか)

文字コードのトレンド

日本独自の「JIS」「シフトJIS」という文字コードからUTF-8という世界共通の文字コードが標準になりつつある。世界共通の文字コードであり、多言語に対応するため。

 ・CSSにもライブラリがある

オープンソースCSSBootstrap」が有名。Twitter社が開発

getbootstrap.com

Chapter2:WebサーバからWebブラウザにコンテンツが届くまで

IPアドレスで個人は特定できない

IPアドレスは「地域」「国」「プロパイダ」「企業」ごとに割り振られる。

クライアントのIPアドレスはプールされているIPアドレスの中から適当なものが割り当てられるため、接続のたびにIPアドレスは異なる。(動的IPアドレス

(ユーザーBANだったり二重ログイン禁止をIPアドレスで処理してはいけない理由がわかりました。)

TLDトップレベルドメイン

「.com」や「.jp」のこと。「co.jp」であれば「co」は第2レベルドメインである。

DNSサーバ

ドメイン名とIPアドレスを相互変換するサーバのこと。

wwwの部分はホスト名という。

Chapter3:Webプログラムがコンテンツを作る仕組み

https://image.slidesharecdn.com/visualstudioweb-150108082359-conversion-gate01/95/visual-studio-web-6-638.jpg?cb=1420971671

Webプログラムはブラウザ上で実行される「クライアントサイド」とWebサーバー上で実行される「サーバーサイド」に分かれる。

①サーバーサイドのプログラム

PHP,Perl,Rubyなど

クライアントから要求があった時に実行される

②クライアントサイドのプログラム

JavaScriptなど

「マウスが動かされた」など「○○した時」のタイミングで実行される

プログラムを見られたり改変されたりする恐れがある

ブラウザによって実行されないこともある

・インタプリンタとコンパイラの違い

http://image.gihyo.co.jp/assets/images/book/serial/2007/c-programming-introduction/0001-1.jpg

プログラミング言語には「インタプリンタ形式」と「コンパイラ形式」がある

インタプリンタ形式

ソースコード」と呼ばれるプログラマが記述したテキスト形式のプログラムを実行

実行速度はコンパイラ形式に比べて遅いが実装後に不具合があってもすぐ修正できる

コンパイラ形式

コンパイラ」というプログラムを使い「バイナリコード」に変換したものを実行

ソースコードを秘匿できるが修正する場合もう一度コンパイルし直さなければならない 

※バイナリコードは機械的に処理しやすいよう変換した形式

※インタプリンタ型の言語は「スクリプト言語」と呼ばれることもある

コンパイルする作業のことを「ビルド」と呼ぶこともある。 

CGIとは

Webサーバでプログラムを実行する仕組み。

Webサイトで、掲示板やアンケートのフォーム、アクセスカウンターのように、Webページの内容を動的に変化させたい場面で使われる。

Webブラウザーからの要求により、Webサーバー上でPerlなどの言語で記述されたプログラムが動作し、その結果がHTTPを介してWebブラウザーに返されてWebページとして表示される。

様々なプログラミング言語で書かれたプログラムを実行できる