Experfy – Building a Flexible Content & Template System Without a Playbook

Experfy is a platform where companies can hire experts in data science, AI, and technology, while also offering training and learning resources.

As the platform evolved, there was a growing need to give non-technical users control over creating and managing pages—without depending on developers for every update.

The requirement initially sounded simple:

“Let users create and manage pages dynamically.”

But in practice, it involved multiple challenges:

• No ready-made solution that fit the exact requirement
• Combining a visual builder with a headless CMS is complex
• Payload CMS wasn’t designed for this type of template system
• Limited or no documentation for the specific setup

This wasn’t just about integrating tools—it was about making them work together in ways they weren’t originally designed for.

Instead of rushing into implementation, I focused on understanding the tools deeply:

• Explored GrapesJS (visual builder) in depth
• Studied how Payload CMS manages data and APIs
• Identified how templates could be created, stored, and reused
• Collaborated with the team to evaluate different approaches

Goal: Build a flexible and scalable system—not just a working solution.

We decided on a custom architecture:

• Use GrapesJS as the visual page builder
• Use Payload CMS for template storage and management
• Build a connecting layer to integrate both into the product

This required carefully designing how data flows between systems, as it wasn’t a plug-and-play setup.

I worked on implementing the complete workflow:

• Integrated GrapesJS for template creation and editing
• Customized Payload CMS APIs to store and manage templates
• Structured how templates are saved, fetched, and reused
• Built dynamic rendering in Next.js for displaying templates
• Ensured non-technical users could easily create and update pages

A significant part of the work involved exploring and modifying open-source code due to limited documentation.

1. No Clear Documentation

There was no defined guide for this implementation.
👉 Explored source code, experimented with approaches, and validated decisions with the team.

2. Tool Limitations

Payload CMS wasn’t built for this use case.
👉 Extended and customized its API behavior to support template storage and management.

3. Connecting Builder + CMS

Making GrapesJS output usable within the application required structure.
👉 Designed a consistent format for saving and rendering templates.

4. Usability for Non-Technical Users

The system needed to remain simple despite its complexity.
👉 Focused on a clean and intuitive workflow from the user’s perspective.

• Enabled dynamic page and template creation without developer involvement
• Built a flexible system using open-source tools beyond their default capabilities
• Reduced dependency on developers for content updates
• Delivered a scalable solution aligned with a microservices architecture

• Not every problem has documentation—you often have to figure things out yourself
• Understanding how tools work internally is more valuable than just using them
• Flexibility in system design is critical for long-term scalability
• Collaboration leads to stronger technical decisions

This project stands out because there was no clear path at the start.

It required experimentation, understanding tool limitations, and gradually shaping a solution that works in production.

That process—figuring things out without a predefined solution—is what made it truly valuable.