Neue Template-Eingine für FLOW3 und TYPO3 4.x
Fluid – Templating leicht gemacht

Sebastian Kurfürst, t3n Nr. 16 (11/2009) | 4 Kommentare |
7 tweets  tweet this!
 |  Teilen

t3n Magazin kaufen!

Mit Fluid steht TYPO3-Entwicklern ab Version 4.3 eine neue Template-Engine zur Verfügung, die auch Bestandteil von FLOW3 ist. Sie ist leicht zu lernen, sehr flexibel und extrem erweiterbar. Der folgende Artikel erläutert Grundlagen und stellt die Konzepte hinter Fluid vor.

TYPO3-Entwickler setzen beim Thema Templating meist auf die populäre markerbasierte Variante, die schon sehr lange fester Bestandteil von TYPO3 ist. Andere haben bereits mit Smarty, PHPTAL oder anderen Template-Engines gearbeitet und fragen sich nun womöglich, weshalb es noch einer weiteren Template-Engine bedarf. Ein Beispiel zur Ausgabe einer Liste von Blogposts soll verdeutlichen, woran es bislang hakt:

Klassisches Templating

// Im Template

###CONTENTS###
<ul>
###SUBELEMENT###
    <li>###TITLE###</li>
###SUBELEMENT###
</ul>
###CONTENTS###

// in PHP

$subEl = getSubpart(“SUBELEMENT“);
$out = ‘‘; foreach ($recordList as $record) {
    $out .= substituteMarker($subEl, ‘TITLE‘, $record[‘title‘]);
}
return substituteSubpart($template, ‘SUBELEMENT‘, $out);

Listing 1

Wie man sieht, ist sehr viel Code für eine einfache Aufgabe wie die Ausgabe einer Liste notwendig – außerdem existiert keine saubere Trennung zwischen Präsentations- und Anwendungslogik.

Nachdem klar war, dass TYPO3 in Zukunft eine neue Templating-Lösung benötigt, hat das Kernentwickler-Team viele verschiedene Template-Engines unter die Lupe genommen – alle hatten jedoch gemeinsame Nachteile:

  • nicht komplett objektorientiert programmiert (PHP 4)
  • komplizierte oder unlogische Syntax
  • PHP im Template erlaubt
  • mangelhafte und unsaubere Erweiterbarkeit

Hier setzt Fluid [1] an: Die Template-Engine besitzt eine neue, intuitive Syntax, die extrem flexibel und erweiterbar ist, aber trotzdem leicht erlernt werden kann. Das folgende Beispiel soll anhand eines Blogs verdeutlichen, wie effizient Entwickler mit Fluid arbeiten können.

Objekte traversieren leicht gemacht

Im Controller können Variablen mit Hilfe von „$this->view->assign('blogTitle', 'Mein erster Blog');“ zugewiesen werden. Um den Inhalt einer Variablen im Template auszugeben, ist die {...}-Syntax vorhanden: {blogTitle}.

Einfache Variablenausgabe

// Im Controller:
$this->view->assign('blogTitle', 'Mein erster Blog');
// Im Template:
<h1>{blogTitle}</h1>

Listing 2

Darüber hinaus ist es möglich, sich „durch Objekte durchzuhangeln“, indem man einen Punkt verwendet: „{blog.title}“ führt zu einem Aufruf von „$blog->getTitle()“, „{post.author.name}“ analog zu „$post->getAuthor()->getName()“.

Objekte traversieren

// Im Controller:
$this->view->assign('blog', $blog);
// Im Template:
<h1>{blog.title}</h1>

Listing 3

Standard-ViewHelper nutzen

Nun wollen wir das obige Beispiel erweitern und eine Liste von Blogpostings ausgeben. Dafür greift man in Fluid auf so genannte „ViewHelper“ zurück. Im Template werden diese mit Hilfe von speziellen Tags aufgerufen. Das folgende Listing gibt alle Beiträge eines Blogs aus:

ViewHelper aufrufen

<f:for each="{blog.posts}" as="post">
	<h2>{post.title}</h2>
	<p>{post.teaser}
		<f:actionlink action="show" arguments="{post : post.uid}">mehr...</f:actionlink>
	</p>
</f:for>

Listing 4

Das spezielle Tag „<f:for>“ ist ein solcher ViewHelper. Mit ihm kann über Arrays iteriert werden, um die einzelnen Elemente auszugeben. Im obigen Beispiel gibt es noch einen zweiten ViewHelper namens „<f:actionlink>“, der verwendet wird, um einen Link auf die Detailansicht auszugeben.

Häufig benötigte ViewHelper wie Schleifen, Links, Formulare oder Localization [2] liefert Fluid mit. Jede Extension kann allerdings ihre eigenen ViewHelper definieren und nutzen.

» weiterlesen

1 2

Beitrag mit anderen teilen:

  • Twitter
  • Facebook
  • FriendFeed
  • t3n Social News
  • del.icio.us
  • MisterWong.DE
  • Digg
  • Identi.ca
  • Technorati
  • RSS
  • E-mail this story to a friend!

4 Antworten zu “Neue Template-Eingine für FLOW3 und TYPO3 4.x: Fluid – Templating leicht gemacht”

  1. #1 Mirco

    GENAIL! Danke für den Artikel. Das Prinzip dieser Templates, den ViewHelperl etc. kenne ich bereits vom ZendFramework, wo es grandios funktioniert. Ich hoffe doch stark, das auch der Rest vom T3-Core mit den nächsten Versionen auf MVC umgebaut wird (das soll ja mit FLOW kommen soweit ich weiß). Bleibt am Ball, danke :-)

  2. #2 Steffen Müller

    Die API scheint sich ein wenig verändert zu haben:

    Statt
    class Tx_Blog_ViewHelpers_GravatarViewHelper extends Tx_Fluid_Core_AbstractViewHelper {
    muss es heißen:
    class Tx_Blog_ViewHelpers_GravatarViewHelper extends Tx_Fluid_Core_ViewHelper_AbstractViewHelper {

  3. #3 Sebastian Kurfürst

    Hallo Steffen,

    vielen Dank für die Korrektur, es wurden da noch ViewHelper in andere Positionen geschoben, da der Artikel weit vor Fluid 1.0 erschienen ist.
    Jetzt, mit Fluid 1.0, erachten wir die öffentliche API als stabil an.

    Viele Grüße,
    Sebastian

  4. #4 TYPO3: Meine ersten Erfahrungen mit Extbase und Fluid | Web-aktiv Blog | TYPO3, Wordpress, Webentwicklung, Internetseiten, Web-Projekte, Fulda, Kassel, Bad Hersfeld,

    [...] holte ich mir in den Fachartikeln der t3n: Die Zukunft der Extensionentwicklung, von Jochen Rau Fluid: Templating leicht gemacht, von Sebastian Kurfürst Extension-Entwicklung mit Extbase und Fluid, von Patrick Lobacher und [...]

7 Tweets:

  • Möchten Sie auch hier erscheinen? Dann hier Re-Tweeten

Du hast eine Ergänzung oder Frage zum Artikel? Teile sie jetzt mit!