Python Web Templating Battle

by Ivan Teoh Python Web Templating Battle

• Introduction • 5 Web Templates ◦ Features ◦ Template
Syntax ◦ Template Loader • Summary Content

PretaWeb specialises in the provision and support of high availability,
dedicated and SaaS CMS solutions for government Pretaweb

The opinions expressed herein are my own personal opinions and
do not represent my employer's view in any way. Disclaimer

Web Template A web template is a tool used to
separate content from presentation in web design. It is a basic component of a web template system. A Web template system describes the software and methodologies used to produce web pages. Such systems process web templates, using a template engine. - Wikipedia

Templates • Django Template Language (http://www. djangoproject.com/) • Chameleon (http://chameleon.repoze.org/)
• Jinja2 (http://jinja.pocoo.org/) • Diazo and XSLT (http://docs.diazo.org/) • Mako (http://www.makotemplates.org/)

Django Template Language • text based template language • define
variables and basic control logic • used in Django web framework • custom tag and filter in Python code

Django - Template Syntax {% extends "base_generic.html" %} {% block
title %}{{ section.title }}{% endblock %} {% block content %} <h1>{{ section.title }}</h1> {% for story in story_list %} <h2> <a href="{{ story.get_absolute_url }}"> {{ story.headline|upper }} </a> </h2> <p>{{ story.tease|truncatewords:"100" }}</p> {% endfor %} {% endblock %}

Django - Custom Filter def lower(value): # Only one argument.
"""Converts a string into all lowercase""" return value.lower() register.filter('lower', lower) {{ somevariable|lower }}

Django - Template loader from django.template import Context, Template t
= Template("My name is {{ my_name }}.") c = Context({"my_name": "Ivan"}) t.render(c) def some_view(request): # ... return render_to_response('my_template.html', my_data_dictionary, context_instance=RequestContext(request))

Chameleon • HTML/XML template engine • compiles into Python bytecode
• the language used is page templates, originally a Zope invention • uses Python as the default expression language • used by Pyramid, Zope, Plone and Grok projects

Chameleon - Template Syntax <html xmlns="http://www.w3.org/1999/xhtml"> <body>  <div tal:repeat="item range(10)"> <p tal:condition="repeat.item.even">Even</p> <p tal:condition="repeat.item.odd">Odd</p> </div>  <div> <?python import pdb; pdb.set_trace() ?> <ul tal:switch="len(items) % 2"> <li tal:case="True">odd</li> <li tal:case="False">even</li> </ul> </div> </body> </html>

Chameleon - Attribute Language <p namespace-prefix:command="argument"> ... </p>

Chameleon - Namespace Prefixes <html xmlns="http://www.w3.org/1999/xhtml" xmlns:tal="http://xml.zope.org/namespaces/tal" xmlns:metal="http://xml.zope.org/namespaces/metal" xmlns:i18n="http://xml.zope.org/namespaces/i18n"> ...
</html> <html xmlns="http://www.w3.org/1999/xhtml"> ... </html>

Chameleon - Switch and case <ul tal:switch="len(items) % 2"> <li
tal:case="True">odd</li> <li tal:case="False">even</li> </ul>

Chameleon - Repeat <div tal:repeat="item range(10)"> <p tal:condition="repeat.item.even">Even</p> <p tal:condition="repeat.item.odd">Odd</p>
</div>

Chameleon - Expression Type <div tal:repeat="item range(10)"> …. </div>

Chameleon - Embedded Python Code <?python import pdb; pdb.set_trace() ?>

Chameleon - Comment statement

Chameleon - Extension import ast def uppercase_expression(string): def compiler(target, engine):
uppercased = self.string. uppercase() value = ast.Str(uppercased) return [ast.Assign(targets= [target], value=value)] return compiler from chameleon import PageTemplate PageTemplate.expression_types ['upper'] = uppercase_expression <div tal:content="upper: hello, world" />

Chameleon - Template loader import os path = os.path.dirname(__file__) from
chameleon import PageTemplateLoader templates = PageTemplateLoader(os.path.join(path, "templates")) template = templates['hello.pt'] >>> template(name='John') '<div>Hello, John.</div>'

Jinja2 • function/macros • text based template language • compiles
down to the python bytecode • heavily inspired by Django and Python • general purpose template language

Jinja2 - Template Syntax <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en"> <head> <title>My Webpage</title> </head> <body> <ul id="navigation"> {% for user in users if not user.hidden %} <li>{{ user.username|e }}</li> {% endfor %} </ul> {# this is comment #} <h1>My Webpage</h1> {{ my_variable }} </body> </html>

Jinja2 - Variables {{ my_variable }}

Jinja2 - Filters {{ user.username|e }}

Jinja2 - Comments {# this is comment #}

Jinja2 - Control Structures {% for user in users if
not user.hidden %} <li>{{ user.username|e }}</li> {% endfor %}

Jinja2 - Call {% macro render_dialog(title, class=’dialog’) -%} <div class="{{
class }}"> <h2>{{ title }}</h2> <div class="contents"> {{ caller() }} </div> </div> {%- endmacro %} {% call render_dialog(’Hello World’) %} This is a simple dialog rendered by using a macro and a call block. {% endcall %}

Jinja2 - Template Loader from jinja2 import Environment, PackageLoader env
= Environment(loader=PackageLoader('yourapplication', 'templates')) template = env.get_template('mytemplate.html') print template.render(the='variables', go='here')

Diazo and XSLT

Diazo - theme.html <html> <head> <title>My own Diazo</title> </head> <body>
<h1 id="title">My own Diazo home page</h1> <div id="content">  Lorem ipsum ... </div> </body> </html>

Diazo - rules.xml <rules xmlns="http://namespaces.plone.org/diazo" xmlns:css="http://namespaces.plone.org/diazo/css" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <theme href="theme.html" />
<drop theme="/html/head/title" /> <drop css:theme="#title" css:if-content="#content.wide" /> <replace css:theme-children="#content" css:content-children=".content" /> </rules>

Diazo - Directives <theme /> <notheme /> <replace /> <before
/> <after /> <drop /> <strip /> <merge /> <copy />

Diazo and XSLT <replace css:theme="#details"> <dl id="details"> <xsl:for-each css:select="ul#details >
li"> <dt><xsl:copy-of select="a" /></dt> <dd><xsl:copy-of select="img" /></dd> </xsl:for-each> </dl> </replace>

Diazo - Compilation $ bin/diazocompiler -o theme.xsl -r rules.xml

Diazo - Test Run $ bin/diazorun -o output.html -r rules.xml
content.html

Diazo - Template Loader <configure xmlns="http://namespaces.zope.org/zope" xmlns:i18n="http://namespaces.zope.org/i18n" xmlns:plone="http://namespaces.plone.org/plone" i18n_domain="plonetheme.custom">  <plone:static directory="static" type="theme" /> </configure>

Mako • is an embedded Python (i.e. Python Server Page)
language • text based template language • compiles down to the python byte-code • function/macros • control structures constructed from real Python code (i. e. loops, conditionals) • straight Python blocks, inline or at the module-level

Mako - Template Syntax <%inherit file="base.html"/> <% rows = [[v
for v in range(0,10)] for row in range(0,10)] %> <table> % for row in rows: ${makerow(row)} % endfor </table> ## this is a comment. <%def name="makerow(row)"> <tr> % for name in row: <td>${name}</td> % endfor </tr> </%def>

Mako - Module-level Blocks <%! import mylib import re def
filter(text): return re.sub(r'^@', '', text) %>

Mako - Template Loader from mako.template import Template mytemplate =
Template(filename='/docs/mytmpl.txt') print mytemplate.render() from mako.template import Template mytemplate = Template(filename='/docs/mytmpl.txt', module_directory='/tmp/mako_modules') print mytemplate.render()

Summary

Discussion / Q & A @ivanteoh http://www.pretaweb.com

Thank You

Python Web Templating Battle

Python Web Templating Battle

Other Decks in Programming

Featured

Transcript