WordPressify comes with Xdebug preconfigured so that you can easily debug, profile, and trace your application. The following is a description of how to setup Xdebug with WordPressify. If you’re on Linux, be sure to check the Xdebug on the Linux section below.
Install the Xdebug extension for Chrome, FireFox or Safari.
After installing the extension and running WordPressify, you can start profiling and tracing WordPress by simply selecting the proper option in the extension. Profiling information can be displayed using one of the cachegrind tools as described in Xdebug documentation. The profile and trace data will be logged in the xdebug folder.
If you want to do step debugging, you need to setup your IDE accordingly. Make sure to setup your IDE to listen on port 9003 for Xdebug connections. There are plugins for VS Code, PHPStorm, and other IDEs listed here.
After setting up your IDE, select Debug in the Xdebug extension and reload the page.
After setting up your IDE, select Debug in the Xdebug extension and reload the page.
Make sure that the containers are running:
npm run env:start
Find the host ip that docker sees by connecting to the WordPressify website from your web browser, and then inspecting nginx logs:
docker-compose logs server
The first field will be your host IP address. Copy that host address and paste it inside config/php.ini as the value for xdebug.remote_host.
npm run env:restart
Xdebug should be working now.