Sunday, July 29, 2007

Supercharging your Eclipse configuration with Subclipse and Quantum DB

Supercharging your Eclipse configuration with Subclipse and Quantum DB

In this article, I will document the steps I followed to create my Eclipse development environment. This by no means covers all the Eclipse plugins, and I am by no means an expert in Eclipse plugins. The steps I followed below got me to a pretty good environment for PHP development with MySQL. Specifically, I am developing with Symfony but I am saving the Symfony specific config for another article.

This article assumes that you have set up Eclipse already. Reference my articles for Windows XP and Ubuntu Linux for specifics on how my config goes..

Conventions used in this article: <xamppHome> refers to the directory containing the xampp binaries. <eclipseHome> refers to the directory containing the Eclipse binary.

So here we go!

Step 1: Install Quantum DB
Quantum DB will give you a perspective within Eclipse that is a nice interface to manage your MySQL Database.

Step 1.1: Install MySQL Connector
You will need a specific java driver for connecting to a MySQL database with Eclipse. Download it here:

http://dev.mysql.com/downloads/connector/j/5.0.html

  1. Uncompress this file.
  2. Create a directory <eclipseHome>/drivers/mysql-connector.
  3. Copy the .jar file within this download into the directory.
Step 1.2: Install Quantum DB

Download the plugin here:
http://sourceforge.net/project/showfiles.php?group_id=7746

Uncompress the file. Copy the uncompressed contents of the file directly into <eclipseHome>/plugins.

Step 1.3: Connect to your database

Now you will use Quantum DB to connect to your database. Open up Eclipse. Select Window->Open Perspective->Other.. Then select Quantum DB. Right click in the 'Database Bookmarks' pane. Select 'New Bookmark'. Select 'Add Driver..'. Now 'Add External JAR'. Browse to the file you copied in step 1.1. Beside 'Class Name' click on Browse. Select 'com.mysql.jdbc.driver' and hit 'OK'. Finally on the main screen hit 'Finish'.

Now the mysql driver should appear in the JDBC Driver window. Make sure it is selected and hit 'Next..'.

Enter the specs for your database and hit Next. Enter a name for this bookmark and Finish. You should now see your shortcut in the Database Bookmarks pane. You should be able to expand the bookmark and see the aspects of your database.


Step 2: Install Subversion support.


Within Eclipse, select Help->Software Updates->Find and Install..

Select 'Search for New Features to Install'. Hit 'Next'.

Select 'New Remote Site..'
Name: Subversion
Url: http://subclipse.tigris.org/update_1.2.x

Now on the main screen ensure Subclipse is checked. Hit 'Finish' and follow the instructions to install Subclipse.

When you are done, you will have a 'SVN Repository Exploring'. You can use it to connect to your repository and do all the operations you need to.

Thursday, July 26, 2007

Local workstation xampp/Eclipse PDT/xdebug on Ubuntu Linux from start to end

These instructions are for (specifically) Ubuntu Linux. You can find the Windows XP instructions here. All the instructions under here should be executed as the non-root user.

Step 1: Download xampp
You can download xampp for Linux here:
http://www.apachefriends.org/en/xampp-linux.html
Also, there may be packages available within your distro. If there are, I recommend you use them.

Step 2: Install xampp
Uncompress the file you downloaded. Inside you will find a 'lampp' directory. Use sudo to move this into /opt on your machine. This is where xampp is pre-configured to go. If you do not place it in /opt you will need to use a command like this:

# sudo find <xamppHome> -type f -exec fgrep /opt/lampp {} /dev/null \;

To root out all the config files that need to have their path altered.


Step 3: Start xampp and test

Execute <xamppHome>/lampp start

Swing a browser on your xampp machine to 'http://localhost' to test the installation. You should see a flashy splash screen.

You might also want to put a file called phpinfo.php in your htdocs directory. You'll want it to have the following contents:

<?php phpinfo() ?>

Hit the page 'http://localhost/phpinfo.php' and you've just executed a php script that tells you all about your php installation.

Step 4: Download Eclipse PDT

Note: For Eclipse PDT to work on Ubuntu, I had to install the actual Sun JRE (package sun-java6-bin). Select it in Synaptec package manager, apply it, logoff, login, and Eclipse will work.

Eclipse PDT is a version of Eclipse that is bundled specifically for PHP developers. It's a good place to start when you're a PHP developer. The latest version is M1. You can download the latest integration build at:
http://europa-mirror1.eclipse.org/tools/pdt/downloads/?release=I20070712

You want the 'all-in-one' package for your platform. It's Java, so at it's heart it is platform independent, but it uses widgets that are platform specific.

Step 5: Install Eclipse PDT
Uncompress the file you just downloaded. Somewhere inside there you will find a directory called 'eclipse'. Move that into the home directory of the non-root user you will be developing under, or some directory under that home. From here on in I will refer to this directory as <eclipseHome>.

Step 6: Download xdebug server install and configure in php.
Download at: http://www.xdebug.org

Linux users may need to do the following:
  • Download the file
  • Install phpize (may need to install package php5-dev to get it)
  • Uncompress the file and navigate to the directory
  • $ phpize
  • $ ./configure --enable-xdebug
  • $ make
  • $ cp modules/xdebug.so /lib/php/extensions
In both etc/php.ini, make the following configuration changes:

- set 'implicit_flush = On'
- Add the following to the end of the file:
[xdebug]
xdebug.remote_enable=1
xdebug.remote_host="localhost"
xdebug.remote_port=9000
xdebug.remote_handler="dbgp"
zend_extension="/lib/php/extensions/xdebug.so"


Step 7: Restart xampp and test xdebug

$ sudo /opt/lampp/lampp restart

Now browse to http://localhost/phpinfo.php. You should see a section for xdebug. This means that the xdebug extension is running properly.

Step 8: Download Eclipse xdebug plugin

You want the 'Prebuilt Binary V0.2.3'. Here's the download link:
https://bugs.eclipse.org/bugs/attachment.cgi?id=74296

Extract the file and move the two jar files within into the <eclipseHome>plugins directory.

Step 9: Point Apache into the Eclipse workspace

If this is to be purely an Eclipse/xdebug workstation, it's best to change the xampp Apache DocumentRoot so that it will look to the Eclipse workspace for any web page that you open. Edit <xamppHome>/etc/httpd.conf and change the following:

From:
User nobody
Group nogroup
To:
User <yourDevUser>
Group <yourDevUsersGroup>

Note: This is really insecure. Do not use this in an environment that is open to the internet. I'm also working with the assumption you will be the only user accessing this webserver and so it will only have permission to see your files with this setting.

Also,
From:
DocumentRoot /opt/lampp/htdocs
To:
DocumentRoot <eclipseHome>/workspace

Also,
From:
<Directory "/opt/lampp/htdocs">
To:
<Directory "<eclipseHome>/workspace">

Because you have changed httpd.conf, you should restart xampp now.

$ sudo <xamppHome>/lampp restart

Step 10: xdebug configuration within Eclipse
Fire up Eclipse by executing the appropriate binary in <eclipseHome>.; When it asks you about the workspace, change it to <eclipseHome>/workspace. You can check the "Don't ask me later" mark; it's really easy to change again later.

When Eclipse starts, go to Window->Preferences.. PHP->debug. The pane should contain a section for xdebug preferences at the bottom.

Step 11: Create a PHP Project

You're finally ready to debug a web-based PHP script. Without further ado, within Eclipse select File->New->Project.. Now PHP->PHP Project.

For 'Project Name', enter 'debugtest' and then select 'Finish'. You will see the project pop up in the PHP Navigator. Highlight the project. Select File->New->PHP File and name it phpinfo.php (ok I'm not feeling very original here).

In the editing pane, make sure the file contents are:

<?php phpinfo() ?>

Note: Newlines get ignored.

Save the file.

Navigate to http://localhost/debugtest/phpinfo.php in your browser. You should see the same info you saw before but now it is coming from your eclipse workspace.

Step 12: There ain't no more.
Now for one last, momentous step. You must now go into Eclipse and tell the xdebug plugin how to start a debug session so that you can catch a breakpoint in your new script. Select Run->Open debug dialog.. and double-click on 'PHP Web Page with Xdebug'.

NOTE: There must be menu items 'PHP Exe script with XDebug' and 'PHP Web Script with XDebug'. If these aren't there then something has gone wrong with the plugin installation.

Under Script and Server, browse to the file phpinfo.php in project debugtest.

Make sure the url field has http://localhost/debugtest/phpinfo.php. If it doesn't, uncheck the box and edit it manually. This is important because it is the site that Eclipse will go to when you start your debug session. I had to do this on my laptop just now when I tested it.

Select 'Apply' and 'Debug'.

You should have seen your phpinfo output come up in the internal Eclipse browser. If it came up in an external browser don't sweat it, because that will work to. With some playing around with the configuration you can get it the way you want.

Now select the tab for phpinfo.php and right-click on the vertical bar between your phpinfo.php line numbers and the edge of the edit pane and select 'Toggle Breakpoints'. You will see a blue circle appear, indicating that there is a debug breakpoint at that location.

Click on the down-arrow next to the bug in the top toolbar and select the debug test session that you just created.

You should now have caught your first breakpoint. If so, your install is complete and functional.


Please stay tuned... I hope to soon write the following articles:
  • Supercharging your Eclipse configuration with Subclipse and Quantum DB
  • How To Roll With Eclipse + Symfony

Saturday, July 21, 2007

Local workstation xampp/Eclipse PDT/xdebug on WinXP from start to end

Last week, I got an xampp/eclipse-PDT/xdebug installation working on my Windows XP laptop. During the configuration, I found that I had to do a lot of jumping around to different sites to get the information that I needed to get it working. In the article below I will outline the steps that I took, with hopes that it will help someone else.

Note: The steps to install this on Linux are significantly different. As such, I have written the Ubuntu Linux 7.04 instructions here:

http://malibugarage.blogspot.com/2007/07/local-workstation-xamppeclipse.html

So.. Here we go!

Step 1: Download xampp

You can download xampp for Windows here:
http://www.apachefriends.org/en/xampp-windows.html
(I recommend the 7-zip self-extracting archive)

Step 2: Install xampp


Uncompress the file you downloaded. The configuration files within are all set up to run from C:\xampp. So if you can, copy the xampp folder that comes out of the compressed file to that location. If you can't, you should probably search each file for /xampp/ and \xampp\ and replace each instance with your preferred path. Do this before you get to the Eclipse step and it will save you a lot of hassle. In case you choose this path, I will refer to the xampp home directory as <xamppHome> from here on on.

Step 3: Start xampp and test

Double-click on 'start_xampp' in the <xamppHome> folder.

Swing a browser on your xampp machine to 'http://localhost' to test the installation. You should see a flashy splash screen.

You might also want to put a file called phpinfo.php in your htdocs directory. You'll want it to have the following contents:

<?php phpinfo() ?>

Hit the page 'http://localhost/phpinfo.php' and you've just executed a php script that tells you all about your php installation.

Step 4: Download Eclipse PDT

Eclipse PDT is a version of Eclipse that is bundled specifically for PHP developers. It's a good place to start when you're a PHP developer.

I recommend the latest integrated test version. You can download it at:
http://download.eclipse.org/tools/pdt/downloads/?release=I20070712

You want the 'all-in-one' package for your platform. It's Java, so at it's heart it is platform independent, but it uses widgets that are platform specific.

Step 5: Install Eclipse PDT
Uncompress the file you just downloaded. Somewhere inside there you will find a directory called 'eclipse'. Move that one into your xampp install directory.

Step 6: Download xdebug server install and configure in php.
Download at: http://www.xdebug.org

Windows users can download the dll.

Copy the .dll file into the directories <xamppHome>/php/ext and <xamppHome>/php/extensions.

In both <xamppHome>/apache/bin/php.ini and <xamppHome>/php/php.ini, make the following configuration changes:

- set 'implicit_flush = On'
- Comment out (type ; at beginning of the line) ALL the lines under [zend]
- Add the following:
[xdebug]
xdebug.remote_enable=1
xdebug.remote_host="localhost"
xdebug.remote_port=9000
xdebug.remote_handler="dbgp"
zend_extension_ts="<xamppHome>/php/ext/php_xdebug-2.0.0rc4-5.2.1.dll"

Note: The _ts above corresponds to THREAD SAFE. If you have trouble seeing xdebug in your phpinfo output, check the Thread Safe field in the top section. If it is Thread Safe: No, then take the _ts off and just use zend_extension=.
Also, check the 'Debug Build' field. If it is 'yes' you will need 'debug' in this field name. Here are the possible combinations you could end up with:

zend_extension (I ended up with this on Ubuntu+xampp)
zend_extension_ts (I ended up with this on Windows XP+xampp)
zend_extension_debug
zend_extension_debug_ts

Step 7: Restart xampp and test xdebug

Double click C:/xampp/restart_xampp

Now browse to http://localhost/phpinfo.php. You should see a section for xdebug. This means that the xdebug extension is running properly.

Step 8: Download Eclipse xdebug plugin

You want the 'Prebuilt Binary V0.2.3'. Here's the download link:
https://bugs.eclipse.org/bugs/attachment.cgi?id=74296

Extract the file and move the two jar files within into the <xamppHome>/eclipse/plugins directory.

Step 9: Point Apache into the Eclipse workspace

If this is to be purely an Eclipse/xdebug workstation, it's best to change the xampp Apache DocumentRoot so that it will look to the Eclipse workspace for any web page that you open. Edit <xamppHome>/apache/conf/httpd.conf and change the following:

From:
DocumentRoot /xampp/htdocs
To:
DocumentRoot <xamppHome>/eclipse/workspace

Also,
From:
<Directory "/xampp/htdocs">
To:
<Directory "<xamppHome>/eclipse/workspace">

Because you have changed httpd.conf, you should restart xampp now.

Step 10: xdebug configuration within Eclipse
Fire up Eclipse by executing the appropriate binary in <xamppHome>/eclipse. When it asks you about the workspace, change it to <xamppHome>/eclipse/workspace. You can check the "Don't ask me later" mark; it's really easy to change again later.

When Eclipse starts, go to Window->Preferences.. PHP->debug. The pane should look like this. (Notice the xdebug section). I didn't actually have to change anything here, as it's all in the php.ini.



Step 11: Create a PHP Project

You're finally ready to debug a web-based PHP script. Without further ado, within Eclipse select File->New->Project.. Now PHP->PHP Project.

For 'Project Name', enter 'debugtest' and then select 'Finish'. You will see the project pop up in the PHP Navigator. Highlight the project. Select File->New->PHP File and name it phpinfo.php (ok I'm not feeling very original here).

In the editing pane, make sure the file contents are:

<?php phpinfo() ?>

Note: Newlines get ignored.

Save the file.

Navigate to http://localhost/debugtest/phpinfophp. You should see the same info you saw before.

Step 12: There ain't no more.
Now for one last, momentous step. You must now go into Eclipse and tell the xdebug plugin how to start a debug session so that you can catch a breakpoint in your new script. Select Run->Open debug dialog.. and double-click on 'PHP Web Page with Xdebug'.

NOTE: There must be menu items 'PHP Exe script with XDebug' and 'PHP Web Script with XDebug'. If these aren't there then something has gone wrong with the plugin installation.

You will come to a dialog screen that looks like this:




Under Script and Server, browse to the file phpinfo.php in project debugtest.

Make sure the url field has http://localhost/debugtest/phpinfo.php. If it doesn't, uncheck the box and edit it manually. This is important because it is the site that Eclipse will go to when you start your debug session. I had to do this on my laptop just now when I tested it.

Select 'Apply' and 'Debug'.

You should have seen your phpinfo output come up in the internal Eclipse browser. If it came up in an external browser don't sweat it, because that will work to. With some playing around with the configuration you can get it the way you want.

Now select the tab for phpinfo.php and right-click on the vertical bar between your phpinfo.php line numbers and the edge of the edit pane and select 'Toggle Breakpoints'. You will see a blue circle appear, indicating that there is a debug breakpoint at that location.

Click on the down-arrow next to the bug in the top toolbar and select the debug test session that you just created.

You should now have caught your first breakpoint.


Please stay tuned... I hope to soon write the following articles:
  • Supercharging your Eclipse configuration with Subclipse and Quantum DB
  • How To Roll With Eclipse + Symfony

About Me

I currently work designing infrastructure for websites representing a large insurance firm. I webdev in my spare time. If you're into hockey, check out my hobby site: nhlhockeypool