Home Xdebug, PhpStorm and MAMP – OSX – Setup Guide
Post
Cancel

Xdebug, PhpStorm and MAMP – OSX – Setup Guide

Very excited to present my own Setup Guide to get Xdebug, PhpStorm and MAMP to play nice together. Our goal here is to get remote debugging setup to be able to debug any line within a much bigger web app. In our case I am interested to debug WordPress Themes and Plugins without having to declare what file to start from.

YouTube Video Xdebug, PhpStorm and MAMP – OSX – Setup Guide

Two different types of Xdebug modes

  • Direct (via command line)
  • Remote (via browser)

I am no expert on this topic, so apologize my language. If anybody knows the proper terminology, please leave them in the comments and I am more than happy to change this. Essentially you can find two types of debugging. Direct one and remote. The first one essentially is essentially like running php from your command line using Xdebug. So you need to know exactly where to start and all files you want to debug need to be somehow connected (told you I am no expert on this…). The second method is the remote debugging where anywhere in you code you set a break point and essentially trigger the debugging remotely, in our case a browser. This is what we want 🙂

Here is how those two options look like in PhpStorm:

![Xdebug PhpStorm Direct vs Remote](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21411.png)
Xdebug PhpStorm Direct vs Remote

There are plenty of steps to do in order to get this to work. Here is the step by step list.

Note I will be doing most work from the terminal. You should be able to copy paste all commands.

Here is my setup for this Setup Guide

  • MAMP 2.2
  • PhpStorm 8.0.1
  • OSX 10.7

Xdebug Phpstrom Mamp Install Guide

1. Find Your PHP version in MAMP

![Find your PHP version in MAMP](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21431.png)
Find your PHP version in MAMP

2. Set your PHP version globally (optional)

Either create or open your .bash_profile file in ~/.bash_profile

Type: open ~/.bash_profile or if your .bash_proile doesn’t exist touch ~/.bash_profile; open ~/.bash_profile

enter the following at the bottom of your .bash_profile:

1
2
3
# MAMP PHP
export MAMP_PHP=/Applications/MAMP/bin/php/php5.5.3/bin
export PATH="$MAMP_PHP:$PATH"

Restart your terminal.

Check your php version with:

which php

or

php -v

![Check your PHP version in terminal](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21451.png)
Check your PHP version in terminal

source: http://stackoverflow.com/questions/4145667/how-to-override-the-path-of-php-to-use-the-mamp-path/10653443#10653443

3. Find your PHP ini file

Your php ini file will be in:

1
/Applications/MAMP/bin/php/php5.5.3/conf/php.ini
1
/Applications/MAMP/bin/php/YOUR_PHP_VERSION/conf/php.ini

If you setup you MAMP PHP globally you can also do:

php --ini

or

php -r 'phpinfo();' | grep 'php.ini'

and find your php.ini path. Couldn’t help myself but geek out. Sorry…

![Find your PHP ini file](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_2146-11.png)
Find your PHP ini file

4. Add the remote session parameters to php.ini

Open your php.ini file.

open /Applications/MAMP/bin/php/php5.5.3/conf/php.ini

Find the section Xdebug and uncomment (aka remove the semicolon) the zend_extension and add the following two options until your section looks like this:

1
2
3
4
[xdebug]
zend_extension="/Applications/MAMP/bin/php/php5.5.3/lib/php/extensions/no-debug-non-zts-20121212/xdebug.so"
xdebug.default_enable=1
xdebug.remote_enable=1

Your Xdebug section should be at bottom of your php.ini file.

Make sure you restart your MAMP server after editing your php.ini file, otherwise your settings wont apply.

5. Install browser extension

The title says it all:

https://chrome.google.com/webstore/detail/xdebug-helper/eadndfjplgieldjbigjakmdgkmoaaaoc?hl=en

6. Set PhpStorm IDE key

In your Xdebug Helper browser extension go to Options via chrome://extensions/. The Xdebug Helper should be at the bottom. Set the IDE key to PhpStorm.

![Xdebug Helper Options](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21481.png)
Xdebug Helper Options
![Xdebug Helper IDE key](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_2148-11.png)
Xdebug Helper IDE key

7. Start PhpStorm and setup project with localhost

Setup the project with PhpStorm. Make sure you set the correct project root and setup the localhost with the correct port.

![PhpStorm Project form existing files](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21521.png)
PhpStorm Project form existing files

In our case we will open project wp-test.

![PhpStorm setup Project](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21501.png)
PhpStorm setup Project
![PhpStorm add new local server](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21531.png)
PhpStorm add new local server
![PhpStorm setup local host](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_2153-11.png)
PhpStorm setup local host
![PhpStorm specify web path](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21551.png)
PhpStorm specify web path

8. Turn on Listening for Debug Connections

Turn on via: Go to Run -> Start Listening For PHP Debug Connections

![PhpStorm Listen Debug Connections](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21561.png)
PhpStorm Listen Debug Connections

9. Start debugging in browser

![Xdebug Helper start debug](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21571.png)
Xdebug Helper start debug

Switch the little to Debug.

10. Set breaking points

Finally… In PhpStorm just click into the line on the left.

![PhpStorm set break points](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_2157-11.png)
PhpStorm set break points

11. Refresh browser

12. Accept remote connection in PhpStrom

PhpStorm should recognize at this point the remote connection and ask you what you want to debug. Set your choice on your project root folder.

![PhpStorm remote connection Xdebug](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21581.png)
PhpStorm remote connection Xdebug

13. Fix mapping

![PhpStorm set mapping](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_22001.png)
PhpStorm set mapping
![PhpStorm fix mapping](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_21591.png)
PhpStorm fix mapping
![PhpStorm run debugger](https://schurpf.com/wp-content/uploads/2014/10/2014-10-29_22131.png)
PhpStorm run debugger

Check the debugger for the mapping error and untick the mapping. You can now run the debugger and it will stop at your breaking point.

Phew we are all set. If all is working for you, you should now be ready to use Xdebug, PhpStorm and MAMP. If you have any questions I will do my best to help. Please consider though that I have very little experience in this.

This post is licensed under CC BY 4.0 by the author.
Trending Tags