If you haven’t already installed PhpStorm, you can find a free, fully functional 30 day trial for either Macintosh or Windows from their website at http://www.jetbrains.com/phpstorm/. The installer is typical and straight forward. Simply install using the defaults. To work with DesktopServer, make sure you have checked the ‘Enable debug services’ check box in DesktopServer. You can find this setting in DesktopServer’s first main menu option ‘Stop or restart…’. Be sure to select the ‘Restart’ option followed by clicking the ‘Next’ button.
Create New Project from Existing Files
If you haven’t already created a DesktopServer website, take a moment to try the simple www.example.dev website as outlined in “Getting Started with DesktopServer”, steps 1 to 10. Adding your existing website to PhpStorm requires a few extra steps. From PhpStorm’s main dialog, select the option to “Create New Project from Existing Files”.
DesktopServer will personalize your website project with its own isolated, unique domain name in addition to its own document root. Therefore, when PhpStorm prompts you to “Choose Your Scenario”, simply select the first option titled, “Web server is installed locally, source files are located under its document root”.
PhpStorm will then prompt you to “Choose Project Directory”. This will be your website’s site root folder. By default, DesktopServer creates your site root as a folder with the same name as your website’s domain name and as a sub-folder at ./Documents/Websites. Select the folder and click the “Next” button to continue. For our www.example.dev website, we’ve selected the ./Documents/Websites/www.example.dev folder.
Next, PhpStorm will ask you to “Add Local Server”. You will want to fill out the name field (we use the website’s domain), i.e. www.example.dev. Then fill out the personalized “Web server root URL” field as it was created in DesktopServer, i.e. http://www.example.dev. Note that DesktopServer distinguishes between a www and no-www websites. Make sure that the URL matches that domain name you created in DesktopServer. Click the “Next” button to continue.
Important! PhpStorm will prompt you to “Specify a Web Path”. Leave this field blank, but be sure to click the checkbox option to “Review PHP Settings”. This is important as we’ll need to modify include paths to allow DesktopServer to work with PhpStorm correctly. Currently, DesktopServer does not support PHPUnit. We will update PEAR and provide PHPUnit support in a subsequent version. For now, simply click the “Next” button to review and modify the PHP configuration to work with DesktopServer and your WordPress development website.
If you are on Windows, remove the ‘PEAR’ part and make sure that the include path c:\xampplite\php is present. If you are on Macintosh, remove the /lib/php/pear and ensure that the path to /Applications/XAMPP/xamppfiles/etc is present.
DesktopServer is designed with specifications that matches most modern hosting providers to make deploying your WordPress website less complicated. WordPress requires a minimum of PHP 5.2.4, but most hosts use PHP 5.3. Be sure to set PhpStorm’s language level to 5.3 as its default is 5.4. Use Ctrl+Alt+S on Windows or Command+, on Macintosh to bring up the PhpStorm Settings panel and select “PHP” in the settings list. Use the drop down combo box for “PHP language level” to set the value to 5.3.
Debugging WordPress in PhpStorm
PhpStorm’s web debugging is a bit awkward [for the first time]… Despite this clumsy process, the user interface for debugging is significantly faster than Netbeans and well worth the initial burden.
Starting PhpStorm’s web debugging is a bit awkward and somewhat cumbersome when you use it for the first time in a given project. It departs from traditional IDEs that feature start and stop buttons that automatically open your web browser to kick off a debug process. While PhpStorm has a start (green ‘play’ icon) button for console and linear web applications, it is awkward when using XDebug and WordPress; especially when dealing with permalink structures. Instead, you can ignore those buttons and click the “Start Listen PHP Debug Connections” button on the toolbar (that looks like an old telephone handset) followed by opening your web browser and entering a special URL argument (which you can later bookmark). But before you can use debugging for the first time, you will need to let the file indexing process complete. Like Netbeans and other modern IDEs, PhpStorm pre-indexes your project files for faster editing and search functionality. You will also have to answer a security dialog with an ‘Accept’ button to authorize the XDebug connection. Thankfully, initial indexing is a one time process required before the debug button is enabled on the toolbar. The ‘Accept’ debug authorization dialog is also remembered for your convenience. When you first create your project from existing source files, PhpStorm will automatically start indexing all of your files. If indexing doesn’t start automatically (and it failed for me on both Mac and Windows on more then one occasion), you’ll simply need to close PhpStorm and re-open your project. Despite this clumsy process, the user interface for debugging is significantly faster than Netbeans and well worth the minor, initial burden.
The “Start Listen PHP Debug Connections” button will have a little telephone headset icon that should turn from red to green when clicked and enabled. You can then open one of your source code files that you would like to begin debugging or editing. In our example below, I have opened the index.php file from WordPress’ default twentyeleven theme and placed a breakpoint on the source code line “get_header();”. To kick off the debug process, simply open your favorite web browser and enter the URL of your development website followed by the debug parameter “XDEBUG_SESSION_START”. For instance, to start debugging our example website’s home page, type http://www.example.dev/?XDEBUG_SESSION_START on the URL address bar and press enter.
Regardless of the initial less than intuitive web debugging process, PhpStorm appears to match NetBeans in several key debug features and goes beyond with a more responsive and snappy feel. Performance is definitely kicked up a notch and key features like floating variable hints “just work”. This useful and touted NetBeans feature has never worked right in Netbeans and is currently broken in version 7. But it works really well in PhpStorm. In addition, the variable watch window and inspectors appear to be more consistent while stepping through code and refreshes are considerably faster than Netbeans. PhpStorm appears to also match Netbeans on a feature by feature basis with almost identical popup context menus for code navigation abilities like “Find Declaration”, ”Find Usages”, and included built-in difference tools. In fact, checking out the overview of features in the my “Using Netbeans for WordPress…” post easily matches PhpStorm in almost every aspect, but with the polish you’d expect from a paid commercial product. Give it try; it might just be the productivity boost you’ve been looking for in a dedicated PHP editor.