Alex Rivera | Logout

Combine jQuery and Zen-Coding php ports to emulate client side programming style on server side scripts

Asked 2011-04-15T21:12:44.713
10

When I write client side code, I use HTML/CSS/JavaScript and lately jQuery to both speed up coding, and use improved methods to achieve the same goal.

In my text editor I use zen-coding to speed up the writing of code, and also to avoid errors. I was looking at zen-coding as a jQuery plugin for a while, but it has a fatal flaw, that you want the HTML to be written and sent to the client plain before any javascript kicks in.

Although we can use JavaScript servers (env.js or node.js) and therefore do a lot of development server side using JavaScript and jQuery, I am not comfortable moving over yet as it is an emerging technology, and has many differences and drawbacks (and also some major advantages).

I want to continue using PHP server side, but develop in the way I am most comfortable with, and familiar with which is client side JavaScript.

Therefore - I have been looking into QueryPath which is a PHP port of jQuery that aims to take the best and most relevant parts of jQuery and re-work it to suit the server environment.

That is all great, and I have now been looking at two PHP classes capable of parsing zen-coding which when combined acts as a great templating engine and also avoids errors in my code.

The problem I am having is that neither zen-coding parsers support anywhere near a full set of zen-coding features.

So finally my questions (sorry for the rather lengthy intro)

  1. Is there a better server side zen-coding parser I can use in my PHP code?
  2. Is there a good (very concise and full featured) alternative templating system to using zen-coding? (which I know is not originally designed for this task)
  3. Is there a better approach I should take to achieve my ultimate goal of narrowing the divide between the way I code client side and server side?
  4. Is there a PHP library that implements a load of utility functions that by using will enhance the security/performance of my
Edit
Report

3 Answers

1

I'm not sure to understand your question, but I usually have this simple approach:

<?php

ob_start();

$config->js[] = 'js/jquery.js';

?>

<h1>
    <del>Zen Coding and jQuery - Server Side</del>
    <ins>HTML and PHP :-)</ins>

</h1>
<p>
    This has all been implemented <del>as a php port of JavaScript libraries</del> 
    <ins>in php</ins>
<span class="comments">
    <a href="mailto:this@comment.com">
        send a comment
    </a>
</span>
</p>
<script type="text/javascript">
    $(function(){ alert("just decided to use some jQuery") })
</script>

<?php $content = ob_get_clean() ?>

<?php require 'layout.php' ?> 

Some points:

  1. ob_start turn on the output buffer (the output is not sent to the client but stored in an internal buffer)
  2. $config->js[] = 'js/jquery.js'; will say to the layout to add a new script tag
  3. Then there is the plain HTML that have to be decorated with the layout
  4. <?php $content = ob_get_clean() ?> get the output stored in the internal buffer and assign it to a variable.
  5. <?php require 'layout.php' ?> will include the layout with the main HTML structure and some logic to print metas, title, <link> tags, <script> tags, and so on... The layout will contain a <?php echo $content ?> to print the page content.

The point 1, 4 and 5 can be delegated to a Front Controller, so the view can be just:

<?php

$config->js[] = 'js/jquery.js';

?>

<h1>
    <del>Zen Coding and jQuery - Server Side</del>
    <ins>HTML and PHP :-)</ins>

</h1>
<p>
    This has all been implemented <del>as a php port of JavaScript libraries</del> 
    <ins
answered 2011-04-15T22:54:06.217
0

I think that you are entirely missing the point of ZenCoding. ZenCoding is meant to be integrated in your editor, not in your application. It's a way of quickly writing HTML using fewer keystrokes and with fewer errors. Your commented test code doesn't look all that usable to me. I prefer the plain HTML version.

If speed and quality of writing plain HTML is an issue for you, perhaps it's time to switch to a better editor? One with support for ZenCoding, auto-balancing HTML tags, autocompletion, snippets/templates, etcetera? I have configured Vim to do all this for me. I've been told StormPHP is also quite good.

answered 2011-04-28T05:43:43.123
0

I'm considerably biased in my answer, as I am the author of QueryPath, but I like what you are trying to do. (It's always thrilling to see my code used in a way I never anticipated.)

QueryPath has an extension mechanism. Using it, you can add methods directly to QueryPath. So you could, for example, write a simple plugin that would let you replace qp()->find()->append(zp()) with something like qp()->zp($selector, $zencode);.

You can take a look at the extensions in QueryPath/Extensions and see how they work. (QPXML.php is an easy one to grok.)

If you do end up building (and releasing) a solution, please let me know.

answered 2012-05-23T02:37:26.790

Your Answer