Seperation of Code and Content

[dnszero]

Yes, I left the word 'template' out intentionally

The Person:
I am the coder and designer for a number of inhouse web applications related to ISP stuff (monitoring, troubleshooting, trouble reporting, stats gathering/reporting, inventory tracking, etc). PHP and PERL are my best friends, I'm well acquainted with HTML and Javascript, CSS has recently started coming over for dinner, but they all agree that my taste in asthetics is quite lacking. However, there are no designers here, so my end users are often forced to accept color schemes that look best when left in hexadecimal.

The Need:
To be able to design web applications that are easy to maintain, easy to extend, and that have components which can be re-used in various applications with as little fuss as possible. (Read as:I'm on salary, so I want to bring my work week down from 70 hours to 50 hours.)

The Story:
I started looking for various tools and techniques to make this happen. I'd heard that templates can make all of this possible so I started investigating. After a little research, I decided that Smarty looked the best and began the process of learning it's language.

After plowing through the huge manual and checking out the examples (which look a lot like php) I began to have second thoughts about this. I did some more research and came across a great many articles which explain why templates aren't such a GoodThing(TM) after all.

The Question:
What is the best way for me (a programmer with no outside HTML people) to do this (seperate code from content and generate maintainable, reuseable code)?

[Sork]

Hi!
I'm in a same situation like yours, and after doing all what you've done, i decided 'the way of the widget'!
Based on the DOM Lib.

Here's some links from HarryF site - phpPatterns()
PHP and DOM: The Way of the Widget
Data Access Object Pattern (+ more widgets)

Hope that helps you to decide

[Selkirk]

Ironically, it takes more effort to build re-usable components than it does to build one that aren't reusable. Especially when starting out. You will be lucky if you make back the time in the long run. Expect to spend more time on it and get less done.

There is no silver bullet. It sounds like you are looking for one.

Don't expect software development techniques to be able to bring your work week from 70 hours to 50 hours per week.

you have a time management problem, not a programming problem.

read:
Sustainable Pace
40 hour work week

[HarryF]

Ironically, it takes more effort to build re-usable components than it does to build one that aren't reusable. Especially when starting out.

...hence there are aren't many good libraries out there to help in PHP. MS seems to have pulled it off, to some extent, with ASP.NET but they had alot of money to through at it and (hopefully) experienced developers.

Been thinking though - isn't the task of rendering content (by content I mean HTML, XML, WML etc) in many ways similar to SQL?

With persistence layers and data access objects, we can seperate SQL statements from the application logic in our code, as much as is possible. Among other things, this makes building SQL statements less error prone and more flexible / maintainable. It also may help to allow swapping from one data source to another.

For HTML (etc.) perhaps it's the same problem in the end, but more obvious as when you have a block of HTML in your code, it takes up more lines usually than an SQL statement. We want some kind of equivalent to what we've done with SQL so that generating HTML is easy and is again "farmed out" so that we can concentrate on application logic again.

And in a similar manner to database abstraction classes, we hope we can interchange HTML with XML, XML, SOAP etc. What's more we hope it will be browser independent...

Anyway, getting back down to earth, could be worth checking out phphtmllib http://phphtmllib.newsblob.com/ . Also been checking out the PEAR::HTML classes in more detail like HTML_Table - think they can make a good place to get started.

[Mike Borozdin]

function.php

<?
function show_products () {
  mysql_connect ( "localhost", "user", "password" );
  mysql_select_db ( "db" );
  $res = mysql_query ( "SELECT * FROM PRODUCTS
                        ORDER BY tile" );
  while ( $rec = mysql_fetch_array ( $res ) ) {
  ?>
      <tr>
         <td>
            <?=$rec["title"]?>
         </td>
         <td>
            <?=$rec["amount"]?>
         </td>
         <td>
            <?=$rec["price"]?>
         </td>
      </tr>
  <?
  }
}
?>

products.php (template)

<table border = "1" align = "center">
  <tr>
     <td>
        <b>Product</b>
     </td>
     <td>
        <b>Amount</b>
     </td>
     <td>
        <b>Price</b>
     </td>   
  </tr>
  <?=show_products ()?>
</table>

[/php]

Storing PHP code in templates is bad. Storing HTML code in the functions isn't good too. Are there any ways to improve the code?

[Dr Livingston]

You'd be better off using XML and XSL-T for this sort of thing.

Create an XML template. Query your database using a db api class, parse the XML file looking for specific tags, i.e. prod_name, prod_price, prod_qty.

Then replace these tags with each row of records from the database query, before you use XSL-T to convert to HTML.

[Captain Proton]

In find it funny.. Some people claim that template engines like Smarty contain too many 'logic' (if/else, foreach, etc) but they also blindly accept XML/XSLT as separation of code from content, while XSLT contains just as many if not more of this 'logic'.

It seems to me that a lot of people think that "separation of code from content" simply means "do not have any if/else or foreach in your templates but keep this in a PHP file". While in fact, "separation of code from content" originates from something called "separating business logic from presentation". Separating business logic from presentation is not about removing all if/else statements from a template, it is a facet of creating a layered, or N-tier, application.

</end short rant>

[samsm]

This is a good thread on the topic:
http://www.sitepointforums.com/showt...threadid=67849
Skip the first few (and last few) posts and you get to a debate on template systems.

[HarryF]

In find it funny.. Some people claim that template engines like Smarty contain too many 'logic' (if/else, foreach, etc) but they also blindly accept XML/XSLT as separation of code from content, while XSLT contains just as many if not more of this 'logic'.

Very true although XSL / XPath are internationally accepted standards and perhaps you have a better change of finding designers with thouse skills rather than knowledge of Smarty syntax. You'll probably also find tools (like XMLSpy) which make using XSLT fairly easy and theoretically make it easier to provide a designer with sample sample environment (i.e. data in XML form) to help with the design process.

It seems to me that a lot of people think that "separation of code from content" simply means "do not have any if/else or foreach in your templates but keep this in a PHP file". While in fact, "separation of code from content" originates from something called "separating business logic from presentation". Separating business logic from presentation is not about removing all if/else statements from a template, it is a facet of creating a layered, or N-tier, application.

Exactly. Personally I prefer calling the layer above the business logic the presentation logic layer rather than just the presentation layer (which I think is the browser itself).

[Mike Borozdin]

So best thing to solve my problem is XSL? Could you advice good books and articles about it? I've read Kevin's article and actually I didn't understand well.

[anode]

To expand on what Harry said, XSL is a whole different ballgame than your average templating engone. Other than the obvious advantages (being able to generate RTF, PDF, SVG, any kind of XML you want) XSL is easier to deal with for designers because...

• Its tree-like recursive nature. <xsl:template match = "mytag"> is much easier for a non-programmer to understand than the equivalent looping constructs.
• Real and superficial similarities to XHTML and CSS syntax. The CSS similarities may not be obvious until you look at things like CSS2 attribute selectors and compare them to XSL predicates.
• Being well-formed XML eases template creating and debugging with 3rd party tools. WYSIWYG XSL is easily feasible (though it will probably be quite different than WYSIWYG HTML.)
• Language independence. You can switch your back-end language and still use the same templates.

[mojavelinux]

Take it from a person who rolled out an XSLT solution for generating pages, there are problems with it when using it on a database driven site. Why?

Remember what Vincent said how "every problem can be solved by introducing an indirection?" but then went on to say that you should also "limit your number of indirections." Your data access object pulls information from a database into a result set, which can then be dumped into an array or passed into an iterator. Now, to make XSL work, you have to first put your data into XML format and then have your XSLT parse through it. At this point, why would you take the extra step to put it into XML just to convert it once again to XHTML? It doesn't make a lot of sense. Better would be to allow your web developer to make use of your iterators to make the template. XSLT is better if you are a client receiving data in XML and you reduce the indirection of having to parse the XML data to make a PHP array (such as RSS).

Point is, use a PHP template if you have data in a PHP data structure, use XSLT if you have data in an XML data structure, but don't convert from one data structure to another just to use a specific template language.

[moramata]

Have you looked at Eocene Application framework? It is a 100% php-based OO framework that is easy to use, yet flexible for changes to your needs. It uses a templating system that is simple but very fast. However, if you are more comfortable using your own templating system or Smarty, you can do so.
Check it out at
http://www.eocene.net

[mojavelinux]

I would change two things about this framework if I decided to use it. For one, I would strip out the use of PEAR:B and use Vincent's Eclipse instead. Second, PHP should be the template engine. I am still evaluting solutions, but perhaps eocene will be the answer with a few tweaks.

[Dr Livingston]

Well, I don't know about other developer's, though here is how I do it, in simple 4 easy steps:

1) Based on the logic process in current use, i.e. display a database query, grab the xml file. This file would have tags to transform to paragraphs, and proberly a table.

2) Parse the xml file, looking for specific tag(s). I use <tab-import /> for example. Once I find this, I execute a PHP function to generate content, i.e. database query.

This content is embedded within a tag, i.e. <tab-cell>..data here..</tab-cell> and the parsing continues.

3) Once complete, the xml file would now be a string.

4) Use the xslt file you have, and transform the xml string, in my case, this is outputted as plain HTML back to the application.

At the moment, I use a number of functions and it's rough looking, though I have begun to re-write the functions as a class.

Unfortunately, I cannot post the code in any way, shape or form - this would make the customer very nervous and seriously unhappy. And I'd be basically f***ed.

But I hope this help a lot.

The data generated going to the xml string (replacing <tab-import /> does not neccassary need to be just database queries - it could a drop down list, form validated inputs, etc etc).

This is the easiest way of using XML/XSL and PHP together to generate dynamic content that I can think of. What does other forum members think ?

[Zoef]

Mmmmmm don't know if I should play with the big boys here, but lets live dangerously...
I honestly cannot see what's so difficult for a designer in learning something like this:

<div id="article">
  <h2><?=$article['title']?></h2>
  <h4><?=$article['byline']?></h4>
  <p><?=$article['content']?></p>
</div>

If one managed to learn html, this shouldn't take more then 30' of explaining now, should it?

And isn't the overhead on the various XML solutions rather big?

Or am I missing the point here? Just my 2-pence...

Rik

[mojavelinux]

You are right on the money and going exactly where I am going with the ideas. I talked to my designer and he said he totally agrees that working with PHP statements is the way to go.

<rant>
First of all, people that say that the PHP templates are not valid xml are totally kidding themselves anyway half the time. There is no reason not to use the shortcut <?= $variable ?> to echo contents. Why do you say? Because you cannot have a processing instruction inside an attribute and all over the place I see

<a href="<?php echo $url; ?>">link</a>

Folks, that is NOT valid XML. So just get over it and make PHP templates and forget about the valid XML with templates. In the grand scheme of things, it really doesn't matter. It is a template, not an XML document.
</rant>

Sorry, had to inject there. The trick is figuring out how to feed the data to the designer in a standard way. In my current framework I am working on a standard method for laying this out, so that the designer can work with the data without having to know what is going on in the programming side. This just means coming up with a list of variable names, object instance names and functions/methods. For instance, in my 'main.php' template, the designer has the resource '$this' to work with. An example would be

<html>
  <head>
    <title><?= $this->getTitle(); ?></title>
  </head>
  <body>
    <h1><?= $this->getName() ?></h1>
    <div><?= $this->showMenu() ?></div>
    <div><?= $this->showContents() ?></div>
  </body>
</html>

...where '$this' is an instance of class Page. The methods 'showMenu()' and 'showContents()' would intialize some local variables and then include another similar PHP page for the block. For instance, the menu might look like

<?php for(; $menu->isDone(); $menu->next()) { $current =& $menu->getCurrent(); ?>
<a href="index.php?page=<?= $current['name'] ?>"><?= $current['title'] ?></a>
<?php } ?>

Again, I am still working on a model, but this is the direction I am going in, maybe it will spur some other ideas.

To answer the question of the overhead at XML, just look at my discussion of "indirection"

database -> database result -> XML -> XHTML

vs.

database -> database result -> XHTML

I think it is clear which is better.

[Travis]

Actually, using <?php echo $var; ?> is better than <?=$var?> because the latter assumes the short tags are on. Since they can be turned off in php.ini some hosts may not have them and they may actually be turned off be default someday. By using the longer way you assure that your script will work with everyone.

[DR_LaRRY_PEpPeR]

Originally posted by Trav
Actually, using <?php echo $var; ?> is better than <?=$var?> because the latter assumes the short tags are on. Since they can be turned off in php.ini some hosts may not have them and they may actually be turned off be default someday. By using the longer way you assure that your script will work with everyone.

thank you very much! saved me some typing.

[mojavelinux]

This is another common misconception. A simple .htaccess file with

php_value short_tags on

will solve that problem if not an

ini_set('short_tags', 1); 

at the top of your main include file (or application fusebox file).

So the point is really mute. But then again, do what works for you, and if the long tag works, the by all means use it. But if the argument is one of compatibility, it is not really worth using as an argument.

[DR_LaRRY_PEpPeR]

.htaccess could be disabled or the server may not be Apache. but you covered that. but you can't use that ini_set() in a file that uses short tags if short_tags are off.

also, i don't know much about XML, but won't having short_tags on mess up PHP when you have <?xml things? i thought that was the main reason for disabling short_tags.

finally, ini_set() could be a disabled function.

[mojavelinux]

Agreed that the server could have limitations, and I could go on to say how servers that disable that control prove more to be a problem of hosting choice, but no point in going on about it since it is a personal choice anyhow.

But, to briefly summarize the original statement, all I am saying is that if you are going to claim valid XML, just be sure that your processing instructions are in fact children of element nodes and not attribute nodes. My initial point was just that most people claim valid XML because they use long tags but then put the processing instruction (ie <?php ?>) inside the attribute.

Back to the discussion of php templates...

[aivarannamaa]

... and moreover, maybe some client doesn't have even PHP installed

Sorry, couldn't hold back that "clever" sentence I find <?=$stuff?> more beatiful than <?php echo $stuff ?> and also more like a template element (echo is procedural, but html is not). I think mojavelinux showed clearly that there's no real need to worry about compatibility problems.

Aivar

[DR_LaRRY_PEpPeR]

Originally posted by aivarannamaa
... and moreover, maybe some client doesn't have even PHP installed

huh?

I think mojavelinux showed clearly that there's no real need to worry about compatibility problems.

what about when you have <?xml tags when you're not in PHP mode?

[mojavelinux]

What I really think should happen is this. If the contents of <?php ?> are a one sided statement, such as <?php $foo ?> and not an assignment, such as <?php $foo = 'bar'; ?> then it should automatically echo to the screen. Many other embedded languages behave this way, and I which php would too. Then this whole short tags issue would end, because it is not a matter of what tag you use, it is a matter of what is contained inside of the tags. A single, one-sided statement should be understood to be a print statement. Simple as that.

Wishful thinking I guess...