Problems When Switching to a Headless CMS

Problems When Switching to a Headless CMS

Switching to headless CMS in live projects can be tricky, We decided to make a list of the 5 main problems we found and how we solved them, keeping in mind that the solution we provide is really project-dependent and that probably there are hundreds of ways to work around these issues.

Most tutorials and articles about headless WordPress (and in general Headless CMS) will guide you through the basics of setup, starting almost from a fresh CMS installation, with a few basic articles and pages. But what happens when you start working on a real project?

In our of our latest project, a client (upon our suggestion) wanted to switch from a monolithic WordPress to a headless React frontend. They run a magazine — online since 2012 — with thousands of already published article, they are well established in SEO, they have a bunch of writers that can’t (or don’t) want to learn a new editing interface or new editing guidelines, they want to improve performance of the site, but still keeping close the actual (monolithic) interface (with some improvements), they want seamless migration of Analytics (they handle advanced analytics with Google Tag Manager) and advertising (their main revenue channel).

That is a bunch of requirements that usually are not taken into consideration in the guides you find online, which usually explains how to connect to a CMS, source the content, and generate a static site (with a framework).

As soon as we started to lay down the project we started to tackle down issues, decisions, and directions to take. We decided to make a list of the 5 main problems we found and how we solved them, keeping in mind that the solution we provide is really project-dependent and that probably there are hundreds of ways to work around these issues.

next

What is Geek Coin

What is GeekCash, Geek Token

Best Visual Studio Code Themes of 2021

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Next.js Router Update: Changes from Next 9.2 to Next 10

In this Next.js 10 tutorial, we are going to see all the changes that happened in the Next.js Router between all the 9.x versions up to version 10.

Next.js Mini Course Wrap Up And Next Steps - Fullstack Jamstack with Next.js (11)

You've learned how to build an entire full-stack application using Next.js, Airtable, Tailwind CSS, and Auth0. Build a Fullstack JAMstack application with Next.js, Airtable, Auth0, and Tailwind CSS. In this series, we are going to walk through building a Fullstack JAMstack application with Next.js from scratch. We’ll use Tailwind CSS for our styling, Airtable for our database, and add Auth0 for authentication.

Next.js API Routes using next-connect

We will create Next.js API Routes using next-connect. We will also show how to have middleware using next-connect for authentication and authorization. Next-connect has an API similar with express.js which feels familiar to most of us =)

Creating Next Generation Applications with Next.js and MongoDB

Learn how to build modern applications with Next.js and MongoDB. Learn how to couple Next.js and MongoDB for your next-generation applications. Next.js is a React based framework for building modern web applications. The framework comes with a lot of powerful features such as server side rendering, automatic code splitting, static exporting and much more that make it easy to build scalable and production ready apps.

Introduction to Next.js – Next vs. Gatsby vs. CRA

Introduction to Next.js – Next vs. Gatsby vs. CRA. In this introduction, we'll talk about: Why Next.js? Fundamentals of Next; Zero-Config approach; Server-side rendering; Code splitting; Next vs. Create React App vs. Gatsby