テレビ朝日メディアプレックス

BLOGブログ

PHPの開発環境にはXAMPP + NetBeansが快適すぎる!

どうも鈴木です。メディプレブログが始まり、鈴木の第一弾の記事は、僕が紆余曲折を経てたどり着いたPHPの開発環境について書きたいと思います。

 

皆さんはPHPの開発環境に何を使っていますか?テキストエディタ・IDE・ターミナルで直接編集等色々あるかと思いますが、ことPHPのデバッグに関して言えば、XAMPP+NetBeansの組み合わせは一つの有用な手法なのではないかと思っております。

 

開発中に、「この関数を入ってこの変数を返して~」というのを確認したりするのはよくあることですが、PHP開発の場合どうしてもechoやvar_dumpで変数の値等を出力かログ保存することが多々あります。しかし、いちいち変数の中身を確認する為にデバッグコードを入れこんだりするのは面倒だしコードを汚すし、さらに後で必要に応じてコメントアウトや消したりするのは、新たなバグを作ったり工数を増やす要因にもなっているのではないかと思います。

 

Windwosアプリ・iOSアプリ・Androidアプリの開発環境だと、それぞれVisualStudio・Xcode・AndroidStudio等の専属のIDEが用意されていて、標準でデバッグ環境まで用意されていますが、PHPの場合、これぞ標準!という開発環境はなく開発者が自由に選んでいるので、意外と本記事で説明するデバッグ手法を知らない人用に、順序立ててXAMPP+NetBeansを使ったデバッグ方法を記したいと思います。

 

本記事ではTestProjectというWebアプリがあるとして、既存ソースをローカルサーバー(http://local.testproject.com)でデバッグ実行するという内容となります。

 

①XAMPPとNetBeansのダウンロード

まずは、この記事の本題でもあるソフトのXAMPPとNetBeansをダウンロードしましょう。

xampp<https://www.apachefriends.org/jp/index.html>

※xamppは本番サーバーのPHPバージョンに合わせたものをダウンロードしましょう

18

 

NetBeans<https://netbeans.org/downloads/>

※NetBeansはPHPバンドルのものさえダウンロードすればよいでしょう

19

 

②ローカルサーバーで実行する準備

http://local.testproject.com でアクセスした時にローカルサーバーをアクセスする為にはhostsファイルを書き換えます。hostsファイルは

Windowsの場合、”C:\Windows\System32\drivers\etc\hosts”

にあります。このファイルは通常管理者にしか編集できないファイルなので、プロパティを開いてセキュリティタブから「アクセス許可」を「フルコントロール」にしましょう。

そして、hostsファイルに

127.0.0.1        local.testproject.com

 

というような書式で追加すると、ブラウザアクセスした時にローカルサーバーにアクセスするようになります。

 

次にApacheのバーチャルホストを有効にします

xampp\apache\conf\extra\httpd-vhosts.confの編集します。

local.testproject.comアクセス時に指定のパスをDocumentRootにするには以下のような記述にします。

 

<Directory "[ソースディレクトリのパス]">
    Options FollowSymLinks Includes ExecCGI
    AllowOverride All
    Require all granted
</Directory>
<VirtualHost *:80>
    DocumentRoot "[ソースディレクトリのパス]"
    ServerName local.testproject.com
</VirtualHost>

 

この状態でXAMPPのControl Panelを起動してApacheをStartしてみましょう。
図のように正常にStartできればApacheが緑に変化します。
04

 

Apache起動に成功したら、ブラウザからhttp://local.testproject.com にアクセスしてDocumentRootにあるファイルが表示すればローカルサーバーの設定は成功です。

③新規プロジェクトの作成

NetBeansは全てプロジェクト単位で作業していきます。まずはプロジェクトを作成します。

「ファイル」-「新規プロジェクト」を押下して、「既存のソースを使用するPHPアプリケーション」を選択して「次へ」を押下します。

71d4a418a399ede0713d0093d06975a9

 

ソース・フォルダで、プロジェクトのディレクトリのトップとなるところを指定します
そうすると、プロジェクト名もそのディレクトリ名が自動でセットされますが、変更することも出来ます。

「□NetBeansのメタデータを別のディレクトリに配置」のチェックボックスをONにすると、
NetBeans側で管理するプロジェクトの管理データを別のディレクトリに設置出来ます。
警告が出てきますが、今まであまり問題になったことはないので、ソース・フォルダに管理データを含めたくない場合はチェックをONにします。
cb322e137b87eb9a6ced2d3e8ab82219

 

「ローカルWebサイト」を選択して、プロジェクトURLに上述の開発サーバーのドメイン” http://local.testproject.com”を入力して終了を押下します。
02

 

これでプロジェクト作成は完了です。ソースコードの編集が出来るようになります。

20

 

④XAMPPの設定

php.iniを開いて以下の内容を追記します。

最低限これを書いておけば、ステップ実行出来ます。

[XDebug]
; xdebugライブラリのパス。php.ini内でextension_dirが設定してあるのでファイル名だけでいける
zend_extension=php_xdebug.dll
; xdebugの 1:有効化, 0:無効化
xdebug.remote_enable=1
; httpデバッグをするホスト 127.0.0.1でもよい
xdebug.remote_host=localhost
; デバッグ開始ポート 大抵は9000
xdebug.remote_port=9000
; NetBeansのサイトに書いてあったので記述(なくても動く)
xdebug.remote_handler=dbgp

追記が完了したらXAMPPのapacheを再びStartします。

 

⑤NetBeansの設定

デバッグ実行を開始する前に、デバッグ実行を開始するブラウザを選択しましょう。例えばChromeで確認したい場合は、ツールバーメニューのブラウザ選択からChromeを選択します。

browser

 

⑥ブレークポイントの設定

ブレークポイントを貼ってみます。

ブレークポイントを貼りたい場所で行番号をクリックすると、赤四角のマークが表示されます。

13

 

⑦デバッグ実行の開始

Ctrl+F5でデバッグ実行を開始出来ます。ツールバーのボタンからでも実行出来ます。

デバッグ実行が開始すると図のように現在の処理がブレークポイントを設定した行で止まります。変数パネルでこの時点での変数の中身を確認したり、呼び出しスタックパネルで呼び出し順番を確認したり、関数へのステップイン・ステップアウト等、現在の実行状況を色々な方法で見ることが出来ます。

09

※最初の行に止まるのはNetBeansのオプションで初期設定がそうなっている為です。NetBeansのオプションダイアログを開いて以下の赤枠のところを外せば最初の行で止まらなくなります。

11

 

⑧コマンドラインでのデバッグ実行も出来る!

コマンドラインでのデバッグ実行も可能です。以下のように、NetBeansのオプションから、コマンドライン実行に使うPHPの実行ファイルを指定します。xamppでインストールしたphp.exeを指定すれば準備は完了です。

12

プロジェクト・プロパティを開いて、新規を押下します。

任意の名前を入力してOKボタンを押下します。

16

実行方法にスクリプトを選択して、実行を開始したいphpファイルを選択します。

17

あとは同様にデバッグ開始ボタンを押下すると、コマンドライン実行の時もデバッグ実行が可能です。

 

NetBeansは、この他に気に入っている点として、

  • コーディング中のコード補完
  • オートフォーマットでコードを常にキレイに保てる
  • PHPだけでなく、html/css/javascriptエディタとしても優秀
  • git連携も強い
  • プロジェクト検索からの瞬間移動

などなど、便利な機能が盛りだくさんです。使いこなすと本当に強力なツールです。その辺りはまた別記事で紹介したいと思います。

まだ使ったことないPHP開発者は是非この機会に使ってみてはいかがでしょうか。

関連する記事

記事を書いた人

スズキ

好きなもの:GORIのハンバーグ、嫌いなもの:通勤
なるべく多くの言語を習得したいエンジニアです。