web制作のしおり

日々の学習をアウトプットします。

68.PHPを使ってみよう ~まずは環境を整える~

今日は初めて見る「PHP」についてやっていきます。

 

そもそもPHPって何?

プログラム言語の1つで、WordPressを作っている言語。

WordPressを扱うためにPHPの理解が必須ということです。

 

なぜWordPressを扱うのか…。

世界の3割のページはWordPressでできていると言う事実。

WordPressが扱えるようになることで出来る範囲がかなり広がる。

そのWordPressPHPでできているのだから、

学ぶメリットの大きい言語という事だそうです。

気合が入りますね。

 

では、本日もやっていきましょう。

 

まずは開発環境を整える

え、開発環境?VSCodeじゃないの?と思ったそこのあなた。

私も思いました。

どうやらPHPを処理する機能はブラウザに備わっていないそうなのです。

混乱しますよね。

 

HTMLとかCSSとかJavaScriptはブラウザが読み込んで、

いい感じに表示してくれていたのに。一体どういうこと何でしょう。

 

気になってしまったので、何故なのか調べてみました。

PHPはWebサーバーで動作するプログラミング言語

PHPはサーバーで動作して、クライアント側に結果を返す」

こんな感じの文言が見て取れました。

なるほど?

PHPはサーバーで動作して、ブラウザがわかる形のデータを投げてる。

ブラウザは、サーバー側で既に処理されたデータをもらって表示しているだけ。

だから、PHPファイルはブラウザでは直接表示できないと。

 

イメージがつかめてきましたね!

 

一旦まとめます。

  • PHPはサーバーで動くプログラミング言語
  • ブラウザではPHPファイルを処理できない
  • サーバーがPHPファイルを処理して、ブラウザ(クライアント)に投げている
  • ブラウザはあくまで処理された結果を表示している

こんな所でしょうか。

 

と、いうことで環境構築の話に戻ります。

(疑問解消に時間がかかりすぎた。)

 

ここまでのお話の流れで察しの良い方はわかったかもしれませんが、

環境構築が必要な理由はPHPをサーバーで動かしたいから」という推測ができます。

 

つまり、サーバー環境を自分で構築しましょう。という事です。

 

サーバー環境を構築しよう

ということで、サーバー環境を構築します。

とは言っても難しいことはなく、便利なツールが既に準備されているんですね。

素晴らしい世の中です。

MAMP

というツールで、開発者御用達のようです。

インストール方法や設定方法などは参考ページ様が山ほどありますので、譲ります。

また無料とPROがあるので、比較したい方は下記ページがおすすめです。

webrandum.net

 

私は、ひとまず無料版でインストールしました。

 

因みに、PHPファイルの拡張子は.phpです。

index.phpのように書きます。

 

PHPで文字を表示する

ここからはphpファイルに書き込んでいきます。

 

プログラミング言語なので、

当然作法があります。

JavaScriptの時のように、文字列を表示するにも

キチンとした書き方があるわけです。

 

<?php ?>

 

これが基本のタグ。タグ自身が混乱しているように見えるのは私だけでしょうか。

そして、文字列を表示するには

echo

というキーワードの後に、シングルorダブルクォーテーションで

表示したい文字列を囲い、セミコロンで閉じる。

具体的には

<?php echo 'Hello World'; ?>

こんな形です。

意味は、

タグの内部はphpで書かれています。

文字列を表示します。文字列はHello Worldです。

といったところでしょうか。

 

そして、この記述をさらにHTMLに埋め込んでみます。

 

<body>
  <h1><?php echo 'Hello World'; ?></h1>
</body>

 

このHTMLとPHPをindex.phpファイルに書き込んで保存します。

そして、MAMPで作ったローカルサーバー環境にindex.phpを配置し、

アクセスすると

 

Hello World

 

phpを囲んでいる「h1タグ」のデザインで強調表示されるのです。

これはサーバーで「文字列を表示する」の部分が処理されて、

h1タグの中にHello Worldが入った状態で、

ブラウザにデータが渡っているということですね。

 

試しにサーバーにアクセスせずに、index.phpを直接ブラウザで表示すると、

HTMLがテキストのまま表示されました。(headの部分とかもテキストで表示される)

 

動きは何となくわかってきましたが、いまいち使い所がわかりません。

これからの学習に期待です!

 

今日のまとめ

新しい言語なので、またゼロからスタートです。

気合を入れて進めていきますよ。

 

では、また。