Piero Nicolli: Bring your own front-end

published Nov 27, 2024

Talk by Piero Nicolli at the Plone conference 2024 in Brasilia.

Link to talk information on Plone conference website.

Volto is already almost ten years old. Things are moving in the frontend world.

We had a client request for something specific for tourists, with native look and feel, PWA support, multilingual, good performance and UX, accessible. Of course limited budget. It did not really need dynamic routes or the whole that Plone has to offer. But they did like to use Plone for this. But did not really look like a Volto project.

Bring your own frontend. There is Vite, but we already knew NextJS and had only short time so we went with it.

I felt it was faster for us to really start from scratch with a new layout, for this project. We used framer-motion for animated route changes. And used @plone/client, @plone/providers, @plone/components, Tailwind CSS, TypeScript.

react-aria actively helps you with accessibility, it logs warnings.

After a while they wanted dynamic routes anyway, so being able to create pages in a section of the site and they could get dynamically loaded, next to the static routes. Sure. We used @plone/registry.

What if... we would show the whole site? With the dynamic routes we were almost there anyway, we could show pages with blocks just fine.

Promise: we can run Plone in Next.JS. I am working on a template for that. Features/plan: config registry and add-ons, blocks, slots, fully dynamic routes, dynamic theme. Ideas and feedback are welcome here: https://github.com/plone/volto/pull/6442.