Wie baut T3AI auf TYPO3 Core Standards auf? (UI/UX und Code)

Möchten Sie wissen, wie unsere beliebte TYPO3 Erweiterung T3AI entstanden ist? Wir haben sie entwickelt, indem wir uns sorgfältig an die TYPO3 Kernstandards für das Backend-UI/UX und die Codierungspraktiken gehalten haben. Lesen Sie weiter, um das Was, Warum und Wie hinter der Entwicklung zu erfahren!

Wir lieben TYPO3 & AI! Wir bei T3Planet sind leidenschaftliche TYPO3 Fans! Wir sind stolz darauf, die allererste funktionsreiche TYPO3 AI Erweiterung, T3AI, entwickelt und auf den Markt gebracht zu haben. In diesem Blog erfahren Sie, wie wir diese maßgeschneiderte TYPO3 Erweiterung unter Einhaltung der TYPO3 Kernprinzipien für UI/UX und der technischen Coding-Standards entwickelt haben.

Wussten Sie schon? Durch die Einhaltung der TYPO3 Kernrichtlinien mussten wir keine einzige zusätzliche Zeile HTML, CSS oder JavaScript schreiben, um die beeindruckende UI/UX von TYPO3 zu erreichen.

Bevor wir tiefer eintauchen, wollen wir ein paar Zahlen nennen, die die harte Arbeit hinter T3AI widerspiegeln (nicht aus der Marketing Perspektive, sondern als Beleg für das Engagement der TYPO3 Entwickler):

• 3000+ Stunden für den Relaunch von T3AI v4
• 500+ Tassen Kaffee
• 10+ Engagierte Ressourcen
• 1814+ Git Commits
• 350+ Merge-Anfragen
• 300$+ OpenAIs Rechnungen
• 80+ Git-Tickets
• 25+ Branches
• 15+ Releases

T3AI v1 war unser experimenteller Vorstoß in die Integration von KI in das TYPO3 CMS. Wir begannen mit kleinen Funktionen wie einem 3 Step TYPO3 Page Launch, AI Powered Content über TYPO3 RTE, SEO Optimierung mit AI, automatisierte Seitenübersetzung und ChatGPT Personal Assistant.

Während sich v1 auf die technische Machbarkeit und die Erweiterung der TYPO3 Kernstandards konzentrierte, kam es im Bereich UI/UX zu kurz. Den frühen Versionen fehlte der letzte Schliff, wie die Screenshots unten zeigen.

T3AI v2 führte weitere KI Funktionen ein, während v3 bedeutende Änderungen mit sich brachte, einschließlich der Umbenennung von EXT:ns_openai (nur ChatGPT) in EXT:ns_t3ai (Unterstützung mehrerer KI Modelle wie Gemini, DeepL, Azure usw.).

Zu den neuen Funktionen gehören eine ChatGPT Seitenleiste, SEO Optimierungen mit einem Klick, Sprachübersetzungseinträge, KI generierte Bilder, automatische Inhaltserstellung und eine Glossar Übersetzungsfunktion.

T3AI v4 wurde am 15. August 2024 veröffentlicht und markierte eine komplette Neuentwicklung, die sich auf das Backend UI/UX und die Codestruktur konzentrierte. Ein Early Access Programm lieferte wertvolles Feedback und führte zu positiven Reaktionen von unseren Early Adopters.

Diese Version bietet eine umfassende TYPO3 AI Erweiterung mit einem Dashboard, SEO Tools, Content Management, Übersetzung, Lokalisierung, benutzerdefinierten Prompts und einem AI-Chatbot. Das UI/UX orientiert sich eng an den TYPO3 Kernstandards und gewährleistet eine nahtlose Integration mit der nativen Oberfläche von TYPO3.

Hier ist die Liste der Anpassungen, die ich in Bezug auf die Benutzeroberfläche und die Benutzererfahrung erwähnen möchte, um eine enge Verbindung mit dem TYPO3 Kern herzustellen.

Dashboard TYPO3 Core Erweiterung

Wir haben EXT:dashboard von TYPO3 core für ein einheitliches Design verwendet.

Implementierung des PHP PSR 12 Codierungsstandards

• Alle PHP Dateien halten sich an die Unix Zeilenenden LF (Linefeed).
• Für die Zeilenlänge gibt es keine feste Grenze.
• Die declare Anweisung wird für jede Klasse verwendet.

Verwendung von DataHandler
Seiten, Datensätze und die Erstellung von Inhalten folgen dem Standardansatz von TYPO3 mit DataHandler.

Behandlung von Ausnahmen
Die Fehlerbehandlung wird mit benutzerdefinierten Exception Handler-Klassen für spezifische Szenarien verwaltet.

Verwendung von Interfaces
TYPO3 Core Interfaces werden für die Integration von Doc Header Buttons, Content Buttons und Context Menüs verwendet.

Code Refactoring und -Optimierung
Basisklassen werden implementiert, um Code-Redundanz zu reduzieren und die Optimierung zu verbessern.

ES6 im TYPO3 Backend
JavaScript Module werden nach dem neuen Ansatz mit JavaScriptModules.php und entsprechenden Importen hinzugefügt.

AJAX/Routen
AJAX-Anfragen werden für jede JavaScript-Anfrage verwendet, mit definierten Routen für verschiedene Aktionen.

Ereignis Listener
TYPO3 Core Events werden zusammen mit selbst entwickelten Events verwendet, um die gewünschten Funktionen zu erreichen.

Wir könnten viel über die Initiierung und den Weg von T3AI zu v4 schreiben. Unser Team hat fleißig gearbeitet, sich an die TYPO3-Kernstandards gehalten und sich auf die Benutzererfahrung konzentriert. Haben Sie T3AI schon erkundet? Wenn nicht, dann tauchen Sie ein und erleben Sie die Innovation!

• Erkunden Sie die Extension: T3AI auf T3Planet
• Backend Live Demo: Live Demo
• Dokumentation: T3AI Dokumentation
• Haben Sie Fragen? Kontaktieren Sie Stefan, Product Ambassador unter +49 6204 6011377 | stefan.reinhardt(at)t3planet.com

Wir wünschen Ihnen viel Spaß mit TYPO3 AI!