Headless TYPO3 : Was ist das und wie benutzt man es?

TYPO3 Headless ist ein solcher Ansatz, der sich aufgrund seiner innovativen Fähigkeit, herausragende digitale Erlebnisse zu liefern, immer größerer Beliebtheit erfreut.

Kennen Sie das?
Laut Contentstack wird die Adoptionsrate von Headless CMS erwartet im nächsten Jahr zu verdoppeln.

Mit interaktiven und einzigartigen Frontend-Designs und schnell ladenden Websites. Mit dem Engagement von TYPO3 und seiner API-first Architektur können Inhalte überall genutzt und dargestellt werden.

Lesen Sie weiter, um mehr über TYPO3 Headless CMS zu erfahren. Glauben Sie mir, es ist interessant! Schnappen Sie sich eine Tasse Kaffee und lesen Sie weiter!

Wenn Sie eine Seite auf einer TYPO3-Site laden, führt der Server einen Code aus, der einen für das Frontend entwickelten Code erstellt. Dieses Dokument wird dann an Ihren Browser gesendet. Und so werden dann TYPO3 und Web-Apps, die auf die gleiche Weise funktionieren, als Server-seitige Apps bezeichnet.

Grundsätzlich ist ein Headless-Ansatz in unserer Multi-Device-Welt sehr wertvoll geworden. Headless Content Management bedeutet, dass das CMS ausschließlich für die Eingabe, Bearbeitung und Sortierung von Inhalten im Backend zuständig ist. Ein Headless-System sollte hochgradig zugänglich sein, und zwar unabhängig von der optischen Wirkung des Frontends.

Wie kommen also die Inhalte in einem Headless-System in die Welt hinaus? Nun, auf die Inhalte in der Datenbank wird über RESTful-API-Aufrufe zugegriffen. Das bedeutet, dass er überall dort angezeigt werden kann, wo er aufgerufen wird, ohne Vorlagen oder Plugins. Damit lässt sich eine herkömmliche browserbasierte Website oder fast alles andere im IoT erstellen.

Im Detail erklärt, kann man sagen, dass TYPO3 als Backend-System dient. Das Frontend, das der Client sieht, ist von TYPO3 getrennt. Daher kommt auch der Name "headless" - TYPO3 hat nicht mehr die oberste Schicht, also den Kopf ;), sondern stellt nur noch die APIs zur Verfügung, die das Frontend als Inhaltsquellen nutzt.

TYPO3 kann am besten als Headless CMS dienen. Sie fragen sich sicher, warum das so ist?

Der Grund dafür ist, dass TYPO3 Out-of-Box-Funktionalitäten hat, die die meisten der erforderlichen Website-Notwendigkeiten haben. Es ist eines der ausgereiftesten CMS und kann gut mit anderen fantastischen APIs zusammenarbeiten, um eine perfekte TYPO3 Headless Website zu erstellen.

Die TYPO3-Community arbeitet sehr intensiv daran, dass TYPO3 ein großartiges API-gesteuertes CMS wird. Im Jahr 2019 wurde eine "TYPO3 Headless Initiative" ins Leben gerufen. Ihr Ziel war es, die Entwicklungsanstrengungen zu koordinieren, um TYPO3 zu einem vollständig headless CMS zu machen.

Das ultimative Ziel von TYPO3 Headless ist es, eine Reihe von APIs vorzubereiten, die von TYPO3 an Ihre bevorzugten JavaScript-Frameworks wie ReactJs, VueJs, AngularJs, etc. übergeben werden.

Zum Zeitpunkt des Schreibens dieser Zeilen wurden enorme Fortschritte gemacht, die es TYPO3 ermöglichen, Inhalte über APIs zu liefern und zu empfangen.

Das ist alles, was wir über TYPO3 Headless CMS wissen. Schauen wir uns an, wie es in TYPO3 funktioniert.

TYPO3 war der Zeit voraus und vielen Dank an Macopedia für das Sponsoring und die Mitarbeit bei der TYPO3 Headless Initiative.

Grundsätzlich ist es möglich, das Headless-Konzept für die TYPO3-Website zu nutzen, indem man mit der TYPO3 Extension "headless" eine Erweiterung mit JSON-Content-API für die TYPO3 PWA-Lösung erstellt.

In der Headless-Erweiterung haben wir ein neues JSON-Inhaltsobjekt implementiert, mit dem Sie festlegen können, welche Felder Sie ausgeben möchten und wie diese aussehen sollen. Lassen Sie uns zunächst einen Blick auf ein einfaches Beispiel werfen

lib.page = JSON
lib.page {
  fields {
    header = TEXT
    header {
      field = header
    }
  }
}

Ausgang

{
    "header" : "headerFieldValue"
}

Außerdem können Sie mit Schlüsselwortfeldern mehrfache Felder in json verschachteln, z. B.

lib.page = JSON
lib.page {
  fields {
    data {
      fields {
        foo = TEXT
        foo {
          field = bar
        }
        foo1 = TEXT
        foo1 {
          field = bar1
        }
      }
    }

  }
}

Ausgang

{
    "data": [
        {
            "foo": "bar",
            "foo1": "bar1"
        }
    ]
}

Die aktuelle Ext:headless Erweiterung wird mit dem JSON:API Modul betrieben. Es hat die REST-Erfahrung mit TYPO3 massiv verbessert und macht es zu einem unglaublich vielseitigen System, das praktisch jedem CMS auf dem Markt weit überlegen ist.

• Das JSON:API-Modul stellt alle Entitäten in TYPO3 zur Verfügung und ermöglicht so eine einfache Interaktion, allerdings auf eine sehr elegante Art und Weise:
• Es ist konform mit dem JSON:API-Standard (https://jsonapi.org/), was es für jeden, der eine TYPO3-Website integrieren möchte, einfach macht, die Datenstrukturen zu verstehen, ohne dass viel eigene Dokumentation nötig ist
• Es ermöglicht die Abfrage von Listen und das Filtern nach Entity-Eigenschaften und -Feldern auch nach dem JSON: API-Standard
• Die Kernfunktionalität von JSON: API wird durch das Modul JSON: API Extras erweitert, das eine zusätzliche Konfigurierbarkeit der Endpunkte ermöglicht.

Die oben genannten Features machen TYPO3 effektiv zu einem super robusten Backend für Frontend-Anwendungen.

Headless TYPO3 ist ein interessanter Ansatz, um funktionsreiche interaktive Websites zu erstellen oder Content Hubs zu bauen, die verschiedene inhaltsverbrauchende Websites und Medien versorgen. Er ist jedoch nicht ohne Nachteile und sollte sorgfältig abgewogen werden, bevor man diesen Weg wählt.

Hoffentlich hat Ihnen dieser Artikel genügend Informationen zur Auswahl gegeben. Falls nicht, beraten wir Sie gerne bei Ihrem TYPO3 Headless Projekt.