Exploring the Future of Umbraco: Can Engage Work in a Headless Next.js Setup?

As the web evolves toward composable, API-driven architectures, one question keeps surfacing for Umbraco developers:
Can Umbraco Engage’s powerful marketing and personalisation features work in a headless environment?

At Bluegrass Digital, our team decided to find out. Through a proof of concept (POC), we explored how Umbraco Engage performs when paired with a headless Next.js front end, a combination that promises both flexibility and performance.

Why We Did It
Bluegrass recently began rebuilding its own website using a headless architecture to take advantage of modern front-end frameworks like Next.js and to showcase our design and development capabilities to potential clients.

“Going headless enables us to use modern front-end frameworks, which allows us to better showcase our design and development skills,” says Simon Buerger, Bluegrass’ Technical Director. “But a big question mark was whether Umbraco Engage, which powers personalisation, segmentation, and A/B testing, would still work well in that setup.”

Umbraco has long been a core part of Bluegrass’ tech stack. With the introduction of Umbraco’s Content Delivery API, headless builds have become far more accessible. Given our team’s deep experience in React and JavaScript, Next.js was the natural fit.

How We Did It
The POC began with two core building blocks:

• • An Umbraco baseline project configured with the Content Delivery API.
  • A Next.js baseline setup consuming Umbraco content headlessly .

The goal was to install Engage and explore how its tracking and personalisation endpoints could function through the API.

“We ran both projects locally and examined how Engage’s content delivery responses looked, which endpoints to hit, and how to keep the tracking consistent,” Simon explains.

Tackling Caching and Personalisation
Caching proved to be a major hurdle. Static site caching improves speed but conflicts with Engage’s server-based personalisation and analytics.

To solve this, the team created a NextJS middleware layer that can run at the edge using either Cloudflare or Vercel.

“Along with tracking each request and injecting the visitor id, the middleware checks if a page has personalisation or A/B testing running. If so, it bypasses the cache and fetches directly from the origin. Otherwise, it serves the cached version,” Simon says. “That way, we keep the speed benefits while maintaining accurate tracking.”

What We Found
The verdict: it works.

Even with an early version of Engage, the proof of concept confirmed that its core features – personalisation, A/B testing, segmentation, and tracking – function effectively in a headless setup.
Some editor-facing features, such as the back-office preview widget, were less stable, but the core marketing capabilities remained intact.
“The key takeaway is that Engage can work headlessly,” says Simon. “You just need to handle tracking carefully and accept that there’s a bit more complexity in the rendering pipeline.”

Another key learning: experiment boldly.
“You have to dive deep, test assumptions, and use every tool at your disposal, including AI, to iterate quickly. Don’t be afraid to look under the hood to understand how the technology really works.”

So What: Why It Matters
This POC is about more than technical success. It reflects a broader industry shift toward composable DXPs and content portability.

“People don’t want to be locked into a single CMS anymore,” Simon says. “They want to use the same content across multiple platforms such as web, mobile, and apps without having to rebuild everything.”

By proving that Engage can function in a headless setup, the team showed that developers can retain Umbraco’s marketing power while embracing a modern, decoupled architecture.
Still, there’s room for improvement.
“It would be great for Umbraco to offer more out-of-the-box headless integrations for Engage and Forms, rather than relying on community workarounds.”

The Human Side: Collaboration and Innovation
While Simon led the technical work, this proof of concept was a team effort shaped by collaboration and open discussion across the senior development team.

“We had a lot of conversations about the pros and cons of going headless. Those discussions are where the real value lies, because they help you build collective understanding and avoid blind spots.”

Simon believes experiments like this are part of Bluegrass’s DNA.
“You’ve got to keep asking questions and exploring new technologies. If you just do what you’ve always done, you’ll never move with the times. Internal projects like this are where we get to innovate safely and take those lessons to our clients.”

In Summary
The proof of concept confirmed it: Umbraco Engage can work successfully in a headless Next.js setup.

It takes thoughtful architecture and some clever middleware, but it opens the door to a more flexible, composable digital future.

“Experimentation is how you stay ahead,” Simon concludes. “This wasn’t just about testing Engage. It was about proving that we can keep pushing the boundaries of what’s possible with Umbraco.”