VSCode+XAMPP+XdebugでPHPの開発環境を作る

ひょんなところからPHPに触れる機会ができ、開発環境が必要になりまして
見様見真似で環境構築をしていましたが、パソコンを組み直したらすべて吹っ飛んでしまいました。

開発環境なんてそう何度も構築するわけではなく、やり方を忘れるため備忘録として残しておきます。

1 必要なもの
- 1.1 記事作成時のバージョン（2024年6月29日時点）
2 VSCodeをインストール
3 XAMPPをインストール
- 3.1 SQLite3を有効化する
4 Xdebugを設定する
5 VSCodeを設定する
6 VSCodeの拡張機能

必要なもの

Visual Studio Code（通称：VSCode）
コードエディタ、コレが無いと何も出来ない。
XAMPP
Apache（サーバーソフト）やMariaDB（MySQLの派生）などのソフトがパッケージになったソフト。
Xdebug
VSCodeの拡張機能と連動してデバッグを行うためのソフト（？）

記事作成時のバージョン（2024年6月29日時点）

Visual Studio Code　v1.90.2
XAMPP　v3.3.0
Xdebug　v3.3.2（v2系とv3系は設定が異なるらしいのでご注意を）

VSCodeをインストール

こちらは特に特筆するポイントは無くサクッとインストールまで済ませておきます。

左のテトリスみたいなマークを開いて、Japanで検索して日本語の言語パックを入れれば日本語化できます。
インストール済みなので、アンインストールボタンになっていますが、
未インストールであればインストールボタンになっているはず。

インストールが完了すると右下にメッセージが表示され、ソフトを再起動すると日本語化されます。

XAMPPをインストール

XAMPP公式から自身のOSにあった物をダウンロードします。

インストーラーを起動すると警告が出ます。

ユーザーアカウント制御が邪魔して機能に制限が掛かる恐れがあるので
有効な場合は【C:\ProgramFiles】にインストールしないで！

デフォルトの階層（C直下）にインストールすれば問題ありません。

警告を確認してOKを押すと普通にインストーラーが立ち上がります。

Nextで先に進み、インストールしたいアプリケーションを選択します。

Apacheは必須、MySQLを使用するのと、デバッグの際にMySQLの中身をGUIで確認したいのでphpMyAdminも選択します。

その他は使用予定が無いのでチェックを外しました。

インストール先はデフォルトのままにします。

言語設定がここに来たようなのでEnglishにしておきます。（以前はインストール後、初回起動時に選択だった）

準備完了、インストールするぞ！と来るのでNextでインストール開始。

インストールが始まります。

途中でセキュリティの警告が出るので許可します。

インストールが終わりました。

とりあえず動作確認をするためにチェックを付けたままFinishとします。

コントロールパネルが開かれるので、ApacheとMySQLをStartします。

MySQL起動時にネットワークの警告が再度表示されるので許可しておきます。

無事にサーバーが立ち上がりました。
緑色になったらOKです。

適当なブラウザを開いてURLに【localhost】と入れて開きます。
XAMPPのダッシュボードが開いたら動作確認完了です。

SQLite3を有効化する

お手軽データベースのSQLite3も使うには別途有効化が必要です。
SQLite3を使わない場合はこの項は読み飛ばしてOKです。

コントロールパネルのApache＜Config＜PHP（php.ini）と進みます。

php.iniがメモ帳で開かれるので、【;extension=sqlite3】を探してコメントアウト（;）を解除します。

Xdebugを設定する

次にVSCodeでデバッグが行えるようにしていきます。

Xdebugを使って、XAMPP上で動いているPHPとVScodeを連携できるようにします。

まずはPHP側にXdebugを仕込みます。

メモ帳に

PHP

<?php phpinfo(); ?>

を入力して【info.php】という名前で【C:\xampp\htdocs】内に保存します。

XAMPPでApacheが起動している状態で、【localhost/info.php】にアクセスします。
（MySQLの起動は不要）

Apache上で動いているPHPの情報が表示されるので、Ctrl+Aで全て選択してコピーします。

Xdebugのインストールウィザードを開きます。

テキストボックスに先ほどコピーしたPHPの情報を貼り付け、【Analyse my phpinfo() output】をクリックします。

あなたのバージョンはサポートしてるよ。みたいな画面が出てくるので
下の方にあるダウンロードリンクでdllファイルをダウンロードします。

手順のところに、
php_xdebug.dllにリネームして、【C:\xampp\php\ext】に保存せよとあるのでそのようにします。

php.iniを弄る必要があるため、一度ApacheをStopして、Configからphp.iniを開きます。

一番最後の行に

php.ini

[Xdebug]
zend_extension=xdebug
xdebug.mode=debug
xdebug.start_with_request=yes
;xdebug.log=php/tmp/xdebug.log

と入れてあげます。

それぞれの意味は

php.ini

[Xdebug]

後々何のコマンドか分かるようにするためのコメント。
入力しなくても支障ありません。

php.ini

以下のいずれか
zend_extension=xdebug
zend_extension=C:/xampp/php/ext/php_xdebug.dll
zend_extension=C:\xampp\php\ext\php_xdebug.dll
※フルパスを記載の場合はご自身の環境に合わせてください

拡張機能をロードするためのコマンド
コマンド：zend_extension=〇〇〇
ファイル名：php_〇〇〇.dll
に対応するためこのような書き方になっています。
パスで指定する事もできますが、フルパスじゃないとダメらしいです。
区切りはバックスラッシュ（円マーク）でもスラッシュでも大丈夫です。

php.ini