thumbnail

Headless CMS or Naw?

A CMS is a Content Management System. This is a way for a website owner to make changes to the text/images/whatevah is shown within the code of their website. No code changes required, just change the text we want to appear.

CraftCMS, it is packaged with Twig, a PHP based templating language. This is done because PHP is a server rendered language; the computer that is responding to the person typing 'https://www.my-website.com' is creating the whole HTML file and sending that, where nothing interactive can really happen. This is great if you are pulling text/assets and laying them out on the page, but if you want to create something more than the average 2004 website, you need to allow for interaction from the user with you application. In comes Headless CMS.

A Headless CMS is one that has no expected frontend system in place. In the case of CraftCMS, they anticipated the desire to allow flexibility with creating the frontend for the code, so they allowed a HeadlessMode variable and implemented GraphQL out of the box with CraftCMS V4.x.  With a simple playground already built for me, it makes it possible for someone like myself who has 0 experience with GraphQL. Then it's just a matter of configuring the bundler of choice (Vite for me, but webpack or others would work fine) to handle building the app correctly, and setting up the necessary network requests that are no longer being done by Craft and Twig on the server.  The Client (a fancy word for the computer the person who typed 'https://www.my-website.com') now has to do the work of sending the network request back to your server and then rendering (painting) the new screen. This now adds the layer of 'how good is the computer/phone this person is using and how fast is their network connection'. 

The benefit of putting the burden on the Client is unlocking the HUGE community of developers who are putting out free code examples on some saweeeeeeet elements to incorporate in your own website. A beautiful and interactive front end, a CMS backend that lets any average Joe keep the content of the website up to date, and GraphQL being the API between the two means there is only a 'little bit of stuff to understand' when trying to piece this whole puzzle together. I chose to stick with CraftCMS as the company I work for already had been using that for years.  I chose Vite because of the StateOfJS surveys and actually found it fairly painless. I chose React because I took my MERN stack coding bootcamp and worked for 3 years at a company developing a React based EHR application. 

The next chunk of life building websites is hosting and maintaining, a whole post on its own. Blah, not my favorite. DNS, paying for servers, monitoring.... it never ends!

Thanks for reading!

Let me know what you think on github