Asko Soukka: Plone and Volto in a Jamstack project

Here are the slides.

I am a software architect at University of Jyväskylä. I have been using Plone since 2004 and GatsbyJS since 2018. The university wanted one student information management system to rule them all, but... every organisation shall do their own integrations, using granular REST API with deep JSON responses. And there should be branded study guides, which we crafted with GatsbyJS. But this was not enough for the Open University part. They really needed a CMS.

We use Plone 5.2, Volto, GatsbyJS, and have 6000 html pages, times two languages, out of which 760 are Volto pages. With Plone we could extend content types without needing to do any coding, in the content types field editor. In volto we added auto-complete widgets with custom vocabularies. On the GatsbyJs side, we query the connected pages with GraphQL. We render Volto layouts with React components, rendering individual blocks.

Why did we choose GatsbyJs? It is a ReactJS-based site generator. Being static, it is very fast. You can use multiple sources as input, using a plugin architecture. Data lookup is done with GraphQL. It is easy to get started, with comprehensive documentation.

I mentored two Google Summer of Code projects for the gatsby-source-plone plugin. It supports default types and most TTW types, also Volto blocks. You can do incremental updates by modification date, so it is really fast.

Not everything is easy. The full "GatsbyJs experience" requires practice. You want to replace inline images and links with GatsbyJs images and links, replace file links with direct downloads.

Using @plone/volto as dependency to render blocks seemed like a good idea, but it required webpack overrides to be impartable, and could not be used for images and links.

The ugly parts of GatsbyJs:

• The GraphQL source plugin cannot cache.
• The build may take hours, and gigabytes of memory.
• The build result in readonly.
• For me it is hard to follow GatsbyJs development, especially individual plugins, because they use a monorepo.

Editors can work on the site during the day, and then wee rebuild the result during the night