Configuring Eclipse IDE for PHP development/Linux

These instructions should work fine on any Debian-based distribution such as Debian, Ubuntu, Linux Mint, Xubuntu and Kubuntu.

Installation

There are several ways to download and install the Eclipse IDE to your Linux box. You can do it automatically from the comfort of your software center or using the Linux terminal with few commands or manually downloading and installing the Eclipse IDE from the Eclipse project website or other alternative download sites.

Method 1: From a Linux Repository

NOTE This method is recommended because you will automate the installation process and get automatic security patches and bug fix updates when the software is installed from the repositories.

Option 1: Terminal

• Open your terminal and type

sudo apt-get install eclipse

• Wait for the installation process to finish.
• If everything went fine, the Eclipse IDE will be available in the software menu.

Option 2: Software Center

• Open the software center that comes with your distribution.
• Type in the search box Eclipse IDE.
• Select Eclipse IDE in the search result list.
• Click on the install button.
• Wait for the installation process to finish.
• If everything went fine, the Eclipse IDE will be available in the software menu.

Method 2: From a Downloaded Copy

NOTE For manual download and installation, you must have Java runtime previously installed or Eclipse IDE will not run.

To install Java runtime on your Linux box, open a terminal and type following command and wait until the installation finishes:

sudo apt-get install sun-java6

You can also install Java from your software center. Just type openjdk java 6 and install the package.

To get a copy of Eclipse IDE, follow these steps:

• Go to: Eclipse download page.
• Download Eclipse Classic 32 or 64 bits according to your current OS version.
• Unpack the downloaded file to any location that you want. For example: the Downloads folder or the Desktop folder.
• Open the Eclipse folder an find an executable file called eclipse.
• Do a right click on the file then: properties → permissions and check Allow executing file as a program.
• To execute the Eclipse IDE, you can do a double click on the executable file or run it from terminal. For example:

cd ~/Downloads/eclipse/
eclipse

NOTE At the Eclipse download page you can see many versions of Eclipse IDE. All of them are basically the same Eclipse with several extensions pre-installed to do specific tasks. By default, Eclipse IDE comes with all the tools needed to develop Java projects but you can install more extensions to develop in other languages. Go to Compare Eclipse Packages to see a complete list of all the extensions included on each Eclipse Package build. You can try one of these pre-build packages specifically created for PHP development. Some of them are official releases from the Eclipse Website and others are independent projects.

• Eclipse PDT (PHP Development Tools)
• EasyEclipse for PHP
• PhpEclipse

Understanding the Interface

The Eclipse IDE is not just a editor. It is a platform and can be used to do many things. It employs a flexible philosophy to denominate and describe the way it displays and organizes the information. The most relevant parts of Eclipse interface are:

• The tool bar is at the top of the window just like any other common application.
• The tool bar with buttons is right under the tool bar. It contains several buttons. Most of them change according the current context, view or perspective. You can drag and drop that some buttons to arrange them as you like.
• The views are sections that divide the windows content and display different kind of information. You can arrange the views in almost any way. For example, columns, rows, complex combinations of columns and rows and so forth.
• The perspectives are just an arrangement of views in a certain configuration and normally sharing a relationship among them.

It is important to understand how this perspective philosophy works. For example The PHP perspective is used to edit PHP code so is coherent to display views related to the PHP code edition, views to manage the project files and views to navigate through the code. The following is a typical PHP perspective:

• Docked at the left with several tabs are the PHP explorer view and the Type Hierarchy explorer view.
• In the middle is a wide view which is the editor area. There will be as many tabs as there are files you are editing.
• Docked at the right with several tabs are the Search view and the Outline view. They will assist you in finding a chunk of code or to navigate through the parts, variables and object of your current work file.
• Docked at the bottom with several tabs are the Problems view, Task view, Console view and Progress view. There you will see unsolved problems like syntax errors, uncompleted TODO tasks and the progress of build or update operations.

On the other hand, the Debug Perspective shares some views with the PHP perspective but has a different arrangement of views and more views related to the code debugging operations such as:

• Debug view: Display the call stack of the current breakpoint.
• Servers view: Display a list of the configured servers.
• Variables view: This view shows a tree that is a complete dump of all the variables and object of the current session at the current breakpoint.
• Breakpoints view: Displays a list of all the breakpoints set in your project. You can double click on one of the items in that list to jump in that exact line of code.
• Expressions views: Here you can create expressions on the fly to evaluate them without the need to modify the code.

You can switch among perspectives by selecting them at Tool bar → Window → Open perspective or you can click the perspective buttons located at the far right of the The tool bar with buttons.

If you aren't satisfied with any of these perspective configurations and how their views are arranged, you can create your own perspectives and add as many views as you want and arrange them the way that makes you feel good.

• Modify the current perspective. (Any one. It doesn't matter.)
• Add the views you want and remove the others you don't.
• Arrange the views the way you like and that make you feel comfortable.
• Go to Tool bar → Window → Save perspective as and set a name for your custom perspective. For example: pimp-My-IDE and save it. You can also overwrite an existing view name.

So far you should be able to play with Eclipse IDE and understand its interface philosophy. If you want to see a video demonstration about Eclipse IDE to get a preview and taste some of its powers, check this out Webinar: Using Eclipse for Joomla! Development.

Understanding the Folder Structure

When you execute Eclipse for the first time, it will ask you to create a workspace. The workspace is a folder where Eclipse IDE will store two things: all your custom configurations and all or some of your projects.

All your projects will be separated into folders inside the workspace folder like this:

 /home/youruser/workspace/project-a
 /home/youruser/workspace/project-b
 /home/youruser/workspace/joomla_component
 /home/youruser/workspace/joomla-test-site

You can have more than one workspace. Each of them will contain its own custom configurations and will not affect the information of other workspaces. For example, you can have a workspace located at /home/youruser/java-workspace/ dedicated to contain Java projects and a separate workspace such as /home/youruser/php-workspace/ dedicated to PHP development.

As you can see, your workspace folder could be in any valid folder location. For the purposes of PHP development and our convenience, we can set our workspace folder to the same location where our Web server stores its Web files. For example, /home/youruser/lamp/public_html/. This way the Eclipse IDE and our Web server will use the same location for our Web files.

Is important to note that you have the additional option to place your project files outside the workspace locations if you wish. This way Eclipse gives you an additional flexibility in certain cases. For example, let's say we have a workspace located at /home/youruser/workspace/ which contains several random projects, but our server stores its files in a different location at /home/youruser/lamp/public_html/. Of course we want to put our PHP project there so we can edit the files and serve the pages at the same time. Simply create a folder like this: /home/youruser/lamp/public_html/my-joomla-project. Then create a new PHP project and manually specify the path of your new project.

What is the difference of projects that are inside and outside the workspace folder? The only noticeable difference is at the moment of creating new projects, When you create a project inside the workspace, Eclipse IDE will automatically create a folder for that project with the same name as the project itself. On the other hand, if the project is outside the workspace location, you can set a random name for the project and then you have to set the path of the project manually regardless of the destination folder name.

A final note about the behavior of creating new project is that the Eclipse IDE will not let you link an external project that is actually inside your current workspace location. Also you can manually create any folder inside your Eclipse IDE workspace location but that does not mean Eclipse will recognize such folders as a project at all. When you create the new project from the Eclipse IDE that shares the name of an existing folder that already exists in your workspace, Eclipse will automatically link all its contents to your new project.

When you create a new workspace, Eclipse will automatically create a hidden folder called .metadata. It will contain all your custom global configurations about the editors, perspectives and views. This configuration will be inherited by any new project by default. If you wish, you can override part of the global configuration with custom configurations values specific for each project.

When you create a new project, Eclipse will create these hidden files and folders inside your new project folder:

 .project
 .buildpath
 .settings

These files and folders contain information about your custom project configurations and building information that will let Eclipse show tree views of dependencies and classes among many other things.

Configuration

Installing More Extensions

For your Eclipse IDE you will need to install more extensions for PHP development and other tools to help you in your project development journey. Follow these steps and instructions:

• In Eclipse, go to: Toolbar → Help → install new software.
• You are now on the Install window. Click the drop-down list Work with and set it to --All Available Sites--.
• In the list, expand the nodes and find the following packages to install:
  • Go to Web, XML, and Java EE Development and select
    • PHP Development Tools (PDT) SDK Feature
    • JavaScript Development Tools
    • Eclipse Web Developer Tools
  • Go to General Purpose Tools and select
    • Remote System Explorer End-User Runtime

• Press Next → and follow the installation wizard. Restart Eclipse when prompted.
• In Eclipse, go to: Toolbar → Help → Install new software.
• Press the Add button and add this new repository, name it xtext plugin.

https://download.eclipse.org/modeling/tmf/xtext/updates/composite/releases/

• Press the Add button and add this new repository. Name it LESS plugin.

http://www.normalesup.org/~simonet/soft/ow/update/

• Press OK and wait until Eclipse fetches all the new elements.
• In the selection box next to the Add button, select the LESS plugin... repository.
• On the list below find the LESS option and check it.

• Press Next → and follow the installation wizard. Restart Eclipse when prompted.

Those are all the extensions to install for now. They should be enough to do local and remote PHP development. Nonetheless you can experiment and try all the extensions you want.

Configuring the Perspectives and Views

In this case we need to configure Eclipse for PHP development. Add the following perspectives:

• In the Toolbar, go to: Window → Perspective → Open Perspective → Other → Debug
• In the Toolbar, go to: Window → Perspective → Open Perspective → Other → PHP
• Switch to the PHP perspective.
• In the Toolbar, go to: Window → Show View → Other → Remote Systems
• Drag the view from the tab and drop it next to the PHP Explorer view.

Now you can explore local and remote PHP projects. The configuration of these tools are explained in this series of articles.

Configuring the editors

These are some of the configuration you can do to your editors to improve the user experience:

Display Whitespace

Some people like to see the whitespace represented in the editor. To do so:

• In the Toolbar, go to: Window → Preferences → General → Editors → Text Editors
• Check the Show whitespace characters box.
• Select the Apply and Close button.

Colors

To highlight some the parts of the code with stronger colors, follow these steps:

• In the Toolbar, go to: Window → Preferences → General → Editors → Text editors → Annotations
  • On the list find JavaScript Occurrences and set the color value to #FFFF5A.
  • On the list find Matching Tags and set the color value to #FFFF5A.
  • On the list find PHP elements 'read' occurrences and set the color value to #FFFF5A.

• In the Toolbar, go to: Window → Preferences → General → Editors → Structured Text Editor
  • Find the list Appearance color options.
  • On the list find Matching brackets highlight and set the color value to #0000FF.

• In the Toolbar, go to: Window → Preferences → JavaScript → Editor
  • Find the list Appearance color option.
  • On the list find Matching brackets highlight and set the color value to #0000FF.

• In the Toolbar, go to: Window → Preferences → JavaScript → Editor → Syntax Coloring
  • Find the list Element.
  • On the list find JavaScript → Functions. Enable the option and set the color value to "#1E90FF.
  • On the list find JavaScript → Function declarations Enable the option and set the color value to #1E90FF.
  • On the list find JavaScript → Local variable declaration. Enable the option and set the color value to #A52A2A.
  • On the list find JavaScript → Local variable references. Enable the option and set the color value to #A52A2A.
  • On the list find JavaScript → Parameter variables. Enable the option and set the color value to #A52A2A.

• In the Toolbar, go to: Window → Preferences → PHP → Editor → Syntax Coloring
  • Find the list Syntax Element.
  • On the list find Classes and set the color value to #1E90FF.
  • On the list find Functions and set the color value to #1E90FF.
  • On the list find Methods and set the color value to #1E90FF.
  • On the list find Variable and set the color value to #A52A2A.

Spell Checking

If you want Eclipse to check the grammar of your text, enable this option.

• In the Toolbar, go to: Window → Preferences → General → Editors → Text Editors → Spelling
  • Find and enable Enable spell checking.

Code Folding

Code folding is a nice feature of some editors. It allow you to fold the code in certain data structures such as functions, classes, conditionals and iterators. We are going to fold all except PHP classes to be able to check and study PHP files quickly.

• In the Toolbar, go to: Window → Preferences → General → Editors → Structured Text Editors
  • Select the Appearance tab.
  • Find and enable Enable folding.

• In the Toolbar, go to: Window → Preferences → JavaScript → Editor → Folding
  • Find and enable Enable folding.
  • Find and enable Comments.
  • Find and enable Header Comments.
  • Find and enable Members.

• In the Toolbar, go to: Window → Preferences → PHP → Editor → Code Folding
  • Find and enable Enable folding.
  • Find and enable Functions.
  • Find and enable PHPDoc.
  • Find and enable Header PHPDoc.

Code Cleaning

Eclipse provides some nice utilities to automatically remove empty lines, delete unnecessary trailing spaces, format the code and more. To activate these features:

• In the Toolbar, go to: Window → Preferences → PHP → Editor → Save Actions
  • Find and enable Remove trailing whitespace and also select All lines.

• In the Toolbar, go to: Window → Preferences → JavaScript → Editor → Save Actions
  • Find and enable Perform the selected actions on save.
  • Find and enable Additional actions.
  • Press the Configure... button.
  • Select the tab Code Organizing.
  • Find and enable Remove trailing whitespace.
  • Find and select All lines.
  • Press OK to continue.

• When you are done, press Apply and Close to save and close the Preferences window.

Fine Tuning

Increase RAM Usage

By default, Eclipse gets some configuration information to limit the amount of RAM. This configuration works fine for most users but if you have 2 gigabytes or more of RAM, consider setting this value to improve Eclipse performance.

First locate the eclipse.ini file that contains some Eclipse configurations.

• If you downloaded Eclipse IDE manually from Internet, the eclipse.ini file is just inside the unpacked folder.
• If you installed Eclipse via terminal or software center, the location of the file is /etc/eclipse.ini.
• In some Linux versions, the file can be found at /usr/share/eclipse/eclipse.ini.

NOTE If you found a config file at /etc/eclipse.ini, don't edit the file at /usr/share/eclipse/eclipse.ini.

This is the content of the original eclipse.ini file:

 -startup
 plugins/org.eclipse.equinox.launcher_1.2.0.dist.jar
 --launcher.library
 plugins/org.eclipse.equinox.launcher.gtk.linux.x86_64_1.1.100.dist
 -showsplash
 org.eclipse.platform
 --launcher.XXMaxPermSize
 256m
 --launcher.defaultAction
 openFile
 -vmargs
 -Xms40m
 -Xmx384m
 -Dorg.eclipse.equinox.p2.reconciler.dropins.directory=/usr/share/eclipse/dropins

To see the full reference about these parameters, visit [1].

Change the following values to increase the amount of RAM used by Eclipse.

 -startup
 plugins/org.eclipse.equinox.launcher_1.2.0.dist.jar
 --launcher.library
 plugins/org.eclipse.equinox.launcher.gtk.linux.x86_64_1.1.100.dist
 -showsplash
 org.eclipse.platform
 --launcher.XXMaxPermSize
 512m
 --launcher.defaultAction
 openFile
 -vmargs
 -Xms512m
 -Xmx512m
 -Dorg.eclipse.equinox.p2.reconciler.dropins.directory=/usr/share/eclipse/dropins

If you have a lot of RAM you can try these other configurations.

 -startup
 plugins/org.eclipse.equinox.launcher_1.2.0.dist.jar
 --launcher.library
 plugins/org.eclipse.equinox.launcher.gtk.linux.x86_64_1.1.100.dist
 -showsplash
 org.eclipse.platform
 --launcher.XXMaxPermSize
 1024m
 --launcher.defaultAction
 openFile
 -vmargs
 -Xms1024m
 -Xmx1024m
 -Dorg.eclipse.equinox.p2.reconciler.dropins.directory=/usr/share/eclipse/dropins