Best = Free: Drupal IDE based on latest Eclipse release (Kepler)

I hate it when waves of closed source fashion hit the open source communities: Purchase such and such an IDE, “it's awesome”. Apart from paying a lot, hey, it's closed source! Forget that! This article is the first in a series that will show you how to get set up with a top of the line, free as in beer and truly open source Drupal IDE (and Project Management system!), complying with the following objectives:

  • Top of the line free software development IDE with multiple projects and a multitude of plugins, based on Eclipse Kepler.

  • No vendor lock in.

  • Support for Web development in general (HTML, CSS, JS, XML, etc.), that is syntax highlighting, autocomplete suggestions with pop-up documentation, mouse-over documentation.

  • Support for PHP development also.

  • Support for back-end languages (Java, etc.)

  • Support for Remote project development, including code highlighting, etc.

  • Support for Drupal development

    • Drupal coding standards,

    • Drupal files immediately editable as PHP code,

    • Spaces instead of tabs

    • The right encoding (Unix) so they can be committed to Drupal repositories.

The benefits of Eclipse Kepler

Components we will need to attain our goals

Installing Eclipse Standard 4.3.1

Installing additional software from their installation sites

Table of required components and plugins

Drupal-specific configuration

Future articles

The benefits of Eclipse Kepler

There are several bundled projects and package solutions available directly from Eclipse downloads, from the Zend website, and even from interesting places like yoxos (“Create and share complete eclipse installations and workspaces in minutes”). But I'm a stickler for building your own and avoiding vendor lock-in. You know what you've got, you update it and curate it as you go along, and it accumulates your own replicable best practices. So instead of worrying about which old version of Eclipse is compatible with which old unsupported vendor locked-in version of which plugin or package, let's just go with the current release, and while we're at it, afford ourselves of its benefits.

Ian Bull's Top 10 Eclipse Kepler Features is an exciting place to find that out. Chief among them are 3. Platform Improvements With “Eclipse 4... many of the performance problems that affected Eclipse Juno have been addressed.” Yeah! Also, Orion looks tantalizing.

We're going with Eclipse Kepler (See the Eclipse releases page).

Components we will need to attain our goals

  • Eclipse Standard 4.3.1

  • Eclipse Git Team Provider (included with Kepler)

  • Eclipse Web Tools Platform Project

  • PHP Development Tools

  • Remote System Explorer

  • Drupal plugins and configuration

  • Covered in future articles:

    • Xdebug

    • Mylyn

    • GitHub Mylyn Connector

    • Server connectors

In spite of FUDstorms all over the internet, the Kepler release page (scroll down to list of participating projects) shows that all these components and plugins are totally compatible with this latest Eclipse release.

Installing Eclipse Standard 4.3.1

I'm assuming that you're working on a MacBook for this article, otherwise correcting for your own operating system is quite straightforward and well-documented elsewhere (one source is https://drupal.org/node/75242).

Download the new Eclipse Standard 4.3.1 from http://www.eclipse.org/downloads/ (I chose the 64-bit version which works great on my OS and platform).

After downloading Eclipse Standard 4.3.1 from http://www.eclipse.org/downloads/, unpacked into folder eclipse-kepler and moved the folder into Applications.

Ran app, chose workspace Documents/kepler-workspace, checked "use this site as default and do not ask again" and clicked OK.

Got rid of welcome. Get it back via Help > Welcome any time, for an overview of Workbench basics, Java Development, Team support & Git, Eclipse plug-in development and Eclipse Marketplace access.

By default there is support for Git and GitHub. Read the EGit User Guide from the Welcome page.

Installing additional software from their installation sites

Kepler seems to like things being installed via "Help/Install New Software" directly from the installation site, rather than downloading files and copying them into the Eclipse directory, so we'll follow this procedure to install all components and plugins:

  • Go to Help > Install New Software on the main menu

  • Stick in the repo site for the Work with field; for Kepler this will often be the Kepler repo, http://download.eclipse.org/releases/kepler .

  • Since this is "added" by default, A list of projects which can be open up to reveal software that can be installed, will appear immediately. If this is the first time you have worked with a particular repo (i.e. http://viplugin.com for the viPlugin), then you need to click the Add... button, and the list of available software will appear. Later on, for updates, clicking on Available Software Sites link will provide a list of all the sites you have previously worked with on that Eclipse install.

  • Open up one or more projects, for example if you are working with the Kepler repo, open up General Purpose Tools by clicking on the grey triangle pointing to the right so that it points down.

  • Select, say, Local Terminal. The status bar for this section says "1 item selected"

  • Click on the Next button

  • The progress bar says "Calculating requirements and dependencies", and the next screen shows the software package to be installed together with its dependencies.

  • Click on the Next button

  • Select the "I accept the terms of the license agreement" option and click on the Finish button. The Installing Software progress bar appears.

  • If you see a Warning: You are installing software that contains unsigned content... then continue at your own risk (worth taking for the packages mentioned here at least) "Just hit OK".

  • Upon completion of software installation, a dialog "You will need to restart Eclipse for the changes to take effect. Would you like to restart now?" appears. Click on the Yes button. Eclipse will terminate and re-initialize.

  • Go to Eclipse / About Eclipse from the main menu; you should immediately see little icons for all the projects that either come with Eclipse Standard or have been added via the Software Installation from remote sites process.

  • Click on the Installation Details button. There you should see all your installed software.

  • Click the Close button and then the OK button. You are good to go.

This procedure is covered by the numbers and with pictures in many places on the internet (making allowances for older Eclipse releases and things that are now included by default).

Table of required components and plugins

So given a list of desired components and plugins, we just need to know which ones, why, and the installation site we need to specify:

Component

Benefits

Installation site

(“Work with”)

Notes

Eclipse Web Tools Platform Project (WTP)

Suport for HTML, CSS, JS, XML, etc.

http://download.eclipse.org/releases/kepler/

See instructions below

PHP Development Tools (PDT)

Support for PHP Development

http://download.eclipse.org/releases/kepler/

ditto

Javascript Development Tools (JDT)

Support for JS

http://download.eclipse.org/releases/kepler/

ditto

Remote System Explorer (RSE)

Edit files directly on remote servers (with highlighting, etc.), including, for example, Pantheon in sftp mode

http://download.eclipse.org/releases/kepler/

ditto

Drupal for Eclipse PDT (plugin)

Adds new Drupal content-types under PHP for Drupal file types like *.module, *.install, *.theme, etc.

http://xtnd.us/downloads/eclipse

Install PDT first!

http://marketplace.eclipse.org/content/drupal-eclipse-pdt#.UpIi9WRgbAh

Eclipse Color Theme

 

http://eclipse-color-theme.github.com/update

 

Since most of what we want is available working directly with the kepler repository, do the following first:

  • Go to Help > Install New Software...

  • Specify http://download.eclipse.org/releases/kepler/ in the Work with field

  • Immediately a list of software categories is available

  • Under the various categories, select:

    • JavaScript Development Tools (JDT)

    • PHP Development Tools (PDT)

    • Eclipse Web Developer Tools

    • Eclipse XML Editors and Tools (my personal (optional) favorite :) )

    • Remote System Explorer End-User Runtime

    • Remote System Explorer User Actions

Install as per the above described software installation steps.

So after restarting Eclipse we now have the following Eclipse Perspectives (among others) to open:

  • Git Repository Exploring

  • Java (default)

  • JavaScript

  • PHP

  • Plug-in development

  • Remote System Explorer

  • Resource

  • Team Synchronizing

  • Web

  • XML

Cool!

Important: Additional Remoting configuration:

  • Enable hidden files for RSE

  • Fixing PHP autocomplete for RSE

In order to enable hidden files for RSE, go to Eclipse > Preferences > Remote Systems > Files from the main menu. Select the Show hidden files checkbox.

In order to fix PHP autocomplete for RSE, invoke the Remote perspective, open up the Local (default "remote connection" to local files on your hard drive) and under Local Files navigate to your Eclipse workspace directory (specified by you when you began to use the Eclipse instance). Open directory RemoteSystemsTempFiles. Edit the .project file by double clicking on it. Add the following two lines to <natures>:

		<nature>org.eclipse.wst.jsdt.core.jsNature</nature>
		<nature>org.eclipse.php.core.PHPNature</nature>

Save file, restart eclipse, then in a PHP file, type in "str" and see PHP autocomplete suggestions plus documentation for each.

(This last bit courtesy of Patrick J Waters http://www.patrickjwaters.com/blog/2011-07-24/how-setup-eclipse-php-pdt-remote-system-explorer-theme-manager-and-drupal-plugins/35)

Drupal-specific configuration

Install the Drupal for Eclipse PDT plugin (see above table), which adds new Drupal content-types under PHP for Drupal file types like *.module, *.install, *.theme, etc.

Unix friendly File encoding

Eclipse > Preferences > General > Workspace

Text file encoding should be Other UTF-8. New text file line delimiter should be Unix.

Ensure spaces are used instead of tabs

Eclipse > Preferences > General > Editors > Text Editors

  • Displayed tab width: 2

  • Check Insert spaces for tabs

XDebug and more on https://drupal.org/node/75242

Future articles

In future articles we will cover:

  • Integrating the IDE with Git and GitHub, making it a process and project management tool also

    • Mylyn and the GitHub Mylyn Connector

    • Sample project

  • Integrating the IDE with the latest and complete Pantheon workflow, including multidev and terminus!

  • Integrating the IDE with a variety of standard cloud server alternatives

  • Other good stuff

  • Suggestions?