Why study PHP? 何故PHPなのか その2

まずは前回の復習 (Internet上のページがどのようにつくられているか、門外漢向けの説明、と同時に自分が理解したと思った内容の復習です)

  1. Internet のWeb home  Page上の情報 は HTMLという言語で記述されている。
  2. 表示の加飾方法(内容ではなく)についてはCSSというファイルに記述され、これがHTMLを記述したファイルから参照されている。
  3. これをブラウザが読み込んで人間たちが読めるように表示する。
  4. HTMLとCSSで構成されたweb Pageは静的なページで閲覧者のアクションに対して動的なページにするにはスクリプト言語を追加する必要がある。
  5. スクリプトにはブラウザー側で動くスクリプトとサーバー側で動くスクリプトがある。

 

と言うところまで説明しました。 今日はここから

ここで言っているサーバーの意味を簡単に言うと世界のどこかにある、Internetでホームページを発信しているコンピューターのこと。 スクリプトがサーバーで実行される場合は、閲覧者のコンピューターに届くときにはごく普通のHTMLファイルになっています。 ブラウザーからはサーバー側でどのような作業がされたのかを見ることはできません。 これの代表的な言語がPHPです。(マイクロソフトのExpress WebやVisual StudioでWebアプリケーションを作っている場合はNET.ASPという言語がサーバー側で動き、アプリケーション(aspxファイル)を処理してhtmlとCSS、VBscriptなどに吐き出してブラウザー側に送っています。)

Client 側とは 閲覧者が使っているブラウザーです。 ブラウザー側で動くスクリプトはHTMLに”このスクリプトを使ってね“という記述があって、 それをブラウザーが実行します。代表的なスクリプト言語にはJavaScriptがあります。VBScriptなどもそうです。 JavaScriptを使うと、dropdownやflyoutのメニューなどや、単語にカーソルを当てると、それに対応したイメージを表示させるような仕組み、フェードイン、フェードアウトのようなアニメーションをページに組み込むことができます。すなわちスクリプトの内容もブラウザー側に送られてきます。 ちなみにこのスクリプトの内容はIE8のような新しいブラウザーでは開発モードにすると(F12を押す)見ることができます。

Server side Scripting, Client side Scripting, それぞれ得手不得手があるので同じページに両方使うことも普通に行われます。

Server side scripting はサーバーがPHPやASP.netなどの環境をサポートしている必要があります。 有料のプロバイダーはほとんどの場合PHPをサポートしていますが、 無料サービスのホストの中にはサポートしていないこともあり、 そのようなHostを使っているときには、プロバイダーが用意したページ作成ソフトで画面を作るか、 HTML,CSS, JavaScriptの三種の神器のみでページ作成に取り組むことになります。

ここで自分がどうしてこのような事に興味を持ったのか、その理由を書いておきます。

インターネットサービスのプロバイダーと契約をしたときに、メールアカウントの他に、HomePageのスペースも頂きました。 15年も前の話です。 当時はwindows 95にFrontpage Expressというhome page 作成用のツールがついてきましたが、 今にして思うと、これは簡単なHTML生成のソフトでした。  このツールだけでも当時としてはそれなりのページが作れましたのでなんとなく満足していましたが、そのうちプロバイダーがWebPageBuilderというブラウザ上で簡単にhomepageを作れるツールを提供するようになりました。 これはテーマを選ぶと、それなりのページが作れ、メニューも自動生成される、というものでした。 それからというもの、内容の編集はすべてWEB上のツールで行いました。 しかし、それだとどうしても出来るページ、構成は定型なものになってしまいます。

私の場合、最初はHTMLだけで簡単なhomepageを作っていました。 そのうち、他の方たちのページを見て、見出し部分がしっかりトップにあり、メニューが左側に配置され、 その右側に本文が並べられているような作りはどうやって実現するのだろうと興味を覚えCSSを覚えることになりました。

さらに簡単なアニメーションとかも入れたくてJavaScriptも少し勉強しました。 JavaScriptの場合、Internetに色々なコードが開示されていたり、さらにJQuery というswiss army knifeのようなツールがあって、 かなり高度なこともそれほど深い知識が無くてもホームページ上で使えるようになります。

これだけでわりと「らしい」ページを作れるようになったのですが その次に困ったのが「すべてのページ共通な部分をいちいち コピーペーストで複製していかなくてはいけない」 ということでした。

特にメニュー関係の項目は メニューを増やすごとにすべてのページを編集しなければなりません。 これはもっと良い方法があるはずだ、と思ったのです。

調べてみると、サーバーサイドインクルード(SSI)という仕組みがあって、HTMLの記述に 「このファイルを含むのよ」 と書き込んで 別ファイルにメニューの記述を書いておけばこの別ファイルを変更するだけで このファイルを参照しているすべてのHTMLページに反映される、ということができるらしい、という事がわかりました。 ただし、この機能はサーバーがサポートしている必要があります。 

SSIと同じことは PHPでもできます。同じ事はJavaScriptでも出来るのですが、 PHPでは 一行のコード  ですむところをJavaScriptではそれなりのコーディングが必要になります。 なぜかというと、 PHPの場合はサーバー側で処理を行い、 ブラウザーが受け取るHTMLは既にインクルードされるべき内容が反映されたものになっていますが、JavaScriptで行う場合はまずはJavaScriptを含んだHTMLをブラウザ側で読み込み、次にJavaScriptの指示に従って、インクルードするべき内容をサーバーに取りに行き、これをHTML内部に埋め込むという作業を行った後で、整形されたHTMLをブラウザーが再度表示する、というような作業を行うからです。 JavaScriptでやるのはスマートではないなあ、と思い、PHPに興味が沸きました。 

一昔前のWebの教科書を見ると、Server Side Scripting はPerlという言語を使っています。 PHPというのはここ10年ほどで急速に認められてきた言語体系のようです。

さらに調べてみると、 WordPress ,Drupal, Joomla!など今話題のWebコンテントのマネージメントツールや、facebook,WikipediaなどのWeb serviceは皆PHPを使って作成されているようです。  これはかじってみるしかありますまい。 と思うに至り PHPの勉強をすることにした次第。

ModXのテンプレート変数(Template Variable, or TV)のすごさが判ってきた

 

とにかく実際に試してみる、とういのが物事なんでも大事なようで、オンラインのチュートリアルでわかったようなつもりになっていても、 実際に経験してみてその効果が実感できるということがよくわかったのが、このModXのTVの使い方

その1: 新しいページを作成してそこに表示するメニューをまったく別の親からはじめようと思ったのだが、メニュー部分はテンプレートに入っている。 テンプレートに新規のものを指定することももちろん出来るわけだが、今回はメニュー用Snippetのwayfinder のstartidの指定部分を`20`という固定から menurootというTVを作って`*menuroot`という変数指定とし、default値を20とすることで、従来のページには影響を与えず、新規のページについては何もしなければデフォルトのメニューを表示、メニューの表示を違う親から始めたければTVの値を指定できるようにして解決。

その2: その新しいページの固定幅を広くしたい必要が生じた。 CSSには .wrapper { width:750px; .. というクラスで指定してあるのだが、 新しく .wrapperWide{ width:1000x;   というクラスを指定し、 テンプレート上の

<div class=”wrapper”…  という部分を <div class=”wrapper[[*narrowOrWide]]….   として narrowOrWide というTVを追加する。   narrowOrWide のデフォルト値は空白なので、 従来のページはそのまま。 新しいページのnarrowOrWideのTV値を”Wide” とすることで解決。 

システムの仕組み上そうなるのが当たり前なのだが、 ページがうまく表示されたときには感動した。