Im Vortrag wird ein Prototyp vorgestellt, der veranschaulicht, wie man Listen, z.B. eine Veranstaltungsliste und Formulare, wie z.B. ein Umfrageformular in Verbindung mit React und JSON Schema im TYPO3-Backend und -Frontend integrieren kann.

1. Flexible Listen mit React in TYPO3
Martin Alker und Weiye Sun
TYPO3Camp Mitteldeutschland Dresden, Jan 2019

2. Agenda
• Um was geht’s?
• Warum?
• Prototyp
• Ressourcen
• Live-Beispiele (Frontend)
• Herausforderungen
• Wie geht’s weiter?

3. Um was geht’s?
• TYPO3 (Extension)
• Backend und Frontend
• Listen
• Formulare
• React
• JSON Schema

4. Warum?
• Kundenanforderungen
• Wiederverwendbarkeit / Flexibilität (Konfiguration)
• Datenvisualisierung (Datenanalyse)

5. Prototyp
• Backend / Frontend
• Events (Liste)
• Umfrage (Formular)

6. Prototyp | List Management | Backend

7. Prototyp | Create an event | Backend

8. Prototyp | Price dependency | Backend

9. Prototyp | Add talks to event | Backend

10. Prototyp | Events | Frontend

11. Prototyp | Edit survey entry | Backend

12. Prototyp | Survey entries list | Backend

13. Prototyp | Umfrage | Frontend

14. Prototyp | Umfrageergebnis | Frontend

15. Ressourcen
• JSON Schema: https://json-schema.org/
• react-jsonschema-form: https://mozilla-services.github.io/react-jsonschema-
form/ (Playground)
• Recharts: http://recharts.org/en-US/

16. Live-Beispiele (Frontend)
• Bruker Webinars: https://www.bruker.com/events/webinars.html
• BMG Labtech Events: https://www.bmglabtech.com/de/events/

17. Herausforderungen
• TYPO3-Backend
• Mehrsprachigkeit
• Workspaces
• ?

18. Wie geht’s weiter?
• Community
• Veröffentlichung (Alpha)
• Neue Features (API…)
• Dokumentation
• Für weitere Systeme einsetzbar/vorstellbar (Neos, Shop, App…)

19. Vielen Dank
Rückfragen gerne an pi@punkt.de
@punkt_de
https://www.facebook.com/punkt.deGmbH/

20. Raum für Fragen