Yeast, formerly known as JST-Templates, is an attribute based, double-model based, browser-side HTML template system. That is, Yeast templates are processed in the user's browser. The template engine, coded in JavaScript, is located in the browser.

Yeast continues with the version numbering of JST-Templates, so the first Yeast version is 2.3. If you are interested in the Yeast and JST-Templates evolution you can read this historical review.

A Yeast template looks like the following sample (you can see more samples in the samples section):

Click here to see the template in your browser

As any other HTML template, a Yeast template is an HTML document with "holes" where you can stick values. Yeast is designed to be practical for the generation of HTML Web pages, following the, named by us, Double Model Approach.

The Double Model Approach

Using Yeast you separate the HTML designers from the programmers in a radical way. More than any other template technology, Yeast documents (views) are not dependant on any aspect of the application's model. The HTML author designs application pages without any knowledge of the data origin or structure in the application that resides in the server. He uses its own model of the application, which servers only for presentation purposes. We call this model designer's model. Therefore a Yeast template only depends on its own designer's model, designed and populated with test values by the same HTML designer that develops the template. In this way, the designer is completely independent from the rest of the development team (programmers). In fact he does not even need a server in order to see the appearance of his designs.

On the other side, there are the programmers, who are designing and implementing the application model (programmer's model). When a programmer receives a Yeast template, his only task is to develop a set of transformers to adapt the business model to the designer's model. The processing of a Yeast template is as simple as change the test data included in the template model section with the actual data retrieved from the application.

With Yeast, everybody works on what they are good at. Designers can change the appearance of a page without programmers having to change or recompile code; and programmers can change the application, and even the business model, without the designers having to patch any of the view pages. This is because the application logic (programs) and the page design (Yeast templates) are completely separated, and adapted by the transformers (the only change sensitive part of the system). The good news is that transformers are extremely simple classes, and in many cases they came for free with the Yeast Server infrastructure.

This separation is useful even for projects where the programmer and the HMTL page author is the same person, since it helps to keep the application clear and easily maintainable.

Yeast and JavaScript

An important feature of Yeast is the use of JavaScript. JavaScript is used to define the designer's model, to populate it with test values, and to fill in the "holes" that the designer places in the HTML page as placeholders for dynamic data. Actually Yeast has no associated programming language, like other HTML templates have. Yeast defines a set of non-standard HTML-attributes that can be inserted in the HTML elements of the template. These attributes are processed by the JavaScript engine to perform the page rendering. This is relevant for designers, who do not need to learn any other template language. They get by with their familiar tools: HTML and JavaScript. Besides, they can work disconnected from the applications server in order to see their designs working. In fact, Yeast is valid for the development of standalone HTML documents.

As a surprising conclusion, Yeast templates are full-previewable, and always remain previewable. The designer can develop Yeast templates with his favorite authoring tool. He can see what he is designing, and edit the templates directly, easing the maintenance in a radical way.