Set up your PhpStorm project

DevBox is currently undergoing an update and is not available for download. A new version will be available in the near future. Please check back for updates.

This topic discusses how to set up a PhpStorm project to work with Magento DevBox.

PhpStorm notes:

  • The instructions in this topic are based on PhpStorm version 2016.3.2. If you use a different version, some steps might be different. Consult your PhpStorm documentation for details.
  • PhpStorm has a commonly used window that has a different name in Windows and Mac OS:

    • Windows: The window is named Settings and you access it by clicking File > Settings.
    • Mac OS: The window is named Preferences and you access it by clicking PhpStorm > Preferences.

If you have already set up a PhpStorm project, you can skip this topic and continue with:

Prerequisites

Before you continue, complete the tasks discussed in PhpStorm prerequisites.

Set up your PhpStorm project

This section discusses how to set up a new PhpStorm project to work with Magento DevBox.

Create the project from existing files

To set up a new PhpStorm project to work with Magento DevBox:

  1. Start PhpStorm.
  2. Click File > New Project from Existing Files.

    The Create New Project: Choose Your Scenario dialog box is displayed as follows.

    Create a new PhpStorm project from existing files

  3. Click Source files are in a local directory, no Web server is yet configured and click Next.

    For a description of other options, consult the PhpStorm documentation.

  4. In the Create New Project: Choose Project Directory dialog box, browse to locate the <DevBox root folder>/shared/webroot/pub folder.

    Sample path on Windows: C:\magento\build-18c4e4d3c5a541f37e9cffd35f1bf74e\build-18c4e4d3c5a541f37e9cffd35f1bf74e\shared\webroot\pub

    Sample path on Mac OS: /Users/me/build-18c4e4d3c5a541f37e9cffd35f1bf74e/shared/webroot/pub

    The following figure shows an example.

    Locate your project root directory

  5. Click Project Root and click Finish.
  6. Wait while PhpStorm indexes the project.

Add a remote PHP CLI interpreter

This section discusses how to add a remote PHP 7 CLI interpreter.

  1. In your PhpStorm Settings window, do one of the following:

    • Mac OS: Click PhpStorm > Preferences.
    • Windows: Click File > Settings.
  2. In the left pane of the Preferences (Mac OS) or Settings (Windows) window, click Languages & Frameworks > PHP.
  3. From the PHP Language Level list, click PHP 7.
  4. Click Add an interpreter next to the CLI Interpreter list.

    The CLI Interpreters window is displayed.

  5. Click New interpreter (Add).
  6. From the Select Interpreter Path list, click Remote as the following figure shows.

    Add a remote PHP interpreter

  7. In the Configure Remote Interpreter dialog box, click SSH Credentials as the following figure shows.

    Set up a remote interpreter using SSH credentials

  8. Enter the following information:

    • Host: Enter 127.0.0.1
    • Port: Enter the web container’s SSH listen port.
    • Username: Enter magento2
    • Password: Leave blank
    • Save password: Select the check box
    • PHP executable: Enter /usr/local/bin/php
  9. In the Configure Remote PHP Interpreter dialog box, click OK.

    If the connection is successful, a confirmation dialog box similar to the following is displayed:

    Confirmation dialog box

    If an error displays, review the preceding information, make sure you know the correct SSH listen port, and try again.

  10. Follow the prompts on your screen to save your changes.

Create the Xdebug remote host

Adding an Xdebug remote host makes debugging easier because it happens automatically every time you start the DevBox container.

To create the Xdebug remote host:

  1. In your CLI Interpreters dialog box, in the General section, click Refresh as the following figure shows.

    Refresh the Xdebug version

  2. In the Additional section, click Add configuration options next to the Configuration options field as the following figure shows.

    Add the Xdebug interpreter

  3. In the Configuration Options dialog box, click New interpreter (Add).
  4. Enter the following information:

    • Configuration Directive field: Enter xdebug.remote_host
    • Value field: Enter 127.0.0.1
  5. In the Configuration Options dialog box, click OK.

    Make sure the option and value display as follows.

    xdebug option

  6. If the name and value are displayed, click OK.

If both name and value do not display, click Refresh in the General section and try again.

Add path mappings

Because Magento uses symlinks, you must create path mappings so PhpStorm can properly locate files.

To add path mappings:

  1. In your PhpStorm Settings window, click Languages & Frameworks > PHP.
  2. In the right pane, from the CLI Interpreter list, click the name of the DevBox remote CLI interpreter.
  3. In the right pane, next to the Path Mappings field, click Add path mappings.

    The following figure shows an example.

    Add CLI interpreter path mappings

    The Edit Project Path Mappings dialog box is displayed.

  4. In the Edit Project Path Mappings dialog box, click Add path mappings (Add).
  5. In the Local Path row, click Browse (Browse) to locate your DevBox project root directory and click Open.
  6. In the Remote Path field, enter /var/www/magento2

    The following figure shows an example.

    Creating a path mapping

  7. In the Edit Project Path Mappings dialog box, click OK.

Set up PHPUnit

To set up PHPUnit:

  1. In your PhpStorm Settings window, expand Languages & Frameworks > PHP > PHPUnit.
  2. In the right pane, click Use Composer autoloader as the following figure shows.

    Set up PHPUnit

  3. In the Path to script field, click Edit the interpreter (Browse).
  4. Browse to locate <PhpStorm project root>/vendor/autoload.php

    Sample path on Mac: /Users/me/Downloads/build-18c4e4d3c5a541f37e9cffd35f1bf74e/shared/webroot/vendor

    Sample path on Windows: C:\magento\build-18c4e4d3c5a541f37e9cffd35f1bf74e\build-18c4e4d3c5a541f37e9cffd35f1bf74e\shared\webroot\vendor

  5. Click Open.
  6. In the Preferences window, click OK.

Set up PHPUnit to use the remote CLI interpreter

  1. In your PhpStorm Settings window, expand Languages & Frameworks > PHP > PHPUnit.
  2. In the center pane, click Add an interpreter (Add).
  3. From the list, click By remote interpreter as the following figure shows.

    Add a remote interpreter

  4. From the Interpreter list, click the name of the DevBox remote CLI interpreter.
  5. Click OK as the following figure shows.

    Save your changes

  6. In the Settings window, click OK.

Set up a PHP server

To set up a PHP server for debugging:

  1. In your PhpStorm Settings window, click Languages & Frameworks > PHP > Servers.
  2. In the center pane, click New PHP server (Add).

    The following figure shows an example.

    Set up a new PHP server

  3. Enter the following information:

    • Name: Enter a name to identify your server
    • Host: 127.0.0.1
    • Port: Enter the SSH listen port
    • Select the Use path mappings check box.
    • Debugger: Click Xdebug
  4. Specify path mappings:

    • In the File/Directory column, make sure your project root is selected.
    • In the Absolute path on the server column, click Edit (Edit) and enter /var/www/magento2
  5. Click OK.

Next steps