Moving to Jamstack: a Case Study of Mambu

Last update: Tuesday, September 8, 2020

Written by: Michal Zielinski

Gatsby, Sanity, and Netlify for the only true SaaS cloud banking platform.

In early 2019 Mambu, a technology company that powers fintech, banks, and lending businesses with its cloud-based core banking platform, approached us about moving their marketing website to Jamstack. They wanted a modern stack and no compromises on performance and security.

Building websites for large organizations can be tough. The issue of choosing a technological stack is one thing. Working with various stakeholders and fulfilling their expectations is another problem to crack.

With 300 employees and 9 offices worldwide, the scale of Mambu's operations is truly global. We knew we'd have to approach their case in a different manner.

[@portabletext/react] Unknown block type "numbers", specify a component for it in the `components.types` prop

The client

When Mambu approached us, they were moving their company website from HubSpot CMS. They wanted to improve the visual aspects of it but also use a more performant and reliable stack that allowed for global scaling while ensuring marketing consistency. As a company serving financial institutions, it was extremely important for them to make sure their new website is as secure and as fast as possible.

The Mambu team was already well into the Jamstack and they knew what they wanted so we quickly settled for a stack of Gatsby, Sanity, and Netlify. A couple of reasons for it.

The tools chosen for the project are well-known to be reliable, secure, and future-proof. On top of that, we have had positive experiences with them previously while working with other clients of ours so we were able to vouch for them.

For us as developers using the best-in-class tools that we already know means we can move much faster with production. With agility being one of Mambu’s core philosophies being able to start quickly was a huge plus for us.

When Mambu approached us, their legacy website was sluggish, overly complex and lack of structured data, making it hard to work with. They wanted to change that, put a fresh design in place, and simplify workflow for different teams but keep their best practices.

[@portabletext/react] Unknown block type "newsletter", specify a component for it in the `components.types` prop

How do Jamstack and Gatsby benefit large organizations?

Jamstack and Gatsby are great architectural choices that go beyond high performance. With React being the foundation of Gatsby, it is easy to pull and combine data from different sources and to create more dynamic parts of the site.

Mambu already had established structures. Different teams at the company used different tools for their operations. We had to integrate the website with those services so, for example, the HR team could still use Lever for job listings, the marketing team could continue to receive leads via HubSpot and the customer success team could access customer data through a portal app.

Thankfully, Gatsby has a rich plugin ecosystem that made integration simple and allowed the teams to continue using their preferred services.

Most importantly, the Jamstack approach helped get things up and running very quickly and gave us a lot of room to implement new ideas. Going for Gatsby and other established tools in the stack ensured that we don’t spend time re-inventing the wheel and that we get the best possible results.

Keeping the content under control with Sanity

The headless CMS Mambu chose was a great pick for their use case. We found Sanity to integrate very well with Gatsby. Not only did it allow us to fetch data from their API very quickly but it also to build a real-time preview for the content editors.

Mambu wanted flexibility and Sanity enabled us to build something that allows it. Moving away from a traditional CMS also meant improved security and performance (the Jamstack benefits).

But most importantly, Sanity's block content enabled us to create embeddable blocks for the editors that they can drop into the rich text fields and build complex page layouts in a flexible manner. The plans are to make a design system that would make it easier for editors and designers to collaborate in Sanity.

CI/CD handled by Netlify

In the stack, Netlify makes for the build and deployment platform.

The platform integrates seamlessly with Gatsby and requires almost no configuration and is fully managed. This means no more waking up on-call engineers that will have to revive an application server that crashed in the middle of the night.

Netlify has unmatched uptime. During the course of the year that we have been working with Mambu, there wasn't a single second when Mambu's site wasn't available.

For us as a development team, working with Netlify has been continuously a great experience both with the basic functionalities but also more advanced features such as serverless functions.

Few technicalities

So, what has been different for us while working with Mambu from a technical viewpoint?

Probably, the most notable change for us has been the use of TypeScript instead of JavaScript. In the long run, the biggest advantage of using TypeScript is that it made it much easier to implement new features and screens based on older components and logic. TypeScript is worth the additional effort because it really helped us maintain the codebase better and cut the time of onboarding other developers to the project.

In terms of maintaining quality and consistency, we have been using various linters, unit tests, and end-to-end tests. We have found those very helpful when maintaining the codebase because we were able to spot potential issues very quickly.

How does working with large companies differ from working with smaller ones?

Working with large companies means various stakeholders are involved in the process. As a development team, we had to incorporate their unique preferences and opinions into the final product.

With this in mind, it was of utmost importance that our communication processes were flawless. For us, that meant being transparent and proactive so that we knew what we built for them was as good as possible.

Quote

Having worked intensively with Bejamas on multiple projects, our partnership has
been a professional and productive experience with impressive results to date.
The team is responsive, full of ideas, and delivers on their commitments. I can
highly recommend Bejamas as a serious partner in modern web development projects
involving Jamstack and React.

Eppo HeemstraMarketing Operations Manager at Mambu

While Jamstack may seem like a fairly fresh approach, it shines when it comes to reliability. This I believe will be the most important expectation that you'll get when working with large organizations.

With Jamstack, going safe does not mean that the end-product has to be boring. It gives you a lot of space to implement even the most complex ideas.

Have a project at hand you’d love to be Jamstacked? Let’s talk!

CLICK HERE to schedule a 1-on-1 talk and let us show you what we can do for you and your business.