Installing Xdebug on Scotch Box and integrating it with PhpStorm

This is a tutorial for installing Xdebug 2.4 on Scotch Box 2.5 and integrating it with PhpStorm (v2016).

1. Access the Scotch Box via SSH.

2. Run the command sudo apt-get update && sudo apt-get install php5-xdebug to install Xdebug, which is not installed by default in Scotch Box 2.5.

3. Open Xdebug configuration file with the command: sudo nano /etc/php5/apache2/conf.d/20-xdebug.ini

4. Save this file with the following content:

zend_extension=xdebug.so
xdebug.remote_enable=1
xdebug.remote_connect_back=1
xdebug.remote_port=9000
xdebug.remote_host=192.168.33.10

5. Restart Apache with the command: sudo service apache2 restart

6. Run the following command to verify that PHP is running with Xdebug: php --version

7. In PhpStorm’s top menu click Run >> Web Server Debug and Validation then fill in the following data:

Path to create validation script: (Path to the public folder of scotch box on your machine. For example: C:\ScotchBox\public\ )
Url to validation script: http://192.168.33.10/

8. Validate and check if it returns blue icons for all testing steps, like the image below.

9. Got to IDE settings through File >> Settings and navigate to Languages & Frameworks >> PHP >> Debug, then make sure the Xdebug port is set to “9000” and all boxes are checked.

10. In the IDE settings window, in Languages & Frameworks >> PHP >> Servers, click the “+” icon and setup the “Soctch Box” server:

Name: Soctch Box
Host: 192.168.33.10
Port: 80
Debugger: Xdebug
Check “Use path mappings”
And in the project file list, you map the local directory of the project to the Scotch Box directory: /var/www/public/your-project

11. Now open the run configurations from the PhpStorm’s top menu Run >> Edit Configurations. Click the “+” button to add a “PHP Web Application”. Give a name to it, select “Scotch Box” in the server list, set the Home URL and set the browser to be used for debugging the project. That browser will open the Home URL when you click the button “run” or “debug” in PhpStorm.

12. Okay, now your project is configured to perform debugging with Xdebug. Simply click Run >> Debug or use the shortcut buttons at the top of the IDE.