The ‘Decoupled’ CMS

March 19, 2019

“Decoupled” or “Headless” CMS usage is gaining a lot of traction in the web development world as a way to free front-end developers from the constraints of working with the built-in display layer (themes, templates etc) of off-the-shelf content management systems.

A typical website built in WordPress or Drupal, uses that CMS as both for administration and editing of content and for actually displaying the website in the browser itself. This means that the front-end development of the website is tied intrinsically with the back-end. Front-end developers then, must not only have a knowledge of general web technologies (HTML5, CSS, JavaScript etc) but be familiar with the theme structure or templating engine that the back-end CMS has chosen to deliver content to the browser.

By “decoupling” the CMS from the front-end web experience, content is delivered from the back-end via an API/Web Service, usually in JSON format, and then parsed into a custom front-end application that is independent from the back-end. While not appropriate for all implementations, this approach offers a significant number of benefits in delivering a website:

• Your front-end development team does not need to learn a proprietary CMS theme system in order to develop a great looking website. Rather than spend time learning the ins and outs of a new content management system’s theme system, they can build the site in whatever agnostic technologies and frameworks they prefer.
• Amalgamating content from various sources or publishing content to multiple websites is very simple as all data is made available as a feed. One CMS could be used to house shared product information or promotional offers across a network of retailer sites, while those same sites could easily have a separate CMS for administering their own specific content. That content could then also be made available as a web service feed to other affiliated sites.
• Website performance and user experience for the visitor can be drastically improved by using “best of breed” front-end frameworks and techniques, unrestrained by compatibilities or complexities of the CMS’s front-end layer. While the CMS may run an older stack like Apache and PHP, the front-end website could be completely built on faster, more responsive front-end technologies Node, React or Angular.
• Your front-end website is less exposed to targeted hacks of off-the-shelf CMS’s. Widely used CMS’s like WordPress and Drupal are constantly being scrutinised by hackers for exploits, leading to a lot of automated hacking attacks. While patches are continually released to address these holes (the same as your desktop operating system), there is always a risk of your website falling prey to some kind of hack or malware injection. Because your main back-end system is obscured from general browsing, decoupling your CMS may provide an extra layer of protection between your front-end and back-end systems.
• CMS upgrades are less likely to break your front-end website unless changes are made the content delivery API, whereas building a site entirely in WordPress, for example, upgrading the back-end may also require updates to various plugins that impact the way your website is viewed in a browser
• Updating the look and feel of your website can be easily separated from the back-end, making it easier to redesign a website without having to reimplement or modify the CMS.
• Likewise, switching to a different back-end content management system without changing your front-facing website is a much simpler proposition as the only changes to be made will be related to the web service API.
• This solution empowers mobile app development by making communication between your regular website and a dedicated app much easier. Also, a decoupled website can easily be packaged as a PWA (Progressive Web App).

In short, decoupling your CMS allows your business to benefit from having access to the excellent content authoring and management experience offered by the likes of Drupal and WordPress, while also gaining the benefits of a fully bespoke, fast and secure front-facing website.

So, everyone should decouple their websites, right? Well…not necessarily.

While the list of benefits is significant, there are certainly drawbacks to be considered using this approach:

• Added complexity. Instead of running one website instance, you are now hosting two, possibly on completely different technology stacks. You also now have two separate code repositories requiring a different set of skills to maintain.
• With complexity comes cost. This is a difficult one to quantify as, there may be implementations where a decoupled approach saves money but generally speaking, the up-front development costs will be higher from delivering two systems. On the other hand, as outlined above, front-end development may be more efficient as front-end developers do not have to struggle with the limitations of the CMS in delivering UX or accurate translation or designs, also upgrades and “sidegrades” between CMS’s are much simpler, so ongoing costs may be lowered in those cases.
• “Live preview” functions in the CMS will not be available as the presentation of the website is delivered in a separate application.

So, who should decouple their CMS then?

The decoupled approach best suits businesses who:

• Require a “one to many” approach to content, with articles, images and other nodes being pushed to multiple websites from a central source.
• Likewise, a site using a “many to one” approach of amalgamating content from different sources may be best served by a bespoke, decoupled application than trying to implement fully in a traditional CMS structure.
• Are concerned foremost with delivery of highly interactive, beautiful websites using best-of-breed features for visuals, speed, responsiveness and UX.
• Wish to utilise large parts of their website as a mobile app or PWA.
• Require a lot of integration with a lot of third-party services.
• Are likely to make significant changes to their back-end technology stack or implement regular front-end redesigns.

Going forward, the decoupled approach is likely to become more common in the web development space. Both open source and proprietary CMS’s have come a long way in including “out-of-the-box” support for API services which enable decoupling of the back-end. The front-end development world continues to evolve at a rapid pace, particularly an increasing client expectation on interactivity best provided by the new wave of JavaScript frameworks like React and Angular, Polymer Web Components, and many more innovations that are difficult to implement using a traditional CMS model. So, if you are starting from scratch on a new web project or looking to revamp an existing one in 2019, its definitely worth taking a very close look at the decoupled approach!

If you’d like to discuss your website or software development options with The Bridge at no cost or obligation, feel free to call Lawrence on 02 9993 3300 or email lawrence@thebridgedigital.com.au