Phing is a PHP build process that uses XML , ANT style syntax.

At some point in development, the choice is made to begin professional work. If more than 1 developer contributes to the effort, then an the easy mode of keeping in sync with that person and, in the future, others that may join the effort is required. Because not all developers are alike, and not all hosting providers are alike, you must have a solid build process of your code.  The build process automates the routines that every developer must do, either daily, hourly, or with every code change as well as when code is pushed into client facing distributions.  Phing is an XML to PHP build process that imitates the ANT build process that many development shops are used to.  As a PHP developer, Phing is much easier for me to work with and get things done, as well as keeps things simple when needing to update the build process.

Installing Phing

Dependencies :

Straight from the source, “To use Phing you must have installed PHP version 5.2 or above compiled –with-libxml2, as well as –with-xsl if you want to make use of advanced functionality.” I would hope that if you are doing any serious PHP development, you would already meet these requirements.  If you are needing to upgrade your PHP, then you really should reconsider what you are using PHP for.

My approach to installing Phing is the simplest solution and it follows exactly what the setup guide describes by using Pear.

$ pear channel-discover pear.phing.info</span>
$ pear install phing/phing

You should now be able to test Phing by simply typing ‘phing’ from the command line. You should get an error similar to this: ‘Buildfile: build.xml does not exist!’

Copying and Moving Files

One of the most important parts of a build process is the ability to move and copy files to different places. Phing makes this easy and allows you to modify the files as you are moving them. Different reasons to have a build process will determine how you would like to set up your folder paths for Phing to manipulate. Let’s do one that is pretty powerful and pretty simple at the same time: copying all files from a folder, into a single file, located in an entirely different folder.

build.xml

<?xml version="1.0" encoding="UTF-8"?>
<project name="MyWebapp" default="default" basedir=".">
<target name="default">
 <foreach param="dirname" absparam="absname" target="compile-folder-js">
  <fileset dir="./js">
   <type type="dir" />
   <depth max="0" min="0" />
  </fileset>
 </foreach>
</target>
<target name="compile-folder-js">
  <mkdir dir="./${dirname}-js" />
  <fileset id="filestocompile" dir="js/${dirname}">
   <include name="**/*.js" />
  </fileset>
  <append destFile="./${dirname}-js/${dirname}.js">
   <fileset refid="filestocompile" />
  </append>
</target>

Phing works using a Build.xml file to run the commands when Phing is called. The only requirements of this file are the project tag and a default target. We have set our default target to run code that dives into the ./js folder path; loops through every folder in this path and passes them to another target (compile-folder-js) for processing; one at a time. Now we can have in our source ./js/jquery/ and ./js/modernizr/ and this will take all JavaScript files send them to the compile-folder-js target.

The compile-folder-js target will loop through the directory that is passed to it and grab all JavaScript files (recursive folder depth because of the **/ ) and append them to a single file under the path ./directory-js/directory.js. This is pretty great when it comes to a production versus a development site. For instance, in a development site, you may have 5 different JavaScript files, but in a Production site, after a build, you could have a single JavaScript file. However, one point to be aware of, the files will be appended in teh order the file system sends them (defaults as alphabetical order).

Sanitizing Files

Now that we are concatenating our JS files, we can take it further and do some sanitizing with JSLint. Adding this to our current project is fairly simple. Start by downloading the most recent version of JSLint for your operating system. Make sure to uncompress the file and remember where you put the uncompressed file.

<?xml version="1.0" encoding="UTF-8"?>
<project name="MyWebapp" default="default" basedir=".">
<target name="default">

 <property name="jslint" value="./path/to/jslint/jsl-0.3.0-mac/jsl" />
 <echo msg="Checking JS for errors..." />
 <jsllint haltonfailure="true" cachefile="./jslint.cache" executable="${jslint}" conffile="./path/to/jslint/jsl.default.conf">
  <fileset dir="./js">
   <include name="**/*.js"/>
  </fileset>
 </jsllint>

 <foreach param="dirname" absparam="absname" target="compile-folder-js">
  <fileset dir="./js">
   <type type="dir" />
   <depth max="0" min="0" />
  </fileset>
 </foreach>
</target>
<target name="compile-folder-js">
  <mkdir dir="./${dirname}-js" />
  <fileset id="filestocompile" dir="js/${dirname}">
   <include name="**/*.js" />
  </fileset>
  <append destFile="./${dirname}-js/${dirname}.js">
   <fileset refid="filestocompile" />
  </append>
</target>

We’ve added a JSLint check that runs through all of the JavaScript files and send them through the JSLint downloaded binary for checking. The process will now stop if you right improper JavaScript, immediately letting you know if you have issues with your code.

Compressing Files

Sometimes, checking your JavaScript for errors, and moving into a single folder is just not enough. You still may want to compress them down, obfuscate them, so that they are at the absolute smallest size possible. For this, a good option is Google Closure Compiler. You can get a good task to help with this so that it’s a drop in solution. Just drop this new task definition into your phing path and you are set. Now our code can implement this piece to get a better JavaScript file.

<?xml version="1.0" encoding="UTF-8"?>
<project name="MyWebapp" default="default" basedir=".">
 <taskdef name="googleclosurecompiler" classname="phing.customtasks.GoogleClosureCompiler" />

<target name="default">
 <property name="jslint" value="./path/to/jslint/jsl-0.3.0-mac/jsl" />
 <echo msg="Checking JS for errors..." />
 <jsllint haltonfailure="true" cachefile="./jslint.cache" executable="${jslint}" conffile="./path/to/jslint/jsl.default.conf">
  <fileset dir="./js">
   <include name="**/*.js"/>
  </fileset>
 </jsllint>

 <foreach param="dirname" absparam="absname" target="compile-folder-js">
  <fileset dir="./js">
   <type type="dir" />
   <depth max="0" min="0" />
  </fileset>
 </foreach>
</target>
<target name="compile-folder-js">
  <mkdir dir="./${dirname}-js" />
  <fileset id="filestocompile" dir="js/${dirname}">
   <include name="**/*.js" />
  </fileset>
  <append destFile="./${dirname}-js/${dirname}.js">
   <fileset refid="filestocompile" />
  </append>

 <googleclosurecompiler compilationLevel="SIMPLE_OPTIMIZATIONS" targetDir="./${dirname}-js/" failOnError="true" outputFile="${dirname}-compressed.js" merge="true">
  <fileset dir="./${dirname}-js/}">
   <include name="${dirname}.js" />
  </fileset>
 </googleclosurecompiler>
</target>

Conclusion

We’ve been able to now create a worthwhile setup that allows a webapp to move,verify and compress all of its JavaScript files whenever the command ‘phing’ is ran on the path. This is a very simple setup, but one that can really be expanded on. For instance, you can use dates or hashes appended to files so that caching is easier. You can setup a multi-directory structure for better handling of JS versions. You can even pre-gzip your code so that it is much faster for downloads and lighter weight on the server-side load.

Hopefully this will get you into the process of using Phing and developing a solid build process in your web coding.

Update – 4/6

Another nice approach is found in the comments, take a look!

It starts with how search engines manage what URLs your site is using. Search engines need to keep a good idea if you are trying to manipulate your results on the search by including ‘junk’ content. A familiar approach is to have two URLs point to the same content. This way, you are using the same content multiple times and would expect to have a better result on the search engines (because you have so much content on the subject!). Search engines have caught on to this (Google suggestions), and they keep a signature of all the content for your pages with the URLs; if they detect the same or very similar content across different URLs they instinctively rule that content out of the equation (SEO by the sea).
Codeigniter is actually suggesting you make two URLs for the same content with their recommended solution by adding the following code into a .htaccess file at the root of your codeigniter installation.

RewriteEngine on
RewriteCond $1 !^(index.php|images|robots.txt)
RewriteRule ^(.*)$ /index.php/$1 [L]

Line by line, this is stating to ‘rewrite’ everything that isn’t beginning with index.php in the URL so that it does not contain index.php on the server-side logic (hidden from the user). However, if the user were to use the URL with index.php still in it, guess what; it will still work. You now have two URLs pointing to the same content!
The SEO friendly way to do this would require a little bit of ‘tom foolery’ with the code. Here is my .htaccess file that I use for my codeigniter sites.

Options +FollowSymLinks
DirectoryIndex index.php

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /

    RewriteRule ^index.php?(.*)$ $1 [L,R=301]

    RewriteCond $1 !^(home.php|css|js|images|robots.txt)
    RewriteRule ^(.*)$ /home.php/$1 [L]

<IfModule !mod_rewrite.c>
    # If we don't have mod_rewrite installed, all 404's
    # can be sent to index.php, and everything works as normal.
    # Submitted by: ElliotHaughin

    ErrorDocument 404 /index.php
</IfModule>

First thing you will notice is that I have very similar code involved in my .htaccess that you find in the codeigniter code.

	RewriteCond $1 !^(home.php|css|js|images|robots.txt)
	RewriteRule ^(.*)$ /home.php/$1 [L]

I have changed out the index.php with home.php (which doesn’t exist yet) and I’m also allowing some CSS and JS folders through the ‘rewrite’. Above this code I’m adding the SEO friendly 301 redirect hook.

    RewriteRule ^index.php?(.*)$ $1 [L,R=301]

I am purposely rewriting any URL that begins with index.php to no longer begin with index.php. I also pass [R=301] which tells a browser or search engine that the old URL no longer exists and they need to use the new one from now on.
Back to the home.php; you need to create a new file called home.php and place it in the same place as index.php. The only thing that needs to be inside home.php is the following code.

<?php /*this file is for SEO purposes */
require('index.php');

Now, anything going to home.php will be routed to index.php internally so nothing in codeigniter needs to change.

Conclusion

This hasn’t solved the multiple URLs completely, as now anything pointing to home.php will be a second URL to the same content. However, you should’t have anything pointing to this URL and you can make sure that search engines cannot use this URL by adding a clause to your robots.txt. Anybody using the older index.php URL will get a 301 redirect that lets the software they use know not to use it anymore.

There are probably also options to handle not needing another file (home.php) in the .htaccess file but I was unable to get the same results that I am getting with this method. Feel free to correct or update, or tell me why I’m wrong!

Requirements

1. Must be autonomous
2. Must be able to Add/Edit Comments, without having to directly change the source files
3. Must contain revision controls
4. Display of the output must be adaptable easily
5. Must contain an API to access from “afar”

With those five initial setups, I think I will start to build some thought expirements to figure out exactly what I am talking about.  Should I implement SVN into it?  ScriptDoc formats?  JavaScript engine for analyzing?  Lots of different things.

Come back to this post for more info later.  I’m going to search out other programs that implement some of these things to figure out if there are any.

Help appreciated

IBM has outdone themselves with the x61. The x61 came out about a half a year ago, and this Christmas they had a one week deal that dropped the price down by nearly 50% of the overall Cost. I jumped at the prospect, even though I had decided to wait another 6 months to replace my aging Toshiba. Let me Introduce you to my new computer.

Lenovo X61

• Dual Core Centrino Pro 1.8Ghz with 4Mb Cache
• 3Gb 533Mhz DDRII Ram (Max 4Gb)
• 100Gb 7200rpm Hard Drive with 1Gb Cache for speed boost
• Multi-Touch Monitor (Touchscreen and Stylus)
• Multi-View Monitor (Indoor and Outdoor – full sunlight does not affect viewing enjoyment. ** Max resolution is only 1024 x 768)
• Tablet Mode (monitor swings around and lays flat)
• Vista Business
• Intel 965 Integrated Video with 128Mb dedicated memory
• 3 usb 2.0, Gigabit Lan, Wifi A/B/G/N, SD reader, PCMCIA slot, 1394 Firewire, VGA out, onboard Mic.
• 4-Cell Battery (8-Cell available) @ 2.5 hours of power

So as you can see, this thing flies! It’s a tablet computer that weighs a mere 3.77 lbs with the battery in.

Now to the good stuff, what this is intended to do.

First thing I did was install VMware Workstation 6. This is a virtualization software that will allow me to do what’s next in the list.

Next I downloaded Ubuntu Gutsy 7.10 in live cd Iso format. Then mounted the ISO as a virtual CD drive. Fired up VMware and created a new virtual computer, which was subsequently loaded with Ubuntu.

While in Ubuntu, I then installed Quanta+, Apache, PHP5.2, MySql5, RapidSVN.

Quanta has quickly become my chosen editor when it comes to developing. It’s fast, sublime, pretty and full of features, including auto finishing words you are typing based on a history of the words you have typed. The rest of the LAMP install is too long and also reproduced many times over (check out the forums on http://forums.ubuntu.com for more details if you are interested in this) to repeat here for the 10 Millionth time.

While VMWare is running the Ubuntu machine, that I dedicated 512Mb Ram to, I started network installing Microsoft Office. I really really enjoy using OneNote, which is one of the greatest Tablet Tools that is out there.

After that was all said an done, I know have a mobile computer that packs a serious punch. I am running Vista using OneNote to take notes, Internet Explorer 7, Firefox, Safari and Opera to test web pages, virtualized Ubuntu Gutsy running my editor and Webserver, so no matter where I happen to be, I can easily program and test via a single powerful machine.

Such an amazing combination, I am sure many of you also would consider the same.