PaperCut logo

Building PaperCut's Partner Portal with Next.js and CloudCannon

Tiaan Fairchild

Tiaan Fairchild

Developer

CloudCannon

>10x

faster to edit content

100%

editor autonomy

Optimized

performance for all user types

When PaperCut approached CloudCannon’s Enterprise Success Team with their Partner Portal requirements, they presented an interesting challenge: they needed all the dynamic functionality of a full-stack application, but they also wanted their content team to be able to edit the front-end easily in CloudCannon. It's not every day we get to build something that's simultaneously a static site and a dynamic application — but that's exactly what we did.

The PaperCut Partner Portal is an online platform for PaperCut's authorized partners, offering valuable resources like marketing materials, training, certifications, product manuals, and tools to effectively sell and support PaperCut print management solutions. Tasked with creating such an important platform — and ensuring that PaperCut's editors could easily create content within it — it was really important to get everything working smoothly!

PaperCut Portal

The technical challenge and solution

PaperCut's internal dev team works primarily with React, so when we were evaluating different static site generators, Next.js emerged as the clear winner. Beyond the team's existing expertise, Next.js offers built-in routing and seamless API handling that would make our hybrid approach much more manageable.

The unique aspect of this project was the architecture we settled on. We built a Next.js front-end that compiles to a fully static build, which then communicates with a separate Node.js backend server through API routes. This means when users are browsing the Partner Portal, they’re getting all the speed and reliability benefits of a static site, but any dynamic functionality — user authentication, personalized content, real-time data — is handled through JavaScript requests to our backend.

Technical architecture diagram of PaperCut's Partner Portal
Technical architecture diagram of PaperCut's Partner Portal

It's an approach that I'd never really considered before this project, but it perfectly illustrates how you can use a static site within an application that’s not actually static. You're getting the best of both worlds: instant page loads and all the CloudCannon benefits for content management, plus the full backend capabilities that a complex application demands.

Custom live editing

One of the more interesting technical challenges here was implementing CloudCannon's live editing capabilities. Here we built a custom implementation using JavaScript bindings — as we've done with other Next.js projects. (To see a similar implementation in action, check out this CloudCannon template).

The end result is a fully live-editable experience where content editors can use CloudCannon's component-based editing system to build and modify pages in real-time. For PaperCut's team, this meant they could maintain the intuitive editing experience they needed, using consistent content blocks to build their pages, while we delivered the technical complexity they required under the hood.

PaperCut Portal, edited using CloudCannon components

Ending legacy frustrations with a modern workflow

The transformation from PaperCut's old system really highlights why this project was so valuable. Their previous portal was built in PHP — and content editors had to dive into the source code itself to make any changes. So if you wanted to update a simple piece of text or add a new section, you'd need to open up your IDE, navigate to the HTML files, and manually edit Bootstrap classes and content directly in the code.

The editors I spoke with clearly have technical knowledge — they understand Bootstrap well enough to work with classes — but they really didn't enjoy the editing process. It was a barrier that slowed everything down.

Editing process on PaperCut's Partner Portal
Editing process on PaperCut's Partner Portal

The difference now is night and day. One of PaperCut's editors told us how excited she was about being able to create pages easily and communicate directly with our team. That direct feedback loop has been huge — most of the new requests we get from editors are actually quite small tweaks that we can turn around quickly, but previously those requests might have gotten lost in longer development cycles.

Dynamic

content variations, based on pre-defined user groups.

5 teams

with access to manage their own content in the Portal.

25+ active users

editing content (and more on the way!)

Managing complexity at enterprise scale

The new Partner Portal isn't just a simple content site — it's a pretty sophisticated platform with multiple layers of access control and personalization. The entire application sits behind authentication, and content visibility is determined by user roles: different users will see different content and have access to different tools.

PaperCut Portal showing variant content

Some users might not even be able to see certain pages — they'll get redirected based on their permissions. Others might see the same page but with completely different content based on their role. One of the more sophisticated aspects of the build is the connection to PaperCut's internal data lake, which provides real-time information about their users. This enables us to show partners live data about their performance compared to other partners. It's the kind of dynamic, data-driven functionality that really showcases what's possible when you combine static site benefits with powerful backend integration.

The platform includes everything from confidential quotes and partner resources to a comprehensive knowledge base that we recently implemented. There are also integration points with PaperCut's separate sales portal, creating a connected ecosystem of partner tools.

Real-world impact and feedback

The response from PaperCut has been overwhelmingly positive, particularly from the content editing team. The shift from manually editing HTML to using CloudCannon's visual editor has eliminated the technical barrier that was frustrating editors previously.

We've also established a dedicated Slack channel for direct communication, which has been invaluable for quick feedback and support, and means we can address issues and implement improvements for their team as fast as possible.

With the new Portal, our teams are empowered to make the changes we need. It's a game-changer, and it feels like a breath of fresh air.

Lisa Cole Miller

Lisa Cole Miller

Global Channel Activation Team Lead

PaperCut

The partners themselves showed a positive response at PaperCut's recent Partner Summit, particularly to some of the new features we'd developed. Though some of those features are still working their way through PaperCut's internal development and approval processes, the initial reception suggests we've built something that genuinely serves their partner ecosystem's needs.

Hybrid architecture in practice

We often get caught up in the "static vs. dynamic" debate, but PaperCut's Partner Portal proves that you can have both. The static build gives you performance and reliability, while API communication provides all the dynamic functionality you need.

The key is understanding where to draw the line. Content that changes frequently or needs to be personalized? That goes through the API. Content that defines the structure and messaging of your site? That stays in the static build where editors can manage it easily.

Feature flags on our content allow for dynamic content variation, which allows us to be able to curate a more custom experience for our Partners.

Lisa Cole Miller

Lisa Cole Miller

Global Channel Activation Team Lead

PaperCut

We've also built the site with internationalization in mind, implementing a custom translation function using next-i18next. While PaperCut is currently operating in English-only mode, the infrastructure is there for them to expand to multiple languages as soon as they're ready — without any additional development work.

Another advantage of choosing the React/Next.js stack is the seamless integration with PaperCut's existing component library. We can easily layer their internal components on top of our custom builds — like we did with the new navigation — creating a consistent experience across all their digital properties while maintaining the flexibility CloudCannon provides.

Finally, the Git-based workflow has been particularly valuable for PaperCut's team. Using CloudCannon's branching capabilities, editors can work on their own features or pages simultaneously without worrying about conflicts with other team members. When I checked recently, there were over 10 active branches that editors had been working on just in the past few days — that's the kind of collaborative workflow that keeps enterprise teams moving efficiently.

The bigger picture

What excites me about this project is how it demonstrates CloudCannon's flexibility for enterprise applications. We're not just talking about marketing sites or documentation — this is a secure, role-based application serving confidential business information to partners around the world.

The hybrid approach we used here opens up possibilities for other complex applications that need both content management simplicity and dynamic functionality. You don't have to choose between a great editing experience and powerful application features anymore.

Our lead generation goes through our Partners, and we can now prioritize work through this sales channel. And because CloudCannon created the components for us we can easily make important things more accessible to our Partners.

Lisa Cole Miller

Lisa Cole Miller

Global Channel Activation Team Lead

PaperCut

Looking ahead, PaperCut has more features in development, and I'm excited to see how the Portal continues to evolve. The foundation we've built is solid, scalable, and — most importantly — allows PaperCut's team to move fast when they need to make content changes.

Sometimes the best solutions are the ones that make complex problems feel simple. For PaperCut's editors, updating their Partner Portal should feel effortless. For their partners, accessing resources should be fast and intuitive. And for their development team, maintaining and extending the platform should be straightforward.

That's exactly what we delivered — and it's a great example of how CloudCannon enables teams to build sophisticated applications without sacrificing the content editing experience that keeps everything moving smoothly.

Want to find out more?

Discover how CloudCannon can help you design, build, and edit your web projects more efficiently.

Marlia Morris

Enterprise Success Manager