[web] Separating html from code

One of the biggest problems with a number of web scripting languages is how intermixed code and html can become. In the course of developing these forums I've managed to successfully implement a fairly good separation of the two. With most web development you're going to find that you'll be pulling some sort of data from a database and outputting HTML so they end user can view it with their favorite browser. It becomes problematic, particularly with compiled languages, to co-mingle regular code and the actual html output. I've worked on projects in the past where the process was: 1) Change HTML code 2) Compile 3) See how it looks 4) Go to 1 Luckily a very elegant solution exists in the form of XML. A number of databases today are now building in ways to pull data from a database directly in XML format. Even without that functionality, it is easy to reshape the results of a database query into an XML document.

<xml>
  <messages>
     <message>
        <id>1052</id>
        <topic>Separating html from code</topic>
     </message>
     <message>
        <id>1053</id>
        <topic>Cooking with Gas</topic>
     </message>
  </messages>
</xml>

Now XML is just another way of representing the same data you would pull from a database. So purely from a performance standpoint, we don't see any real advantages to making this conversion. What we ultimately want is a way to transform the XML into a nice, pretty format the end user can appreciate. The answer to our prayers comes in the form of a technology called XSLT. This particular technology allows us to create a template specifying precisely how we want to display the data within the XML node set. Example XSL document:

<?xml version="1.0"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
>

   <xsl:template match="/">
        <h1>Topic</h1>
        <table cellpadding="3" cellspacing="0">
            <tr>
                <th>Message</th>
            </tr>
            <xsl:apply-templates select="//message"/>
        </table>
    </xsl:template>
    <xsl:template match="message">
        <tr>
            <td><xsl:value-of select="id" /></td>
        </tr>
	<tr>
	    <td><xsl:value-of select="topic" /></td>
	</tr>
    </xsl:template>
</xsl:stylesheet>

The general approach you would exercise to utilize XSL would be: 1. Perform database query 2. Convert to XML 3. Load XSL stylesheet 4. Apply XSL transformation to XML 5. Display resulting output Utilizing XSL documents gives you something of a "template" language that can work with your existing compiled or scripted code. If you want examples of where we use XSL.. the forum listing and topic listing page you're looking at now are generated from XSL. The journal section and even the comments there are XSL generated. The application of XSL to an XML nodeset is language-specific. But sometimes awareness of what is available is more important than specific knowledge of how to do something. There are plenty of resources freely available that will show you how to perform the steps I just mentioned. =) --- Michael Tanczos