Previewing PHP in Aptana with MAMP Pro

I’m currently developing an AIR application with my good friend Rich. Obviously we’re using Flex for the UI and client-side logic. On the back-end we’re going to use AMFPHP (a personal favourite of mine). In the past I’ve used Dreamweaver, PHPEclipse and more recently Aptana for PHP development and some of these are more suited to a Flex workflow if your main Flex IDE is Flex Builder (or eclipse).

The only issue I had to begin with was the previewing of PHP via Aptana with an external web server (in my case MAMP). This is compounded even more if you are using the domain aliasing feature of MAMP Pro. The solution is pretty obvious but can be a bit confusing as the Aptana documents that relate to Preview set up appear to be a little out of date.

The first thing to realise is that the traditional Run option in eclipse doesn’t have anything to do in this case (I’m still working on getting this working with MAMP Pro too). Previewing PHP with Aptana involves enabling the HTML preview functionality of Aptana’s PHP editor – It’s a nested tab affair but works pretty well. You can see what it looks like in the image to the right. You’re not restricted to a single preview tab either. You can enable additional tabs based on what browsers you have installed (although at this point it seems to be just SAfari and Firefox on OS X).

The key thing to be aware of is that if you are using MAMP Pro local aliases you can’t use the XAMPP server setup dialog to test your code, as the basic MAMP scripts don’t control the aliasing (they will resolve to ‘localhost’ by default). You’ll need to create a set of custom shell scripts to achieve this. The good news is, that you don’t need to worry about this for previewing your code.

To enable this you need to either set it globally in your eclipse / Aptana preferences or on a per project basis. I opted for the latter as I use aliased domains to develop against so they are generally specific to the project. Below are the steps for setting up previewing on a specific project in case you’re not too sure what to do.

Setting up previewing in Aptana

• Right click on your project entry (in this example the project is called FGBlog-WP) in ecipse / Aptana and select the Properties entry from the context menu
• When the Properties dialog box opens click on the HTML Preview entry on the left hand side (see the image below for a guide)
• Now if you are using a XAMPP or standard MAMP installation you can make a custom server and use that in the “Use Server” option in the “Preview Settings”. However as we are using an aliased server we need to select the “Use Absolute URL” and type in the URL of the locally aliased server. In the image you can see it is “fgblog”
• Next up we need to decide if we want to append the project settings to this URL – I’m not sure why you wouldn’t as it won’t resolve the files paths correctly if you don’t. So select this. You should see the “Sample URL” update to reflect this. Now there is a bug here which I’ve detailed at the end of this article
• Finally we have the Preview Browsers option. Now on a Mac it uses Safari by default (I’m assuming it will use IE on a Windows box), but you can have Firefox as an additional or alternative to this
• Once you have set your selection click “Apply” and then “OK” and open up (or create a new PHP file in the project. Before we test out the preview feature we better make sure we have our MAMP Pro alias set up correctly.

Linking your Aptana project to your MAMP Pro alias

Npw this one is here purely for those new to MAMP Pro as most established users will already know how to do this. Plus it’s pretty simple to do so you should fly through this bit.

• Open up the MAMP Pro control panel and select the Host tab
• Add a new alias by clicking on the ‘+’ bottom left and then filling in the details in the right hand pane (basically the alias and location – see the image below)
• In the Disk location field just click “Choose…” and navigate to the Aptana project root (as mentioned previously this is FGBlog-WP in this example)
• Click “Apply” and restart MAMP Pro
• That’s it – we can now test our Aptana project preview settings

The preview feature isn’t restricted to PHP projects. I believe it will work with any project that can display HTML (so AJAX, RoR etc, but I haven’t tested any of these so I may be wrong)

The Document Root bug

Currently (Aptana build 1.1x), if you change the project document root as shown at the top of the Aptana HTML Preview settings dialog to something other than “/”, Aptana will ignore it. This is scheduled to be resolved in Aptana build 1.2, but just so you are aware this may cause issues if you have your PHP project set up with a ‘src’ folder (or something of a similar nature) as the root.