Being HEADLESS is cool!

Reading Time: 4 minutes

Hi! Welcome to this two-part series wherein first I am gonna explain what is headless CMS and in second we are gonna create an end to end dynamic angular app with headless CMS for serving the API requests.

In short, there will be no hands-on tutorial on this blog.

Overview of headless CMS

Let’s learn

So, if you are a complete beginner to the web development world or you just stumble upon on this, you might not know what is a CMS after all and what’s this heck about someone being headless? Worry not, first let’s clear out the basics.

What is CMS?

In down to earth laymen term – a CMS is a system that manages content. CMS stands for content management system.

In mediator terms – a content management system is a tool that helps a user to build a website from scratch without any knowledge of coding. Creating websites on the internet needs some technical expertise. Interestingly millions of internet users don’t know much about the technical details of the internet and they just want to have their own websites available on the internet. Therefore, here comes the gift of gods for such netizens, CMS. Instead of building everything from scratch, the CMS handles all the infrastructure stuff for its users. The GUI makes it even simpler for the user to create a website in about 5 to 10 mins.

In developers term – A content management system is a software that lets its users interact with certain tools that can create, edit, archive, publish and distribute content in a user-friendly interface. It effectively manages the interaction of the user with the website database.

Concise to the point – you wanna build a website and don’t want to code stuff, CMS is here to help you.

So, CMS is a whole package, it includes your website frontend, its backend, and the layer of interaction between the frontend and backend. We can say CMS is full body. Examples of such – WordPress, Sitecore, Wix, etc.

What is headless CMS?

We now know what is CMS, let’s focus on being headless now. So, headless CMS or decoupled CMS is one of the types of CMS which has gained massive popularity in the last couple of years.

Such CMS doesn’t have a frontend, meaning they will only provide you means to manage the backend of your website. Therefore, its a body without a head. It remains an interface to add the content and in order to deliver that content, it provides RESTful API whenever the user needs it. Due to such awesomeness, it doesn’t care how and where your content is displayed.

Traditional monolithic CMS

Headless CMS solves one of the core limitations of traditional monolithic CMS which is not able to handle the flexibility of data/content. The reusability factor was very much less in traditional CMS. But in headless the flexibility of your content is endless. Since your content is not tied down to a presentation layer you can easily reuse the content to present it in any way you like, any number of times you want.

Headless CMS

Creating a website, with this headless CMS is a big task, users must be aware of many things, and its specifically not design to be used by the netizens that don’t know squat about web development. For developers it’s an icing on a cake as they don’t have to learn a specific technology to work with a CMS, they can just use any frontend technology that they are familiar with, and voila build awesome web applications or websites.

Use cases

Where one shall use headless CMS?

  • Build a website with a technology you are familiar with.
  • Websites, Web apps that use JavaScript frameworks (VueJs, React, Angular)
  • Websites created with static site generators (Jekyll, Middleman, …)
  • Native Mobile Apps (iOS, Android, Windows Phone)
  • Enrich product information on eCommerce sites.

Point to be Noted – A headless CMS can deliver the content/data anywhere be it website and or mobile app (iOS/Android).

Options we have for headless CMS – Storyblok, Strapi, Contentful, Prismic, Netlify, etc.

So, here I conclude this journey. I will see you in my next practical implementation of headless CMS.

Takeaways –

  • What is the traditional CMS?
  • What is headless CMS?

That’s all for now folks. I hope you have learned something from this blog. If you liked it then please hit the thumbs up and share it with your friends, family, or colleagues. Also, please help me improve by giving healthy feedback (below comments). Follow me to get updates on more interesting blogs.

For more insights on latest technologies visit – https://blog.knoldus.com/

Written by 

Shubhrank Rastogi is a FrontEnd Software Consultant at Knoldus Software LLP. He has done MCA from BVICAM, Paschim Vihar, New Delhi. He has a decent knowledge of Web Technologies like JS, TS, Angular, and currently exploring the Ionic framework and React library. He is also a die-hard fan of futuristic gadgets and a tech-savvy person who has a good appetite for delicious food.

Leave a Reply