FLOW3 Data Browser

A Google Summer of Code project of TYPO3 - by Pascal Jungblut

The project

browser

The project is part of the Google Summer of Code. The GSoC allows students to work on participating Open Source projects, such as Apache, Mozilla, FreeBSD and, as in my case, TYPO3. The FLOW3 Browser package allows you to browse the data of any FLOW3 package just like a database browser, such as phpMyAdmin or Sequel Pro. The advantage is that the browser itself is written in FLOW3, so it has knowledge of all the data types and relations between objects. The browser sees your data as you and the framework see it: as objects, aggregates and properties, not as rows, tables and columns. It also uses the internals of FLOW3, so if FLOW3 improves, Browser automatically takes advantage of that. In the frontend it makes use of Ext JS 4 to have a desktop-like UI.

Download Demo

Status

Currently it is possible to read, add, update and delete just like any object that is a domain model. Because Ext JS offers lots of cool features, you can even edit the records inline and save them - right in your table view. Relations can be managed in a popup window that opens when you click on a property of an object that is a relation to another object. I kept the UI very simple as I’m far away from being an expert in UI-design and I wanted to invest most of the time in the logic. Unfortunately, that is easily said - I ended up doing a lot of frontend/JavaScript coding. I’ve also added a (yet) readonly REST action and a CSV export.

Challenges

As mentioned above, I originally wanted to put most of my time in the backend logic to make it as solid and future-proof as I could. So I have chosen Ext JS as the frontend-framework, as it has lots of predefined UI-widgets, functions, helpers and so on. The first problem was the transition from Ext JS 3 to Ext JS 4 when the TYPO3 Phoenix team started migrating, too. I ended up doing a complete rewrite of the JS code (the Phoenix team dropped Ext JS 4 at that point). The second big issue was that, although Ext JS 4 is really flexible and sufficient for most use-cases, it becomes very hard when you try to do something special (like having dynamic models). Last but not least FLOW3 is still a moving target. But since my project started the FLOW3 team has done a great job on improving the stability. I recommend testing the “secret alpha 15” here.

Future

Of course I could not implement anything I wanted yet. Here are the things to come in the future:

Special thanks go to my mentor, Tobias Liebig, for guiding my through the project, the FLOW3 team for their great work and the help they offered and Patrick Lobacher.

Regards,
Pascal