Create a Next.js Frontend for Headless WordPress

I want to create a Next frontend for a web.headless-wordpress site. To do that I’m going to use this example from the next.js repo as a starting point.

I already Created a Wordpress Site on AWS and now the only thing I need to add is the graphql wordpress plugin.

After that it was just a matter of changing the environmental variable in my Next project to point to http://mywordpressadress/graphql, adding a couple sample posts with a featured image and excerpt, deleting the generic first post that didn’t have a featured image, and then running yarn dev to verify that everything worked.

I had some trouble deploying to Netlify at first because the Next.js template I used has Server-side Rendering, but after I discovered next-on-netlify. I was able to deploy it no problem. (It worked the first time when I deployed to Vercel).

Contact

Content is copyrighted 2019-2021 © D.S. Chapman. This site was built using GatsbyJS. Code for this website is open source and available on Github