Home » Articles » Template introduction » Introduction

Template introduction

In this article, we discuss the PAX Template system, and create examples of using templates for various purposes.

PAX Template system

The PAX template system is a core part of the PAX library, it enables us to render vibrant and responsive widgets with relative ease. The template system has a rather unique feature: partial rendering. In normal template solutions, this would be inappropriate, but in the case of browser based rendering, this feature is most valuable, as it makes it very simple to create complex user interfaces.
A template is usually just a string, with PAX template tags. The tags available are:

  • [:
    Start tag: this executes inline javascript code.
  • :]
    End tag: all tags are completed with this tag.
  • [:=
    Value tag: returns the value of a given variable.
  • [:_
    Before tag: runs code before template rendering. Used for creating an object to be accessed during rendering.
  • [:.
    After tag: runs code after template rendering. Used to execute javascript after rendering.
  • [:p(name)
    Partial tag: starts part of a template that can be rendered partially, (name) is the reference.
  • p:]
    Partial end tag: End of partial template rendering.
The reason we're using such unusual tags is to ensure we don't interfere with server side template systems; this way there can be no confusion about where a template tag will be rendered: on the server, or on the client side.
You should note that most of the examples in this article are available in the demo directory of the PAX download package.
Read on for the "hello world" example!