400% increase in organic traffic
With the help of our easy-to-use page-building system, we helped Calendly create a fast, modern CMS-powered website.
Expertise
UX/UI Consulting
JamStack Development
JavaScript Development
Web App Development
Headless CMS
Quality AssuranceTech Stack
Gatsby
Contentful
React / Typescript
Node.js
CloudFlare
AWS LambdasDeliverables
Marketing SiteDev PortalBlogCalendly is the leader in automated meeting scheduling.
The platform offers simplified scheduling, used by more than 10 million users.
Furthermore, Calendly places the meeting workflow on autopilot, sending everything from reminders to thank you notes, allowing users to focus on other work and save time.
FatCat Coders is a highly-skilled, highly capable group of thinkers, strategists, and workers. You improve all the time, and I can see it. I would consider you more than engineers or designers, you bring strategy and I appreciate it.
Ty Collins
VP of Growth Marketing @ Cart.com
Former Head of Digital Acquisition & Content @ Calendly
The Problem
A monolithic system bundled both the product application and the marketing site. In addition, due to the nature of the system, the marketing site had to pass a complete application release cycle. Thus, a prolonged process prevented the marketing team from iterating fast.
In the absence of a content management system, all changes that had to be done by developers and marketing had to wait until their tasks became a priority.
Moreover, multiple Calendly systems, including the Blog and the Dev Portal, were experiencing the same issue.
Challenge
We had to separate marketing sites from the monolithic application so that it became independent but kept the same quality control process of the original system.
Our next challenge was to reuse the look, feel, and quality across all new sites and make it easy for the marketing team to change and iterate the system with minimal effort from developers.
With this is mind, we had to solve
- Reusability
- Simple deployments
- Quality control
- Give control to the marketing team and provide a CMS
- Fast Iterations
- Reduce developer time
- Security
The Solution
The solution we came up with was a Jamstack based on Gatsby and Contentful with reusable components.
Reusability
To achieve reusability, we used a component-based build system that could be reused across multiple sites.
At a core of a component system lies React, the library developed by Facebook for front-end application development.
With Gatsby and our custom-made UI library based on Atomic design, we came up with the solution.
Simple deployments
The primary function of Gatsby is to pre-build React code into HTML/CSS that can be delivered to consumers quickly and easily.
With these options and the Gatsby cloud tool, we had a straightforward process for building and deploying the site.
Quality control
A system like Gatsby rebuilds the site and creates static files, providing an additional layer of quality control.
Furthermore, if there is an error in the code or missing data, the Gatsby framework will not build the static site and, therefore, not release it.
As a result, critical or blocker issues are prevented from being released into production, and marketing people are less concerned about what they are doing.
Control to the marketing team and CMS
As a system like Gatsby still needed a way to manage data, we turned to a headless CMS that could support multiple languages.
The choice was the best on the market, Contentful. As a data source, Contentful integrates seamlessly with Gatsby.
With Gatsby and Contentful, we created an easy-to-manage CMS-like system through simple data management.
Using this tool, the Marketing team could control the whole site, edit all parts of the site, and create new pages based on existing components. Magic was born.
Fast Iterations
As a result of a component-based system and the ability to change things on the fly through Contentful, the marketing team got a massive boost in delivering changes and fast iterations.
Moreover, Contentful provides a history system that allows all changes to be rolled back at any time.
Reduce developer time
Now that the Marketing team manages their sites, developers are not needed as much.
Security
Due to Jamstack, the site has no real-time access to data and is only a static site, so hackers cannot abuse the system or steal sensitive information.
The Problem
A monolithic system bundled both the product application and the marketing site. In addition, due to the nature of the system, the marketing site had to pass a complete application release cycle. Thus, a prolonged process prevented the marketing team from iterating fast.
In the absence of a content management system, all changes that had to be done by developers and marketing had to wait until their tasks became a priority.
Moreover, multiple Calendly systems, including the Blog and the Dev Portal, were experiencing the same issue.
Challenge
We had to separate marketing sites from the monolithic application so that it became independent but kept the same quality control process of the original system.
Our next challenge was to reuse the look, feel, and quality across all new sites and make it easy for the marketing team to change and iterate the system with minimal effort from developers.
With this is mind, we had to solve
- Reusability
- Simple deployments
- Quality control
- Give control to the marketing team and provide a CMS
- Fast Iterations
- Reduce developer time
- Security
The Solution
The solution we came up with was a Jamstack based on Gatsby and Contentful with reusable components.
Reusability
To achieve reusability, we used a component-based build system that could be reused across multiple sites.
At a core of a component system lies React, the library developed by Facebook for front-end application development.
With Gatsby and our custom-made UI library based on Atomic design, we came up with the solution.
Simple deployments
The primary function of Gatsby is to pre-build React code into HTML/CSS that can be delivered to consumers quickly and easily.
With these options and the Gatsby cloud tool, we had a straightforward process for building and deploying the site.
Quality control
A system like Gatsby rebuilds the site and creates static files, providing an additional layer of quality control.
Furthermore, if there is an error in the code or missing data, the Gatsby framework will not build the static site and, therefore, not release it.
As a result, critical or blocker issues are prevented from being released into production, and marketing people are less concerned about what they are doing.
Control to the marketing team and CMS
As a system like Gatsby still needed a way to manage data, we turned to a headless CMS that could support multiple languages.
The choice was the best on the market, Contentful. As a data source, Contentful integrates seamlessly with Gatsby.
With Gatsby and Contentful, we created an easy-to-manage CMS-like system through simple data management.
Using this tool, the Marketing team could control the whole site, edit all parts of the site, and create new pages based on existing components. Magic was born.
Fast Iterations
As a result of a component-based system and the ability to change things on the fly through Contentful, the marketing team got a massive boost in delivering changes and fast iterations.
Moreover, Contentful provides a history system that allows all changes to be rolled back at any time.
Reduce developer time
Now that the Marketing team manages their sites, developers are not needed as much.
Security
Due to Jamstack, the site has no real-time access to data and is only a static site, so hackers cannot abuse the system or steal sensitive information.
Accessibility
In cooperation with Deque University, our team implemented all requirements to meet the A and AA levels of WCAG compliance regarding the Calendly application and sites.
With this in mind, we ensured accessibility was a mandatory part of the future development process.
Long story short
Calendly marketing sites have grown a lot, and many changes and iterations are applied without the need for engineering support. Due to its success, this system will last for a long time.
We at FatCat take pride in our responsability for the core architecture behind the system, the atomic design's introduction, and the UI library.
Get started with FatCat
Join companies who choose to bring their website operations to the next level and scale efficiently and effectively.
