Biggest Challenge: Finding the Developers

At the beginning of this year, we realized our offering was too complex and confusing. We knew the only way out was to simplify it. We made a bold decision to merge several products into a single Kentico Cloud offering just a few weeks after our big launch in Las Vegas. The only question was “How quickly can we do that?”

We gave ourselves just five weeks for the redesign. We started with UX testing based on a few wireframes while, at the same time, writing all content in Kentico Cloud. Our graphic designer immediately started working on the new design. Yes, the one with a headless horseman!

The biggest challenge was how to find the developers in such a short time frame. We hired an external front-end developer without Kentico Cloud knowledge who prepared a responsive HTML prototype. 

We wanted to build the site using ASP.NET MVC. But where to find a .NET developer? We couldn’t take people away from their work on products. But what if they spent just one day? 

So we gathered 8 developers from various teams across the company for a one-day hackathon. In just one day, they converted the HTML prototype into an ASP.NET MVC application that dynamically retrieves the content from Kentico Cloud.  

Let’s take a closer look at how we did it.

Project Planning Is More Flexible with a Headless CMS

Below, you can find our project timeline. Similar to what Andy Thompson, CTO at Get Started, presented in his great case study, we found out that the roles were able to work more independently. That makes it easier to outsource some parts of the project and allocate people’s time more flexibly. 

Moreover, compared to the traditional CMS implementation, we were able to prepare all content side-by-side with development, instead of waiting until the website was developed.

Headless CMS Instills Proper Content Strategy

If, like us, you’re passionate about content strategy, you know that using a traditional CMS won’t help you with this. The content is often mixed with the presentation and you cannot reuse it in other channels or when you decide to redesign your site. Moreover, you often need to build the site first and then write the content into templates.

Thanks to the headless CMS model, we started with content first and we created most of the content before writing any code.

We decided to split the content into reusable components. Below, you can find an example of how we structured the Product page content—the headline, header image, and some metadata for the page. All the product features are stored as modular content listed in the Features element. 

Why is this important? Let’s say we decide to add a mobile app, chatbot, or Alexa interface. Not only will we be able to reuse the content, but the granular content will allow us to provide customers with relevant answers to their questions on individual features.

Front-end Developers Do Not Need to Know the CMS

Front-end developers tend to hate working with a traditional coupled CMS as they spend lots of time working around its limitations. There’s no such thing with a headless CMS—they can simply do their job, following the best practices and standards. Once done, they hand over static files to the back-end developers. 

It means the front-end developers don’t need to be familiar with a given CMS, so it’s easier to find someone available when you need. We actually hired an external front-end developer without any Kentico Cloud knowledge to convert the design into an HTML prototype. 

Back-end Development Finished in One Day with No Prior Experience

We finally came to the hackathon day. We knew we had to make it in one day as we wouldn’t be able to take those developers away from their projects later.

We gathered 8 full-stack developers who never worked with Kentico Cloud, so this was their first experience. They went through the documentation a few days before, but that was all.

We used ASP.NET MVC and simply converted the HTML prototype into Razor views and added controllers that call the Content Delivery API using the .NET SDK to retrieve the content from Kentico Cloud. The development was actually pretty straightforward—once you’re familiar with API, you just write code as you’re used to.

It would have been even easier if we had used our new .NET boilerplate with code generation and other power-ups for developers, but it wasn’t available at the time we built the website.

Going Cloud-first with GitHub, Microsoft Azure, and Kentico Cloud

In the traditional CMS world, developers spend their precious time installing the CMS and configuring the environment, including web servers and databases. 

In order to save time, we decided to use only cloud-based systems for this project. We used GitHub as a code repository, which enabled a smooth collaboration among developers. 

The code of the website is actually fairly lightweight—all it does is call the Content Delivery API and display the content. That’s it! It means the site doesn’t need any database or complex infrastructure. Plus, there’s no CMS code to take care of.

We use Microsoft Azure Web App to run the site. It was a clear choice as we don’t have to worry about anything—we just deploy our code, no System Administrators required. We use a staging slot in an Azure Web App instance to run a preview of the website where both developers and content editors can see the changes to code and content. 

We run the production website using two medium Web App instances for high availability, but we plan to reduce the infrastructure to a single small Web App instance as we don’t utilize even half of its capacity. 

Below, you can see the deployment schema:

Third-party APIs Provide Simplicity

In comparison to a traditional CMS, the headless CMS products may look limited at first sight.

In the traditional on-premise world, all-in-one solutions offered many advantages over best-of-breed solutions as you didn’t have to implement complex integrations and manage multiple products with a different upgrade life cycle. 

Today, the new cloud-based API services make the integration easier. It means a headless CMS can focus on what it does best—providing content as a service. But what if you need more?

For our website, we needed some additional features that are not natively supported in Kentico Cloud. We integrated the website with some additional services, including Disqus for blog comments, MailChimp for newsletter subscriptions, and Google Analytics to analyze the traffic. We use Intercom.io live chat to answer visitor questions.

We also use our own customer engagement functionality available in Kentico Cloud to collect contact details and analyze the behavior of individual visitors on the website. 

In the future, we plan to enhance the stack with additional third-party API services, such as full-text search, to benefit from the microservices model.

Change Your Mindset and Benefit from a Headless CMS 

Let me wrap up with the main benefits of a headless CMS based on our real-world experience:

• More flexible project planning enables effective allocation of people
• Business users can create content without dependencies on developers
• Developers can use the tools they like and follow general best practices rather than adhere to a proprietary CMS architecture
• Very short learning curve—developers can use their existing programming skills and simply learn the API
• Deployment and maintenance of the solution are much easier as you only care about your website code

On the other side, we’re certainly missing some out-of-the-box functionality available in Kentico EMS, such as online forms, blog comments, or newsletters. However, as described above, we used external API services instead—it only requires a change in mindset.

After finishing this dogfooding project and building a new site in just one day, we were really excited about how smooth it was to build a site using a headless CMS.