In May 2023, 35 Plone community members gathered in Bonn, Germany at the kitconcept offices for the 5th Beethoven Sprint. The main focus was the upcoming Plone 6.1 release, planned for release this autumn/winter, but also to look ahead further in the future and start development on Plone 7.
The sprinters collaborated on many different subjects that range from Development, Design, Theming, Release Planning, User Experience and the Community Processes. And last but not least, meeting our fellow Plonistas from all over the world is an important goal of every sprint.
Origins of the the Volto Frontend
The React-based frontend 'Volto' was first bundled with the Plone 6.0 release in December 2022, but work on it started already in 2017 at the first Beethoven Sprint! Back then the name 'Volto' was still 2 years away. The separation of frontend as a Single Page (Web)-Application (SPA) and the use of the Plone application server as the content backend was called 'The headless CMS.' The plone.restapi add-on for Plone exposes the content to the frontend service. In 2018 "Pastanaga UI" was coined, the design system and User Interface for the new frontend, created by Albert Casado.
The third Beethoven Sprint in 2019 - "A strategic sprint on Plone 6 and Volto" - first mentions Volto as a name for the React based frontend. After an unfortunate pause of 2 years but many online meetings and development by the Plone community, an in-real-life meeting in Bonn was possible again in May 2022. So 2023 marked the 5th 'jubilee' of this wonderful and well-visited event for the Plone Community.
Communication and Discussions
So where to start on the subjects that were worked on? We were fortunate to have Albert Casado present again to work on the next iteration of the User interface, Quanta. Together with Irene Escudé, also a UX specialist, there were deep conversations and design sessions with developers. Albert and Irene were also available and assisted others that had UI/UX questions for features they were working on.
Discussions! During the week there were many talks with whoever was interested on many sometimes complex decisions and challenges that we face as a commmunity when building an open source CMS as feature rich and complex as Plone. Release Planning: which features can make it in the next Volto release that will be bundled with Plone 6.1? How many years of support can we as a community of developers, integrators and support companies deliver? What is the value of the Plone Community, what does Open Source mean, and how do we communicate this to the outside world? But also Plone from a business point of view: what do Plone integrators need for continued success to deliver Plone projects to customers?
Communicating the virtues of Plone requires building, maintaining and providing content for our own websites. At the Beethoven sprint we improved plone.org and the upcoming upgrade of plone.de and other localised 'country' websites to use Plone 6 with Volto. And of course the participants developed, writing code, debugging issues and discussing our architecture.
Plone 7 with 'Quanta'
The Volto release manager, Víctor Fernandez de Alba, presented thoughts on a new frontend architecture for Plone 7 where the frontend components, UI theme, and Content Management User Interface (CMSUI) can be used separately in other projects or swapped in Volto for custom implementations. This will allow them to be used outside Volto, for example in other frameworks or platforms like NextJS, Remix or even Angular.
The add-on and configuration registry, then the data fetching architecture and the main frontend components will be made available as separate packages (and add-ons). They will be able to work in Volto as they should be backwards compatible.
The work in the CMSUI "Quanta" was also discussed and further designed. 'Quanta' is the new UI design that is in the works for Plone 7. Along with the a new theme it will allow you to drop any design system you want to use in your project's end user UI, while preserving the built-in CMSUI components needed to manage the site.
Another more marketing and 'positioning' related topic was how many competing 'Headless' CMS systems nowadays market some features as the 'next big thing' that Plone has had since many years. Plone can now also be run 'headless' for quite some time. We should embrace the "headless CMS" story and present Plone as a full fledged headless solution. No matter the size of the project, we have the required tools to build the right CMS for the right use case.
Coding, Testing and Deployment
Here follows a non-exhaustive list of features, components, and websites that were worked on during the Sprint
Grid block: There was a lot of discussion of the UX of the new grid block, which makes it possible to arrange other blocks into columns. In the end it was decided to keep the existing implementation (based on the @kitconcept/volto-blocks-grid addon). This has been merged since the sprint. Work was also done toward improving drag and drop between columns.
Teaser block: The teaser block links to another content item with its title, description, and preview image. The UX designers created a plan for allowing the teaser to operate in a “live” mode that always updates from the source content item, as well as the current mode where the information from the source can be overridden.
Relations REST API service, relations control panel and link integrity: Katja Suess finished her work on the new REST API service for relations. With this service the control panel to view and edit relations between content items is now ready. Dante Álvarez, Paul Grunewald and Katja built a view that can be accessed from the actions menu for viewing inbound links and relations. They also worked on improving the warning that is shown if deleting an item would cause links to break.
Image rendering optimizations: Piero Nicolli and David Glick worked on updating volto’s rendering of images to use a new Image component that uses a srcset with multiple scales, so that the browser can choose the most appropriate size to download.
Listing block variations: There is a plan for creating flexible listing block variations which support multiple content types in a pluggable way, rather than a custom variation for each content type.
Block type index: Sometimes it’s necessary to find all the pages that include a particular type of block. Margarida Paixao implemented a block_types index that can be used for this sort of query on the plone backend, where for example future migrations of block structures can run much more efficiently. Once this index is in place and part of core, we can create
Advanced facets in search block: Facets in the search block can be marked as “advanced” which means that they will not be shown until expanded.
Provide counts of Facets from the Zope Catalog. The eea.facetednavigation add'on has many years provided Plone setups with more advanced search interfaces where visitors can for example drill down in facets. The Search block that is now partt of Volto also offers this faceted view, but the counts on items while adding facets to the search query required an external search service. A team at the sprint found a way to implement these counts directly on the built-in ZCatalog in the Plone backend.
Plone distributions: This is a project to provide distributions that help get started with using Plone for a particular use case like an intranet or a government site. The plone.distribution package will be a light weight framework and add'on package with conventions and some utilities to let website admins create customised Plone installations.
With plone.distribution the community can create a configuration for Plone with a form wizard to let an administragor enter some basic settings, a set of add'ons that need to be installed and demo data that shows the purpose of the site and lets evaluators test the setup. The distribution itself is stored in a normal Plone add'on and python package and can be published on pypi.
And even more was worked on ...
- Show a different icon to indicate pages that contain other pages
- Accessibility testing for volto
- Rebuilding plone.de
- Template plone/meta template for CI/CD
- Updating how constraints.txt is generated in the Plone release process
- Fixing circular dependencies in the Plone backend
- Block publishing items that were traversed via Acquisition
- API endpoint to get result counts for facet terms when searching
- Experiments with React Native
