PHPを勉強する際に必要となるのが、PHP開発環境です。HTMLやCSS、クライアントサイドのJavascriptはローカル環境でも動かすことはできますが、サーバーサイドのPHPはサーバー環境を準備しなければ動かすことはできません。サーバー環境とは、最低でも、Apache(Webサーバ)、MySQL(SQLデータベース)が必要となりますが、この3つのソフトウェアをそれぞれ個別にダウンロード・インストールするのは大変です。そこで役に立つのが「XAMPP(ザンプ)」です。XAMPPは、webアプリケーション開発のためのテスト環境を整えるために必要なアプリケーション一式をパッケージにしたものです。無料で使うことができ、PHPの実行に必要なローカルサーバーのApache、データベースのMariaDB、そして、PHPの本体がパッケージになった最も人気のApacheディストリビューションです。
名前の由来はそれぞれの頭文字を取ってXAMPP(Apache、MariaDB、PHP)。XはクロスプラットフォームのX、最後のPはPerlのPです。
X – Windows、Linux、Mac OS X、Solarisのクロスプラットフォーム
A – Apache
M – MySQL(MariaDB)
P – PHP
P – Perl
XAMPPのインストール
XAMPPのダウンロード
XAMPPの公式サイトよりダウンロードします。
![xamppダウンロードの公式サイト](https://gungii.com/wp/wp-content/uploads/2020/02/xampp01a.jpg)
XAMPPのインストール
インストーラーの起動
「xampp-windows-x63-9.4.1-VC15-installer.exe」をダブルクリックして起動します
注意:
「XAMPPをCドライブのProgramFilesの中にインストールしようとすると、ユーザーアカウントコントロールによってうまく動作しなくなってしまうので、それ以外のフォルダにインストールするか?もしくは、このUACをセットアップしてください。」という警告メッセージが表示されますが、そのままOKを押します。(デフォルトがProgramFiles以外のフォルダとなっていますので、そのままでOKです。)
![押下されたxamppのインストールexe](https://gungii.com/wp/wp-content/uploads/2020/02/xampp02a.jpg)
インストールするモジュールの選択
ここではPHPを勉強する上で不要なモジュールを削除します。
![インストールするモジュールの選択画面](https://gungii.com/wp/wp-content/uploads/2020/02/xampp03a.jpg)
※FTPサーバーであるFILEZilla、メールサーバーであるMercury、JavaのモジュールであるTomcat等を削除します。
インストールフォルダの選択
警告メッセージのProgramFiles以外のデフォルトのxamppフォルダにインストールしますので、そのままNEXT>をクリックします。
![インストールフォルダの選択画面](https://gungii.com/wp/wp-content/uploads/2020/02/xampp04a.jpg)
インストール開始
![インストールを開始した画面](https://gungii.com/wp/wp-content/uploads/2020/02/xampp05a.jpg)
インストールの完了
Finishをクリックして、言語(アメリカ)を選択して「Save」をクリックします。
![インストールが完了した画面](https://gungii.com/wp/wp-content/uploads/2020/02/xampp06a.jpg)
XAMPPのコントロールパネルが起動すれば、OKです。
![起動したxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp07a.jpg)
XAMPPの設定
ポート番号の変更
XAMPPの起動
![xamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp11a.jpg)
Configをクリック
Configをクリックして、「Service and PortSetting」をクリックします。
![「Service and PortSetting」を選択したconfigメニュー](https://gungii.com/wp/wp-content/uploads/2020/02/xampp12a.jpg)
ポート番号変更
ポート番号が80となっているところを、今回は8888に変更して、Saveをクリック
![ポート番号の変更画面](https://gungii.com/wp/wp-content/uploads/2020/02/xampp13a.jpg)
設定の変更
ポート番号の書き換え
ポート番号は、設定ファイルhttpd.confの中でも指定されていますので、httpd.confを書き換えます。
①httpd.confの選択
ApacheのConfigをクリックして、httpd.confを選択します。
![httpd.confを選択したconfigメニュー](https://gungii.com/wp/wp-content/uploads/2020/02/xampp14a.jpg)
②メモ帳の起動
メモ帳が起動しますので、httpd.confのポート番号の記載を変更します。
![起動されたhttpd.confのメモ帳](https://gungii.com/wp/wp-content/uploads/2020/02/xampp15a.jpg)
③ポート番号書き換え
#はコメントなので、変更の必要はありません。
![ポート番号を書き換えたhttpd.conf](https://gungii.com/wp/wp-content/uploads/2020/02/xampp16a.jpg)
④上書き保存
ポート番号の書き換えが終わりましたら、ファイルがから上書き保存して、メモ帳を閉じます。
![上書き保存したメモ帳](https://gungii.com/wp/wp-content/uploads/2020/02/xampp17a.jpg)
時刻の設定
世界標準時から、日本は9時間ずれていますので、タイムゾーンを日本として設定します。タイムゾーンは、日本の場合、以下の通りAsia/Tokyoとなります。(デフォルトではヨーロッパとなっています。)
タイムゾーンの指定方法は、以下で検索します。
![phpタイムソーンリスト](https://gungii.com/wp/wp-content/uploads/2020/02/xampp18a.jpg)
①php.iniの選択
ApacheのConfigをクリックして、php.iniを選択します。
![PHP(php.ini)が選択されたconfigメニュー](https://gungii.com/wp/wp-content/uploads/2020/02/xampp19a.jpg)
②メモ帳の起動
![起動されたphp.iniのメモ帳](https://gungii.com/wp/wp-content/uploads/2020/02/xampp20a.jpg)
③タイムゾーンの変更
timezoneをAsia/Tokyoに書き換えます。
![タイムゾーンを変更したphp.ini](https://gungii.com/wp/wp-content/uploads/2020/02/xampp21a.jpg)
設定の確認
XAMPPの起動
![xamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp22a.jpg)
Apacheの起動
ApacheのStartをクリックすると、Port(s)が8888と変わっている事がわかります。
![Apacheを起動したxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp23a.jpg)
Adminのクリック
Appachの右の「Admin」をクリックすると、以下のWebページが開きます。これにより、Xamppに搭載されているAppacheがWEBサーバーとなり、このページを配信していることが確認できます。
![Adminを選択して起動したWebページ](https://gungii.com/wp/wp-content/uploads/2020/02/xampp24a.jpg)
XAMPPの使い方
XAMPPの起動
XAMPPのコントロールパネルを起動します。
![xamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp31a.jpg)
XAMPPの停止
XAMPPの停止は、「Quit」をクリックします。
![Quitを選択したxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp32a.jpg)
注意:
右上の×をクリックすると画面は閉じますが、コントロールパネルは終了していません。この状態で、XAMPPを起動すると二重起動となり、正常に起動しなくなりますので、必ず「Quit」で終了して下さい。
アプリケーションの起動
Apacheの起動
①Startボタンのクリック
Apacheの行の「Start」ボタンをクリックします。
![Apacheのstartを押下したxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp33a.jpg)
②Apache起動
Moduleの背景が緑色になれば正しく動作しています。
![Apacheの文字の背景が緑となったxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp34a.jpg)
MySQLの起動
①Startボタンのクリック
MySQLの行の「Start」ボタンをクリックします。
![MySQLのstartが押下されたxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp35a.jpg)
②MySQL起動
![MySQLの文字の背景が緑となったxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp36a.jpg)
アプリケーションの停止
コントロールパネルの各アプリケーションのActionsのボタンで、起動と停止ができます。
![起動と停止の説明の為に表示したxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp37a.jpg)
MySQLの停止
MySQLの行の「Stop」ボタンをクリックすると、Actionsのボタンが「Start」に変わりMySQLが停止します。
![MySQLを停止したxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp38a.jpg)
Apacheの停止
![Apacheを停止したxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp39a.jpg)
PHPを動かす
hellow.phpの格納
hellow.php(サンプルプログラム)をテキストエディターで作成して、htdocsの配下のphpフォルダに格納します。
Explorerのクリック
XAMPPを起動して、Explorerをクリックします。
![Explorerメニューを選択したxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp41a.jpg)
htdocsをクリック
![htdocsをクリックして表示されたhtdocsのファイル一覧](https://gungii.com/wp/wp-content/uploads/2020/02/xampp42a.jpg)
「新しいフォルダ」の作成
htdocsの中に新しく「php」というフォルダを作成する。
![](https://gungii.com/wp/wp-content/uploads/2020/02/xampp43.jpg)
phpプログラムの格納
htdocs>phpフォルダの中に、hellow.phpを格納します。
![htdocsに格納したhellow.phpのソースコード](https://gungii.com/wp/wp-content/uploads/2020/02/xampp44a.jpg)
hellow.phpを動かす。
Apacheの起動
XAMPPを起動して、Apacheを起動します。
![Apacheが起動したxamppのコントロールパネル](https://gungii.com/wp/wp-content/uploads/2020/02/xampp45a.jpg)
Chromeを起動
Chromeを起動して、URL(http://localhost:8888/php/hellow.php)を入力すると、hellow.phpが動きます。
![hellow.phpが起動して「Hello World!」と表示されたWebページ](https://gungii.com/wp/wp-content/uploads/2020/02/xampp46a.jpg)