By Janus Boye
On a cold December morning in the Norwegian capital Oslo, I found myself together with about 50 members of the Enonic community at their final developer meetup of the year.
Enonic is a Norwegian CMS vendor that’s been around for 20 years and has dipped its toes in foreign waters with international expansion in both the US and the UK. Unlike many others in this space these days, Enonic is both founder-led and bootstrapped without venture capital. Judging from the talks at the meetup, Enonic boasts a solid footing in their home market.
Entrepreneur, startup founder and Boye Aarhus 23 conference speaker William Imoh also joined me as a guest and he summarised the meetup like this:
“Enonic should be talked about more and is heavily underrated. I was pleasantly surprised at the powerful features demoed as part of a larger solution but heavily understated. These seemingly small features would easily headline releases and sales campaigns if larger vendors built them.”
With version 7.13.5 of their product, Enonic XP just released, we saw some slides, more live demos, and as expected for a developer meetup, the source code to a number of interesting implementations.
We started with a session focused on a new addition to the family of Enonic starters.
Tsup Starter: A new kid on the block
As perhaps the least technical person in the room, I’m glad I had a strong cup of coffee before engineering manager Alan Semenov launched into this session.
Enonic released their TSup Starter in August, and it comes with a handful of cool features: lightning-fast building and transpiling of Typescript code (tested on industry benchmarks), integration with React, caching of static assets, millisecond hot reloads and an overall smoother developer experience.
So, what’s TSup you might ask? Alan quoted the creators of TSup:
“The simplest and fastest way to bundle your typescript libraries.”
The main reasons to consider TSup are its performance and ease of use. TSup touts a bundler and transpiler, which, when tested against similar tools (rollup and tsc), supercharges the developer experience of speedily building large projects.
Alan demonstrated how you can quickly bootstrap a new TSup-supported Enonic XP application in seconds using the new “dev” command in Enonic CLI. You can lean back and watch the talk below.
Next up was the good topic of search.
How to build a search solution on Explorer 4.0
Enonic recently released a major update to the Explorer search engine that includes a GraphQL API, document types, improved UI, and more.
Christian Westgaard at Enonic was the lead engineer on the project, and he gave a hands-on session on how to build a search solution that aggregates and searches data from multiple sources.
In his 20 minutes of allocated time, he showed a live demo where he created a vehicle listing from scratch. With cars as a document type, he quickly demonstrated how to build a robust search functionality having granular filters. The data was retrieved from a public listing of cars using a built crawler. Vehicle attributes, including range, cost, and fuel type, were retrieved and ingested by the Enonic Explorer.
Armed with the Enonic Explorer, the ingested data is exposed through well-defined inferred types and auto-generated APIs, which are then consumed on the user-facing interface. Dive into the entire talk below.
Moving on with a fascinating customer story.
Gjensidige’s design system in Enonic XP with server-side rendering
In a joint presentation by Thorstein Thorrud and Bobby Westberg from insurance firm Gjensidige, we heard about their journey of building an impressive React-powered design system and utilizing it within Enonic XP.
The platform they’ve built is an entire component library and what I would consider a fully-fledged and state-of-the-art design system with granular tokens and components. It powers 2,000+ pages and handles over 100 million user interactions across three countries and five website domains. All these while delivering profound aesthetics and accessibility.
The design system was originally born as a CSS file loosely passed around. Then, it became a React-based library inside Enonic XP. Today, it’s called Builders Core - enabling 150 builders by giving them a common language for all disciplines, out-of-the-box accessibility, standardization, and compatibility.
If you want to make sure that your design system doesn’t get left behind, you need to create a community around it, so that many can participate and keep it alive. Read more about the Gjensidige design system in this member’s call from 2020: Design leadership requires community management skills
It’s quite an impressive blueprint for content design and building apps, which today has some 30+ Parts and 20+ Content Types and enables them to speed up both design and development.
As an interesting plot twist in this case study, Thorstein and Bobby mentioned how the design system passed a major test at the beginning of 2022, when they started the implementation of a new corporate identity. This meant that all components in Builders Core needed restyling and they had to maintain and deliver a consistent user interface and experience across all products and customer-facing tools.
They finished with some well-deserved bragging: Using Siteimprove for digital governance, they’ve now achieved an accessibility score of 94,3 (way higher than the industry average), a carbon rating of B, and finally, 90+ scores on all Google Chrome’s lighthouse performance metrics. You can watch the entire presentation below.
In the morning's final session, we heard about another design system. This time from a large Norwegian government customer.
Nav.no with headless XP, next.js, and "Aksel"
Joining us from NAV, the Norwegian Labour and Welfare Administration, was tech lead Anders Bråthen Nomerstad. He shared how they rebuilt nav.no with a headless Enonic XP and a components-based frontend architecture.
For context, NAV is a big part of the Norwegian government responsible for spending about a third of Norway’s state budget on pension schemes, unemployment, and other welfare offerings.
NAV today has upwards of some 16,000 pages in the CMS, and we also saw a live demo building a page with different components from their component library called “Aksel”.
The digital toolbox at NAV is large and complex as Aksel runs on:
Enonic XP as a headless CMS)
Next.js for the frontend
Guillotine/GraphQL in XP for resolving content to the frontend
Server-side rendering with static HTML cache and event-driven invalidation
Utilizing their design system, Aksel, they’ve taken a components-based approach to composing pages, and Anders convincingly demonstrated how they’ve integrated XP page components with React components. He portrayed the immense flexibility it affords their front-end developers and editorial staff.
You can lean back and view the talk recording below.
That’s it. To rephrase what William said in the opening: While Enonic might lack global recognition, their offering and customer implementation are quite up to global standards.
Learn more about Enonic
You can meet Enonic in our European CMS Expert group, regularly in our Oslo meet-ups and occassionaly at our annual international Boye conference in Aarhus.