Aufbau einer zukunftsfähigen Headless-Plattform mit TYPO3

ion2s ist eine Digitalagentur, die sich auf die Konzeption und Umsetzung skalierbarer Webplattformen, digitaler Erlebnisse und technisch anspruchsvoller Online-Lösungen spezialisiert hat. Das Unternehmen arbeitet mit Organisationen zusammen, die mehr als nur Standard-Websites benötigen: zukunftsfähige Architekturen, wartbare redaktionelle Arbeitsabläufe, starke Integrationsmöglichkeiten und einen klaren Weg für digitales Wachstum.

Die eigene Unternehmenswebsite erfüllt gleich mehrere Funktionen. Sie repräsentiert die Marke des Unternehmens, unterstützt die Kommunikation und die Lead-Generierung und bietet die nötige Flexibilität für Marketingkampagnen, Landingpages und zukünftige inhaltsorientierte Anwendungsfälle.

Vor Beginn des Projekts betrieb ion2s seine Website auf Basis eines modernen Frontend-Stacks, jedoch ohne eine CMS-gesteuerte, produktionsreife Headless-Architektur im Hintergrund. Aktualisierungen der Inhalte auf der bestehenden Website waren stark von der Mitwirkung der Entwickler abhängig, und die Infrastruktur war noch nicht als wiederverwendbare strategische Grundlage für zukünftige digitale Anwendungsfälle positioniert.

Gleichzeitig erkannte ion2s eine umfassendere Chance: Das Unternehmen wollte TYPO3 als redaktionelles Rückgrat für eine moderne Headless-Architektur validieren, die nicht nur die eigene Website bedienen, sondern auch als Referenzmodell für zukünftige Kundenprojekte dienen könnte. Daraus ergab sich eine doppelte Herausforderung. Einerseits musste die neue Lösung redaktionell verwaltbare Inhalte, strukturierte SEO-Daten und Flexibilität bei Kampagnen unterstützen.

Andererseits musste sie beweisen, dass TYPO3 als robustes Headless-CMS in einer produktionsreifen Umgebung funktionieren kann – mit serverseitigem Rendering, strukturierter Content-Bereitstellung, skalierbarer Bereitstellung und einer klaren Trennung zwischen Backend, Frontend und Betrieb.

Das Projekt musste daher mehr als nur einen Relaunch leisten. Es galt, eine wartbare TYPO3-Headless-Architektur zu etablieren, den bestehenden Umfang der Website beizubehalten und eine wiederverwendbare technische sowie konzeptionelle Grundlage für zukünftige Headless-Anwendungsfälle zu schaffen.

Das Projekt umfasste den Entwurf und die Umsetzung einer neuen, entkoppelten, headless Webplattform auf Basis von TYPO3 und Nuxt. Ziel dieses Projekts war es, eine moderne, skalierbare Architektur zu etablieren, die die redaktionelle Inhaltsverwaltung von der Frontend-Bereitstellung trennt. Dank TYPO3 bietet dies eine stabile Grundlage für zukünftige Anwendungsfälle.

Die eigentliche Arbeit begann mit dem architektonischen Entwurf der Headless-Plattform. Dazu gehörte die Trennung zwischen TYPO3 als redaktionellem Backend und Nuxt als Frontend-Anwendung. Bei dieser Migration wurde eine bestehende Website an eine neue Headless-Struktur angepasst.

Das Backend fungierte als zentrale redaktionelle Plattform und lief auf TYPO3 Version 13.4. Content Blocks dienten als strukturiertes Inhaltsmodell und sorgten für eine einheitliche redaktionelle Benutzererfahrung im Backend. Die Headless-Content-Delivery-Schicht wurde als Komponente genutzt, um diese Inhalte dem Frontend zur Verfügung zu stellen. Für dieses Projekt wurden maßgeschneiderte TYPO3-Extensions entwickelt, die die Lücke zwischen der Implementierung von Content Blocks und einer kontrollierten Headless-JSON-Ausgabe schlossen.

Im Frontend wurden bestehende Vue-Komponenten migriert und an Nuxt angepasst, wodurch die Grundlage für die neue Anwendungsarchitektur geschaffen wurde. Mit der Einführung von Nuxt 4 und Nitro wurden serverseitiges Rendering und Anwendungsfunktionen bereitgestellt.

SEO-relevante strukturierte Inhalte wurden mit besonderer Sorgfalt behandelt, um sicherzustellen, dass die Headless-Architektur die für eine suchmaschinenfreundliche Darstellung erforderlichen Inhaltsstrukturen und Metadaten unterstützen konnte.

Die daraus resultierende Plattform bildet die Grundlage für zukünftige Landingpages, zusätzliche redaktionelle Funktionen und weitere digitale Anwendungsfälle. Die Architektur ist so konzipiert, dass sich das redaktionelle Backend und die Frontend-Anwendung unabhängig voneinander weiterentwickeln können, während eine stabile Schnittstelle zwischen Content-Management und Content-Bereitstellung gewährleistet bleibt.

In diesem Projekt wurde die Website zudem zu einer strategischen internen Referenzplattform: eine praxisnahe Headless-TYPO3-Implementierung, die nicht nur darauf ausgelegt ist, unmittelbare geschäftliche Anforderungen zu erfüllen, sondern auch eine wiederverwendbare Architektur für zukünftige Kundenprojekte zu validieren.