Defining a Headless CMS
This seems to be a popular buzz phrase in recent years but for a great meaning, a headless content management system or headless CMS is a way to let the a CMS handle only the data and a modern JS framework, like react, Vue, Svelte, etc handle how to display the data. Headless Wordpress is using WordPress to manage the content as the backend.
Defining JAMstack and Static Site Generation
A modern web development architecture based on client-side JavaScript, reusable APIs, and prebuilt Markup
Jamstack approach uses JavaScript to connect to third party backends, such as headless WordPress to create static generated sites, called pre-rendering or compiling, the data into basic HTML, JS, and CSS files.
Why a Headless WordPress Approach?
WordPress already claims over 40% of the web is built on its platform. So it's familiarity as managing content is widely popular. However, WordPress can be infamous for being bloated and insecure. When we remove the "head" and only use WordPres to manage data, we can create a blazingly fast and secure website that will leave your competitors in your wake.
Some benefits of headless CMS development in general
- Easy to integrate multiple data sources into one frontend framework like using WordPress for basic data and shopify for ecommerce.
- Removing a lot of security concerns through database exploits. Can't exploit a database if there isn't one connected to the frontend.
- Blazingly fast static generated site that leveraging modern techniques like code splitting, mage optimization, inline critical styles, and much more to give you off the charts performance scores.
Headlesss WordPress JavaScript Frameworks
I have an experience in a variety of JavaScript frameworks. I have used several JS frameworks to build headless CMS and specifically headless Wordpress solutions such as:
- Gatsby JS
- Frontity
- Next.JS
- Eleventy
- Wp Engines Atlas