ローカル環境構築!!の前にWebサイト仕組みを整理しておく

※ローカル環境の設定方法は当記事には記載しておりません。
MAMPを使用したローカル環境設定は以下をご参照ください。
新規のWordPressサイト
既存のWordPressサイト

WordPressのサイトをカスタマイズしたり、オフラインで記事を書いて効率良くアップしていくには、ローカル環境の構築というものが必要なようです。よっしゃ、私もやってみよ〜っと。

WordPressの動作はApache(Webサーバ)PHP(サーバーサイドスクリプト)MySQL(データベース)で構成されており、ローカル環境の構築とは各サーバ要件を満たすローカルホスト(MANPやXAMPP)をPC上に設置することである。

あふん。。。この初見殺し。まず用語が全然理解できない。

ということで、私のように上記の日本語を理解できなかった人のために、各用語の説明と互いの関係性を簡単に示した上で、サーバ要件Webサイトの仕組みについてまとめました。

Webサイトの仕組みとサーバの構造

まずサーバという単語がいきなり難しく感じさせますが、こんな風に解釈してみましょう。

Serveは「(何か)を提供する」
Server(サーバ)は「(何か)を提供する人/もの」

Beer Server(ビールサーバ)はビールを出してくれるもの。Web上では「〜の役割を持つもの」と言い換えると何となく想像しやすいかと思います。

Webサービス構造を簡易図にしてみました。手書き。。。ある程度の関係性は理解できるかと思います。

Webブラウザとは

Webページを閲覧するときに使うソフトというところまではご存知かと思います。

Webサイトを表示する時、ブラウザはHTMLデータを取得して、それを整理・解析することで、ちゃんとした形でユーザの画面に表示してくれています。このとき欲しいデータとそれがサーバのどこにあるかを指定するのがURLです。ブラウザの動きをまとめると

  1. WebサーバにURLを通して欲しい情報をリクエスト。
  2. Webサーバから受け取ったHTMLデータを解析。
  3. 整理して画面にちゃんとした形で表示。(レンダリング)

Webサーバとは

WebサーバはブラウザがWebサイト表示に必要な素材を提供するところ。

「これ表示するのに必要なデータ全部ちょうだい」というリクエストに対し、「集めてきたよ〜」と必要なコンテンツを全部まとめて返してあげる。言わばブラウザからのお問合せ受付窓口だと認識してます。(私が。)

  1. ブラウザから送られてきたURLを受理して解読。何を準備してあげたらいいか答えを出します。
  2. 必要なものをデータベースに探しに行く。
  3. 必要なものが全部揃ったらまとめてブラウザに送ってあげる。

APサーバ(アプリケーションサーバ)とは

プログラムが置いてあり、またそのプログラムを実行させるところ。プログラム実行に必要な素材はデータベースからもらいます。

  1. Webサーバからプログラム実行の要求を受ける。
  2. プログラムを実行するのに必要な素材をデータベースに取りに行く。
  3. プログラムを実行し実行結果をWebサーバに送ってあげる。

WebサーバとAPサーバの関係

Webサーバは「動的な処理」をするという機能を持っていません。ブラウザからの要求に動的処理が含まれている場合は、APサーバにリクエストを送りプログラムを回してもらいます。

1. 静的なサイト

HTMLで書かれた内容をそのまま表示し、いつ誰が見ても同じものが表示されます。

決まったアニメーションを埋め込んでいるだけなら、それも静的なアニメーションということになります。

2. 動的なサイト

どんな内容にするか、その瞬間瞬間で内容を作り出す処理がされているもの。

例えば、会員制サービスなどでは同じURLでもマイページに表示される内容は人によって違います。掲示板に誰かが書き込むと都度表示内容は更新されますし、商品検索や並べ替えでもその都度表示される内容や順番は異なっていますよね。

繰返しになりますが、Webサーバはリクエストされたファイルを探して、ブラウザにレスポンスしてあげる役割を担っています。その中で動的処理が含まれているファイルについては、APサーバにお願いしてプログラム実行結果を入手しているわけです。

DBサーバ(データベースサーバ)とは

WebサーバやAPサーバの「あれちょうだい、これちょうだい」という要求に対しササっと取り出してくれるデータ保管庫です。検索すればすぐに見つかる、更新や削除にも対応できるなど徹底したデータ管理がここで行われています。

でっかい図書館に行って欲しいものがすぐ手に入るみたいな感じ。

WordPressに置き換えて整理してみよう

さて、ここで最初に戻ってみます。

WordPressの動作はApache(Webサーバ)、PHP(サーバーサイドスクリプト)、MySQL(データベース)で構成されており、ローカル環境の構築とは各サーバ要件を満たすローカルホスト(MANPやXAMPP)をPC上に設置することである。

前半の方は何となく理解できるようになったのではないでしょうか。

WordPressはPHPというプログラム言語で記述されており、WebサーバにはApacheを、データ管理システムにはMySQLを使用している。

ということですね。

サーバーサイド処理というのは簡単にいうとWebサーバからブラウザへ送られる前に既に処理が完了している(ここではAPサーバで処理したものをブラウザに送り出す)こと、そのサーバサイド内の処理に使われるプログラム言語をサーバーサイドスクリプトと呼びます。

それに対し、クライアントサイドスクリプトは、WebサーバからHTMLと一緒に送り出され、Webブラウザ上で実行(処理)する言語です。

本日の学習内容まとめ

  • Web表示(/動作)はブラウザとサーバでやり取りをした結果である。
  • サーバはWebサーバ(、APサーバ)、DBサーバで構成されている。
  • WordPressは上記それぞれにApache、PHP、MySQLを採用している。
  • Apacheは数あるWebサーバソフトの1つであり、PHPはプログラム言語の1つ、MySQLはデータ管理システムの1つ。)

今回説明したのはここまでです。

この辺まで理解できると、今後は以下の説明もスッと入ってくるはずです。

  • WordPressにおけるローカル環境設定とは、自分のPC上に各要件を満たすサーバをインストールし、それらが互いにリンクできるような環境を準備することである。
  • MAMPやXAMPPは上記を一括でインストールできるパッケージアプリである。

こうして丸1日つぶれました

色々と紐づけていきなり全てを理解しようとすると百科事典みたいになってしまうので、必要最小限の情報に絞ってまとめたつもりですがいかがでしたでしょうか。

手順書に従ってちんぷんかんぷんなままゴリ押しで進めていくのもアリなのですが、どうせいつかは勉強することになる(はず)なので、この際、理解しておくことにしました。

今回はこんなところでほなまた。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です