Prepare the LAMP Development Environment with VisualStudio Code and VirtualBox


For PHP development, I preferred to code in the host and run in the guest OS. It helps to keep the host clean and stable. Because PHP and APEX[1] are both required, I switch from NetBeans to Visual Studio Code.

  1. Install and Configure Visual Studio Code and PHP Extensions
  2. Import and Configure TurnKey LAMP Stack

Install and Configure Visual Studio Code and PHP Extensions

Visual Studio Code supports Windows, macOS, and Linux. Installation is straightforward. It requires three extensions to support my PHP development process:

Build-in PHP Support

The built-in support for PHP includes color syntax, suggestion, and validation. [File]→[Preferences]→[Settings] and search for PHP would list all options.

While editing a PHP file,  a message box pops up on the lower right corner: “Cannot validate since no PHP executable is set. use the setting ‘php.validate.executablePath’ to configure the PHP executable”. To enable the validation feature, install the latest PHP interpreter:

$sudo apt-get update
$sudo apt-get install php

To enable realtime validation, set “PHP > Validate: Run” [onType]. It would validate while typing.

To remove PHP:

$sudo apt-get remove php
$sudo apt-get autoremove

PHP Intelephense[2]

Intelephense has more features beyond the built-in:

  1. PHP interpreter is not required for validation. To prevent the message box, disable the “PHP > Validate: Enable” option.
  2. Detailed signature (parameter) help.
  3. Hover help.

To install, [Ctrl] + [Shift] + [x] or click on the [Extensions] icon on the left [Activity Bar]. Search for PHP Intelephense and install.

SFTP[3]

It helps to sync remote and local via SFTP protocol. It may also upload the file automatically while saving.

To install, [Ctrl] + [Shift] + [x] or click on the [Extensions] icon on the left [Activity Bar]. Search for SFTP and install.

Next, press [F1] and type SFTP: Config to open the configuration file.

First, I add the [password] option to save time.

Second, for TurnKey LAMP Stack, the [remotePath] is ‘/var/www’. It’s might be different in other stacks.

Last, to delete remote file and folder, [syncOption.delete] needs to be set to ‘true’[4]. It doesn’t work with “syncOption.delete”: true. The following syntax[5] works for me:

"syncOption": {
  "delete": true
}

Commands: press [F1] and type:

  1. SFTP: Sync Local -> Remote
  2. SFTP: Sync Remote -> Local

Issue: sometimes it asks for the ./ssh/config file.

PrintCode[6]

Generate a formatted HTML file to print color code with line numbers.

To install, [Ctrl] + [Shift] + [x] or click on the [Extensions] icon on the left [Activity Bar]. Search for PrintCode and install.

Press [F1] and type PrintCode to print.

Workspace

Add the local working folder to the workspace for easier navigation.

Import and Configure TurnKey LAMP Stack

Download the streamable OVA image file. It’s compatible with VirtualBox and VMWare. Double click the OVA file will launch VirtualBox automatically for the import configuration.

After import, run the VM to setup the guest OS.

Use the URL displayed to access the Webmin. On the left menu, [System]→[PHP Configuration]. Edit the /etc/php/7.3/apache2/php.ini which is the configuration file for mod_php.

[Ctrl] + [f] to search for ‘opcach’. Set opcache.enable=0 to disable. With OPcache[7] enabled, it might display the cached version while developing.

Notes

A Project is Already on the Remote Server

  1. SFTP: Download Project
  2. Save the workspace and SFTP configurations locally.
  3. SFTP: Sync Local -> Remote
  4. Set the [syncOption.delete] to true.

No Project is on the Remote Server

  1. Save the workspace and SFTP configurations locally.
  2. SFTP: Sync Local -> Remote
  3. Set the [syncOption.delete] to true.

Generate a Skeleton HTML File

  1. Create an HTML file in the workspace.
  2. In the open file, enter ‘!’ then press the [tab] key. A skeleton would be generated automatically.

Reference

  1. Apex Developer Guide: What is Apex?
  2. Visual Studio Marketplace: PHP Intelephense
  3. Visual Studio Marketplace: SFTP
  4. GitHub: liximomo/vscode-sftp: Wiki: Common Config #syncOption.delete
  5. GitHub: liximomo/vscode-sftp: Issues: Sync Local->Remote does not delete files/folders #381
  6. Visual Studio Marketplace: PrintCode
  7. PHP: Documentation: OPCache
  8. Style Guide

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.