Extending PlatformUI
Introduction
This tutorial aims at providing a step-by-step guide on how to extend the JavaScript application provided by the PlatformUI bundle.
In this tutorial, we will create a new part of the application allowing to browse your content by Content Type instead of using the tree structure. To fully benefit from this document, you need to:
- be comfortable with eZ Platform's domain (Content, Location, Content Type, etc.)
- have basic to intermediate level in HTML5/CSS/JavaScript
- have a basic knowledge of Symfony's concepts (Bundle, Controller and routing)
- have read the PlatformUI technical introduction
This tutorial is divided into 9 steps. The complete code base is available on Github in the ExtendingPlatformUIConferenceBundle repository which also provides a tag for each step. The expected end result can be seen in this screencast:
Tutorial steps
Relevant Community resources
In this section
- Alter the JavaScript Application routing PlatformUI routing mechanism The essential task of the PlatformUI Application component is to handle the routing. It is based on the routing capabilities p...
- Build the content list Two ways to generate pages in PlatformUI As written in the PlatformUI technical introduction , pages in PlatformUI can be generated either by the browser b...
- Conclusion Potential improvements and bugs We now have a basic interface but it already has some bugs and it could be improved in a lots of ways. Here is a list of thi...
- Configure the navigation PlatformUI Navigation Hub As written in the PlatformUI technical introduction , the Navigation Hub gives access to 4 navigation zones which have a set of n...
- Create the extension Bundle To extend PlatformUI, the very first thing to do is to create a Symfony bundle. For that, you can use the Symfony generate bundle command in the following way:
- Define a View Views in PlatformUI Each route defines a View to render when the route is matched. As explained in the PlatformUI technical introduction , this kind of vie...
- Define a View Views in PlatformUI Each route defines a View to render when the route is matched. As explained in the PlatformUI technical introduction , this kind of vie...
- Define a View Views in PlatformUI Each route defines a View to render when the route is matched. As explained in the PlatformUI technical introduction , this kind of vie...
- Filter by Content Type This step is very similar to the previous one on adding pagination . We are going to add a new type parameter in the whole component stack ; the main diffe...
- Pagination By default, the Search Service returns 25 results so, without pagination, the current interface allows you to view only the 25 Locations. To add the paginati...
- Set up the configuration PlatformUI Configuration files JavaScript modules in yui.yml Each component of the PlatformUI application is written as a YUI module . The YUI module sy...
Contributors
- Damien Pobel Commenter
- André Rømcke Updated
Comments
Add a comment