Die grasgrün media GbR betreibt seit Jahren das Portal traumziel-mv.de.

Die beiden Gesellschafter des Unternehmens sind leidenschaftliche Wanderer und Naturliebhaber und haben diese Leidenschaft zu ihrem Beruf gemacht. Neben dem Portal Traumziel-MV werden Bücher veröffentlich und touristische Veranstaltungen geplant und umgesetzt.

Das Portal Traumziel-MV.de stellt über 300 Touren aus den Rubriken Wandern, Wasserwandern und Tierbeobachtungen detailliert vor. Alle Touren wurden von den beiden Betreibern selbst erwandert, umfangreich beschrieben und bebildert.

Aus Flash wird TYPO3

Das ursprüngliche Portal war auf Basis einer MySQL-Datenbank mit Macromedia Flash implementiert worden. Zum Zeitpunkt der Gründung des Portals war dies die einzig sinnvolle Möglichkeit, eine vor allem auf Bildwelten sich gründende, hochwertige und intuitiv bedienbare Benutzererfahrung zu vermitteln.

Bekanntermaßen wird die Flash-Technologie aber zunehmend weniger im Internet unterstützt – namentlich von Apple.

Bisherige Flash-Anwendung – Regionenauswahl für Wandertouren

Bisherige Flash-Anwendung – Darstellung einer Wandertour

Neue Anforderungen in Bezug auf die Sichtbarkeit in Suchmaschinen und für die mobile Nutzbarkeit des Portals machten einen Relaunch erforderlich. Damit sollten gleichzeitig die Grundlagen für neue Funktionen für eine nachhaltige Monetarisierung des Portals sowie für weiterführende Nutzungskonzepte geschaffen werden, z. B. in Richtung Community und von Nutzern erzeugten Inhalten.

Im Einzelnen wurde folgende Ziele angestrebt:

• Eliminierung von Flash als veralterte Technologiebasis
• vollständige mobile Benutzbarkeit
• gute Erfassbarkeit von Suchmaschinen mit der Zielstellung, ein
  gutes Ranking für relevante Keywords zu erreichen
• Einführung eines Premiumbereiches
• zukunftsfähige Technologiebasis für stabilen Betrieb, Wachstum und
  weiteren funktionalen Ausbau

Als technologische Plattform sollte nun ein Content Management System (CMS) dienen. Anfängliche Versuche auf Basis des CMS „Contao“ führten recht schnell zu der Erkenntnis, dass eine leistungsfähigere und vor allem flexiblere Entwicklungsplattform gefunden werden musste.

Die Entscheidung viel auf TYPO3. Hauptkriterium für die Entscheidung für TYPO3 war das seit der TYPO3-Version 4.7 verfügbare Programmier-Framework für Erweiterungsmodule „Extbase“.

Extbase ist eine Rückportierung des für das Content Managmenet System TYPO3 Neos entwickelte Framework TYPO3 Flow auf das tradtionelle TYPO3 CMS. Mit Extbase steht das derzeit modernste PHP-Framework für CMS-Erweiterungen zur Verfügung.

TYPO3 Flow und Extbase

Flow und Extbase folgen, wie viele andere aktuelle Frameworks auch, dem MVC-Paradigma (Model-View-Controller).

Model-View-Controller Paradigma (MVC)

Domain Driven Design

Wichtigstes Konzept von Flow und Extbase ist das „Domain Driven Design“ (DDD).

Mit DDD wird eine Methode zur Modellierung komplexer, objektorientierter Softwaresysteme bezeichnet. Im Zentrum steht die Anwendungs-Domain, die fachliche Logik der zu lösenden Aufgabenstellung – in unserem Falle touristische Aktivitäten in Form von Wandern, Wasserwandern und Tierbeobachtungen sowie touristische Orte und Gastgeber.

Das Konzept geht auf Eric Evans zurück und wird in dem Buch Domain-Driven Design: Tackling Complexity in the Heart of Software ausführlich beschrieben.

Während andere MVC-Frameworks die Komponente „M“, also das Model, häufig als Datenbankschnittstelle interpretieren, indem zum Beispiel ein Active-Record-Entwurfsmuster zugrunde gelegt wird, wird in Flow und Extbase das Model durch die Anwendungs-Domain gebildet.

Den Domain-Models beigestellt sind Repository-Objekte, die dazu dienen, Domain-Objekte bereitzustellen, z. B. auf Basis einer Abfrage mit Filterkriterien. Die Repository-Objekte bedienen sich einer abstrakten Persistenz-Schicht, d. h. wo Domain-Objekte gespeichert sind, ob in einer Datenbank, in XML-Dateien oder in der Cloud, spielt auf der Domain-Ebene keine Rolle.

Domainobjekte in traumziel-mv

Domain-Model und Repository

 Moderne Konzepte der Softwareentwicklung

Neben dem Domain Driven Design implementiert das Framework weitere moderne Software-Techniken:

• Dependency Injection – lose Kopplung zwischen Objekten

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

class HikingController extends ... {
 
    /**
     * hikingRepository
     *
     * @var \Qbus\Traumzielmv\Domain\Repository\HikingRepository
     * @inject
     */
    protected $hikingRepository;
 
    public function listByRegionAction(Region $region) {
 
        $hikings = $this->hikingRepository->findByRegion($region);
        ...
    }
}

• AOP – Aspect Oriented Programming – Modularisierung von modulübergreifenden Aspekten, wie z.B. Logging, Security usw.
  • AOP gibt es nur in Flow, nicht in Extbase
• Signal-Slot – Implementierung des Observer Patterns für Event-gesteuerte Abläufe
• Persistence
  • basiert in Flow auf den Object Relational Manager (ORM) Doctrine
  • in Extbase auf der Typo3 Datenbank API

1
2
3
4
5
6
7

public function addActivityAction(Pin $pin, Activity $activity)
{
    ...
    $pin->addActivity($activity);
    $this->pinRepository->update($pin);
    ...
}

•  Annotationen – weniger Code, lesbarer Code, wartbarer Code
  • z. B. für Validierung
  • Relationen zwischen Objekten (1:n, m:n usw)
  • Object-Property – Database-Field Mapping
  • Objekttyp (singleton, prototype, session)
  • AOP-Steuerung
  • eigene Annotationen

1
2
3
4
5
6
7
8
9
10
11
12
13

class Pin extends \TYPO3\CMS\Extbase\DomainObject\AbstractEntity {
	...
 
	/**
	 * Datetime until the pin is valid
	 *
	 * @var \DateTime
	 * @validate NotEmpty
	 * @validate(type="DateTime", options={"locale"="de_DE"})
	 */
	protected $validTo;
 
	...

Fluid

Eine weitere Komponente des Extbase- (und Flow-) Frameworks ist die Template-Engine „Fluid“. Fluid setzt den „View“-Bestandteil des MVC-Frameworks um. Ein View besteht aus

• Layout
• Templates und
• Partials

Bestandteile eines Fluid Views: Layout, Templates und Partials

Fluid basiert auf in PHP geschriebenen ViewHelpern, die im View in Form von XML-kompatiblen Tags genutzt werden können. Solche ViewHelper können beliebig in einer Anwendung implementiert werden und erweitern so die im View verfügbaren Instrumentarien. Die Views können in Layouts, Templates und Partials strukturiert werden.

Nachfolgend einige Fragmente eines Fluid-Templates:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

{namespace tzmv=Qbus\Traumzielmv\ViewHelpers}
...					
<f:security.ifHasRole role="Gastgeber">
    <f:then>
        <li>
           <f:link.page pageUid="157" ...>
              <i class="fa fa-power-off"></i> Abmelden
           </f:link.page>
        </li>
    </f:then>
    <f:else>
	  ...
    </f:else>
</f:security.ifHasRole>	
<nav id="navigation">
    <f:cObject typoscriptObjectPath="lib.extTzmv.mainMenu"/>
</nav>
<f:render section="headerMenu" />
 
<f:comment>Seiteninhalt</f:comment>
<div id="main">
    <div class="container">
	<f:render section="content" />
    </div>
</div>

Ein einfachster ViewHelper könnte so aussehen:

1
2
3
4
5
6
7
8
9
10
11
12

class BoolViewHelper extends AbstractViewHelper {
 
    /**
     * returns Ja/Nein due to the boolean input value
     *
     * @param boolean $value
     * @return	void
     */
    public function render($value) {
        return ($value) ? 'Ja' : 'Nein';
    }
}

Die Benutzeroberfläche von Traumziel-MV zu implementieren setzt eine solche leistungsfähige und dynamisch gut aussteuerbare Template-Engine voraus. Durch die ViewHelper können komplexe Darstellungsprobleme gut strukturiert und wieder verwendbar auf die PHP-Ebene verlagert werden. Ebenso können wiederkehrende Template-Bestandteile in Partials ausgelagert werden. So bleibt trotz der Komplexität auf der Darstellungsebene die Template-Struktur überschaubar und damit auch pfleg- und erweiterbar.

Fazit

Extbase und TYPO3 erwiesen sich als hervorragend geeignet, die Aufgabenstellung umzusetzen. Neben den spezifischen Traumziel-MV-Extbase-Erweiterungen war es sehr einfach, den von den Erweiterungen verwalteten Touren, Gastgebern usw. auch reguläre CMS-Inhalte, also Inhaltsseiten und Artikel zuzuordnen und diese in kontextbezogenen Menüs in den Traumziel-MV-Objekten verfügbar zu machen.

Die objektorientierte Modellierung der Anwendungs-Domain erwies sich als überschaubare Aufgabenstellung, wenngleich die allgemeine Komplexität von Typo3 die eine oder andere Herausforderung darbot.

Als bei weitem aufwändigster Teil des Relaunches gestaltete sich der Aufbau der Benutzeroberfläche.

Wenngleich Fluid dafür ein leistungsfähiges Instrumentarium anbot, war die Umsetzung einer intuitiven Benutzeroberfläche, die sich vor allem auch flexibel für mobile Endgeräte darstellen sollte, eine komplexe, aufwändige und zeitraubende Aufgabenstellung.

Weiterführende Quellen

• Zukunftssichere TYPO3-Extensions mit Extbase und Fluid
• TYPO3 Extbase: Moderne Extension-Entwicklung für TYPO3 CMS mit Extbase & Fluid
• Domain-Driven Design: Tackling Complexity in the Heart of Software
• Domain-Driven Design Reference: Definitions and Pattern Summaries
• Implementing Domain-Driven Design