This is a headless implementation and complete rewrite of the front-end for The Architect's Newspaper built with Nuxt 3, Vue, and TypeScript. It uses Apollo to fetch content and WPGraphQL to serve the WordPress content as a GraphQL API. It also uses the WPGraphQL ACF plugin to fetch custom fields.
Custom types and resolvers were created to fetch content from the WordPress API and serve it through the GraphQL API, which is then consumed by the decoupled front-end. The front-end was made possible by the use of Nuxt, which provides a robust framework for building Vue applications. Nuxt provides a number of features that make it easy to build a fast, responsive, and accessible front-end. Thanks to Nuxt, we were able to build features like infinite scroll, post view counters, popular and trending indicators, all in the matter of a week.
Because the front-end is completely decoupled from the WordPress backend, updates to the front-end can be deployed without affecting the WordPress backend. This makes it easy to deploy updates to the front-end without affecting the ongoing work of the editorial team, or causing any downtime. We also use GitHub Actions to automatically build and deploy the front-end, as well as clearing the CloudFront cache, making deployment a breeze.
The result is a fast, responsive, and accessible front-end that is easy to maintain, update and deploy.