Biens

Built with Next.js and WordPress as a headless CMS

This website is built in Next.js and gets the ultimate score in lighthouse:

It uses WordPress as a headless CMS so the client can edit any aspect of the website. It revalidates the content whenever there’s a change made in the CMS. Therefore the website keeps it speed by being fully SSG. To grab the data in the Next.js app I used Apollo/Client and installed WPGraphQL for WordPress.

The WordPress admin only functions as a backend. In WordPress I have completely disabled the front-end part of it and made custom post types and options pages to edit the content. With the plugin Advanced Custom Fields I was able to set all of this up and make it really easy for the client to edit the website. Here’s an example of the admin seen from a clients perspective:

The website is developed and designed with keeping modern standards in mind. The design got approved right away after changing the section latest posts for what is now latest Instagram posts.

The website features an latest post from Instagram section. To achieve this we had to use Facebook API since Instagram merged theirs with the one of Facebook. Therefore the approach is a bit different than normal. From Facebook we get a accessToken. With this we can access the Instagram Basic Display API and fetch the latest posts from their profile. This is in compliance with the new rules of Facebook for Developers program.