Dynamic Web Sites with XML, XSLT and JSP - exploring XML - webreference.com

The times where Web sites with static documents were successful
are long over. Today the update frequency and currentness are an
important factor for a site's success. There are a lot of mechanisms
for producing dynamic content these days. On the server side we have
CGI, PHP and servlets, the browser has JavaScript and Java applets.

All of these techniques have in common that the pages cannot be
created without programming knowledge. Whereas Web design was a domain
of graphics artists and layout artists, today programming specialists
are also necessary for building a complete site. This mix of creativity and
technology every so often leads to problems and time consuming workarounds:
either the design needs to be integrated in the code, or code appears
in HTML documents.

The coordination problems resulting in the tight coupling of these
two disciplines should be minimized as much as possible. In the remainder
of this article we introduce a method, that eases the
burden of providing dynamic data and integrating it in the Web site.
The basis is a Web server that supports the execution of Java Server
Pages (JSP). Inside the JSPs, the dynamic data gets generated that needs
to be integrated into the Web design.

Briefly put JSPs are HTML documents into which Java code can be
integrated. When such a JSP is requested for the first time, it is turned
into a Java servlet and compiled by the Web server, or more precisely
the JSP/servlet engine. This servlet then implicitly contains the
HTML code. The execution of the code generates the dynamic data and
combines it with the HTML to send back to the Web browser.

This approach alone does not yet reach our goal to separate
programming from design. Therefore we do not directly generate HTML
but take an extra step of saving dynamic data in XML. In order
to create HTML for the browser, we hand over the XML data to an
XSLT (Extensible Stylesheet Language Transformation) processor,
which, aside from the dynamic XML data, takes a static XSLT stylesheet.

Following the rules defined in the stylesheet the processor converts
the XML into HTML. After the conversion the HTML document will be sent
to the browser and displayed there. With this approach we separate
the programmer, who is responsible for the creation of the JSPs and
the acquisition of the dynamic data, and the graphics artist, who
maintains the transformation logic in the XSLT style sheet. Only
the kind of data needs to be agreed upon.

Software

As mentioned earlier, the basis for our approach is a JSP-enabled
Web server. We use for our example the popular and easy to install
Tomcat servlet engine, the successor of the well-known JServ engine
in the Jakarta project. It provides, besides the servlet container, also
a runtime environment for JSPs. The big advantage of Tomcat is that
it can be operated in stand-alone mode and therefore as a full Web
server as well as with dedicated Web servers such as Apache, Microsoft
Internet Information Server and Netscape Enterprise Server. Since
Tomcat is written in Java, it requires a Java runtime version 1.1
or higher. To set it all up:

• Download and install Java
  
• Download Tomcat
  
• Set TOMCAT_HOME and JAVA_HOME
  
• Start Tomcat with startup.sh or startup.bat
  
• Point your browser to the start page at http://localhost:8080
  
• Create directories under TOMCAT_HOME/webapps:
  
  
  
  • xslt
    
  • xslt/xml
    
  • xslt/WEB-INF
    
  • xslt/WEB-INF/lib
    
  
  
• Download Xalan
  
• Unpack Xalan and drop xerces.jar, xalan.jar, and bsf.jar into xslt/WEB-INF/lib
  
• Download Jakarta Taglib
  
• Unpack Taglib and drop xsl.jar into xslt/WEB-INF/lib, xsl.tld into xslt/WEB-INF
  
• Create xslt/WEB-INF/web.xml:
  

  
       <taglib>
          <taglib-uri>http://jakarta.apache.org/taglibs/xsl-1.0</taglib-uri>
    <taglib-location>/WEB-INF/xsl.tld</taglib-location>
       </taglib>
   

  
  
• Restart Tomcat
  

Example

The link between the JSP and the XSLT stylesheet is the data.
We defined a phonebook format in XML like so, and saved it under
xslt/xml/book.xml:

<book>
 <phone>
  <name>Police</name>
  <number>110</number>
 </phone>
 <phone>
  <name>Fire Brigade</name>
  <number>112</number>
 </phone>
</book>

The following minimalist JSP will be used as a data source
under xslt/book.jsp:

<%@taglib uri="http://jakarta.apache.org/taglibs/xsl-1.0" prefix="xsl"%>
<html>
<head><title>Phone Book</title></head>
<body>
<xsl:InsertWithXSL xml="/xml/book.xml" xsl="/xml/book.xsl" />
</body>
</html>

The first line references the xsl taglib, and the xsl:InsertWithXSL
directive invokes the XSLT processor and gets replaced with the
resulting application of book.xsl on book.xml.

Now begins the work of the Web designer, who needs to save the
XSLT style sheet under xslt/xml/book.xsl for reference by the JSP:

<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="book">
 <table>
 <tr><th>Name</th><th>Phone</th></tr>
 <xsl:for-each select="phone">
  <tr>
   <td><xsl:value-of select="name" /></td>
   <td><xsl:value-of select="number" /></td>
  </tr>
 </xsl:for-each>
 </table>
</xsl:template>
</xsl:stylesheet>

This stylesheet loops over all phone book entries and drops
the names and numbers into a simple HTML table structure.

If everything is plugged together correctly the result of requesting
http://localhost:8080/xslt/book.jsp displays:

Name	Phone
Police	110
Fire Brigade	112

Conclusion

The technique presented here exploits XML and XSLT for creating
dynamic Web sites. The simple JSP shown here can be easily extended
to generate the XML data from a database, or by parsing live HTML
from other sites and converting it into XML. The possibilities
are endless.

See also column 18 for another method
of combining XML, XSLT and JSP.