T3 Headless Technologie-Logo Wandeln Sie Ihre Unternehmenswebsite in eine Progressive Web App

Wandeln Sie Ihre Unternehmenswebsite in eine Progressive Web App

Progressive Web Apps (PWA) sind beliebt geworden. Warum? Weil, die Vorteile dieser Webanwendungen auf Geschäftsführer sehr inspirierend wirken. Die native Nutzerfahrung wie bei einer Smartphone-App, die SEO-freundliche Struktur und der Offline-Modus der Progressive Web Apps gelten als wichtige Faktoren zur Maximierung von Konversionsraten und schließlich der Markengewinne. Doch Unternehmen wünschen nicht nur die Vorteile von PWA. Auch stabile und sichere Plattformen zur Inhaltsverwaltung sind gefragt. Hier kommen zuverlässige Lösungen wie TYPO3 zum Einsatz. Bei TYPO3 handelt es sich um ein Content Management System der Enterprise-Klasse. Dank seiner Flexibilität und Sicherheit wird es oft zur ersten Wahl für Marken, die auf Skalierbarkeit setzen.

Wir von Macopedia wollten dieses Dilemma ansprechen und lösen. Unternehmen sollten weder auf zeitgemäße PWA noch auf ein starkes System wie TYPO3 verzichten müssen. Schließlich launchten wir TYPO3 PWA um das beste aus beiden Welten zu verbinden: Eine robuste PWA mit einem zuverlässigen CMS.

Wie funktioniert das?

TYPO3 PWA basiert auf der Idee, Besuchern einer TYPO3-basierten Website ein Nutzerlebnis zu bieten, wie auf einer mobilen App. Seiten werden sofort geladen und sind auch offline verfügbar. Statt immer wieder alle Seitenelemente wie HTML oder JS neu aus dem Internet zu laden, bleiben sie im Browser des Nutzers erhalten. Sobald sich der Seiteninhalt verändert, wird er durch den schnellen Austausch von JSON-Daten aktualisiert, sobald der Nutzer online ist. Werfen wir einen Blick auf die Hauptkomponenten von TYPO3 PWA:

  • Headless - mit dieser Technologie lassen sich Daten via JSON übertragen. Headless unterstützt alle Standard-Inhaltselemente von TYPO3, einschließlich der SEO-bezogenen Felder. Dies gilt auch für die News-, Solr- und Formularerweiterungen.
  • Ein NuxtJS-basiertes Modul, mit dem Sie Ihr Frontend über Vue.js und Nuxt rendern können.  

Beides ist open-source und unter der MIT-Lizenz veröffentlicht. 

Warum Headless TYPO3 PWA beim nächsten Projekt berücksichtigen?

Unternehmen entscheiden sich für TYPO3 PWA, um zwei sehr wichtige Ziele zu erreichen. Zum einen, um eine benutzerfreundliche Mobile First App zu erstellen. Zum anderen Sicherheit und Stabilität zu genießen. Doch es gibt noch mehr Vorteile, die TYPO3 PWA bietet.

  • Optimierter Entwicklungsprozess - insbesondere dann, wenn Sie eine solide UI-Bibliothek besitzen, die für mehrere Projekte bereitsteht.
  • Unabhängige Implementierung von Backend und Frontend - eine Frontend-App lässt sich sogar dann erstellen, wenn das TYPO3 CMS nicht vollständig konfiguriert ist. Es reicht, eine andere TYPO3-Website als Datenquelle zu nutzen.
  • Höhere Google Lighthouse-Wertungen - es ist einfacher, im Google Lighthouse-Benchmark in allen Kategorien eine "grüne Punktzahl" zu erzielen und dadurch die Suchmaschinen-Rankings zu verbessern. 
  • Microservice-Architektur möglich - Headless TYPO3 PWA ermöglicht die Nutzung von Microservice-APIs. Auf diese Weise lassen sich beispielsweise Ecommerce-Features von Sylius oder Magento auf Basis von Oath und API hinzufügen. 
  • Keine Daten- oder Struktur-Migration - basiert die Seite auf Fluid, lässt sich das Typoscript-Template ändern und json vom Inhalt rendern. Daten zu migrieren und eine neue Website aufzubauen ist nicht nötig.

Die Headless TYPO3 & PWA-Initiative wurde von der Entwicklergemeinde warm empfangen. Auch deshalb, weil TYPO3 PWA bei der Frontend-Erstellung äußerst flexibel ist. Je nach der Entwicklungserfahrung und den bevorzugten Tools können Sie entweder auf Storybook und die UI-Bibliothek setzen oder eine Vue.js-App von Grund auf neu entwickeln. Sie bevorzugen eine andere Technologie wie zum Beispiel React? Auch das ist möglich!

TYPO3 PWA brauchen Sie nicht selbst zu implementieren!

Das TYPO3 PWA Modul ist eine wohldokumentierte Open-Source-Erweiterung und für die Verwendung durch Entwicklerteams verschiedener Unternehmen gedacht. Wenn Sie jedoch das Gefühl haben, Sie könnten externe Unterstützung gebrauchen, haben wir verschiedene Pakete zur Unterstützung Ihres PWA-Vorhabens vorbereitet: von maßgeschneiderten Schulungsoptionen für Ihr Team über On-Demand-Support bis hin zur Übernahme des gesamten Implementierungsprozesses durch unser TYPO3 PWA-Expertenteam. Erfahren Sie mehr zu den verfügbaren Support-Paketen.