How to Set xdebug in Mac OS X with phpStorm and MAMP in 23 Easy Steps

How to Set xdebug in Mac OS X with phpStorm and MAMP in 23 Easy Steps

 

It’s amazing how spoiled we tend to get with products such as Xcode and Visual Studio.  I’ve gotten accustomed to debugging a web application by hitting F5 and off you go.  After the last hour or so of configuring phpStorm has taught me, setting up remote debugging can be a bit of a pain.

I’m going to document all I did because I’m bound to forget it all.  Here is my current setup:

I am assuming you have MAMP running and phpStorm installed.  I am also assuming you will be using Chrome.

  1. In you want to debug PHP using MAMP, you have to use PHP 5.2.17:PHP Version 5.2.17
  2. Open the PHP ini file for version 5.2.17, usually found under: /Applications/MAMP/bin/php/php5.2.17/conf/php.ini
  3. Look for the portion of the code that reads:[xdebug]
    ;zend_extension=”/Applications/MAMP/bin/php/php5.2.17/lib/php/extensions/no-debug-non-zts-20060613/xdebug.so” 
  4. Remove the ‘;’ before the zend_extension bit
  5. Append the following below that line:xdebug.remote_enable=true
    xdebug.remote_port=9000
    xdebug.profiler_enable=1
    xdebug.profiler_output_dir=”/Applications/MAMP/bin/php/php5.2.17/tmp>”
  6. Stop your MAMP server and restart it again
  7. To make sure xdebug is properly installed, from the MAMP App, select “Open start page”MAMP and How to Set xdebug in Mac OS X with phpStorm and MAMP 2
  8. When the page loads, click the phpInfo link in the toolbar:MAMP
  9. Scroll all the way to the bottom and find the section called Xdebug, the following should be listed:Xdebug installed on OS X
  10. At this point, xdebug is installed.  Now we must configure phpStorm to work with it.  Launch phpStorm, create/open the project you want to debug and from the File menu select Preferences.
  11. From the Project Settings section, click the PHP node:PHP Node in phpStorm
  12. Notice the right pane now allows you to select the PHP interpreter to use.  MAMP ships with various versions of PHP, but we need to set this one to use 5.2.17 if we want to to debug.  Click the Ellipsis button, create a new configuration by clicking the ‘+’ and selecting “Specify Other”Interpreters and Settings
  13. Name the configuration PHP 5.2.17 and specify as the PHP home the following path:/Applications/MAMP/bin/php/php5.2.17/bin
  14. phpStorm will now recognize the interpreter and display the version:Interpreters
  15. From phpStorm, select from the Run menu Edit Configurations
  16. Click the ‘+’ sign and select PHP Web Application
  17. Fill out the values to your corresponding development environment, here is mine as a guide (make sure to select Chrome as your browser)Run Debug Configurations
  18. Almost there!  To make life easier when hooking up the debugging session with Chrome, we need to install an extension that will make life easier, the Xdebug helper extension.
  19. Once installed, open the web page you would like to debug in Chrome
  20. Now it’s time to test debugging!   Set up a breakpoint somewhere in your code that will be hit when the web app runs.
  21. From the Run menu, select Debug [Name of your Project]
  22. Chrome will open the web application, you will notice that your URL has a debugging portion added to the URL:Untitled
  23. Back in phpStorm, your breakpoint will be hit and now you can debug!Ortodonciacr functions php ortodonciacr Copy Documents ingenium Sites ortodonciacr

 

If you have questions or comments, please post below, I’ll leave this thread open for a while.

Sources:

Leave a Reply