Hooking up our WordPress with a Gatsby generated site, will be the first steps we are talking on our journey towards a client-ready static-dynamic ...
For further actions, you may consider blocking this person and/or reporting abuse
Hey, maybe this can help someone....or maybe its a teething problem.
My createPages kept failing when initially running gatsby develop...."Cannot read property 'uri' of null".
I removed uri from the query and it worked fine.
I then replaced it after 'isFrontPage' and it worked but wouldn't work if I placed it anywhere else in the query.
Possibly just a quirk in my enviroment but thought worth sharing....or if anyone has an explanation.
Respect Henrik!
Hey Henrik,
Thank you for this tutorial, which is I think a good way to get started with gatsby + wp :)
I had an issue when starting the project at the end of this part of the tutorial. The page and post were being created with an extra '/' at the end of the path, resulting in blank pages at localhost:8000/sample-page/ . I had to change let pagePath =
/${page.uri}/to let pagePath =/${page.uri}in order to have it rolling.Any idea why this happened?
Thank you !
Could be that WPGraphQL changed in the newer versions. I'll have to check.
Heya, so I just tested it with an older and newer version of WPGraphQL and indeed the newer version has a slash now in the end of the
uri. So I'll have to update the tutorial. There has been a lot of breaking changes in WPGraphQL lately, so I'll go over some more stuff too, as soon as I have some more time. Thanks for the info ✌️I just updated this part.
home), we instead check the page forisFrontPageand use/as a path.index.jsin the pages folder.I updated the codebase of all the parts.
Hi Henrik, great and advanced guide on the topic thanks for the tutorial and tips. I wanted to mention another local development tool called DevKinsta which works out of the box on your local computer.
Very nice article, thank you for taking the time to jot this down! Currently we're running NextJS apps where the data is fetched from Wordpress on every request. I planned on taking Gatsby for a spin and with your article(s) I'm pretty sure I'll make progress faster 🙏🏻
I just found a minor thingy in this sentence: "As soon as you are usinging it with Gatsby" > I think you meant 'using' instead of 'usinging' 😬
Hi Robbert,
thanks for suggesting the typo fix. It is so much to write down, I often forget to even proof-read it once. So, that is more than welcome, also for the upcoming parts.
If you find some more typos, I host all my articles here: github.com/henrikwirth/dev.to/tree...
Feel free to create a PR or if it suits you better, a comment here is also welcome.
Glad you like the tutorial so far. Actually I really would love to give NextJS a spin also, but my time is limited, so maybe next year. I'll keep you in mind ;)
Hello Henrik!
To deploy at production, the WordPress site must be at HTTPS, either Mixed content error raised by the browser and blocked the resource to load.
Where we can host with WordPress or say PHP project with SSL service enabled like Netlify, Zeit, Heroku, etc. ?
I can't tell you where to host the site. Any website host that runs PHP and gives you SSL is fine I guess. For the tutorial you can just use a local installation. I used Local by flywheel. It also gives you an option to expose your local WP to the internet. I think the nextpart of the tutorial talks about that a bit more.
Hey, I keep getting this error.
warn The gatsby-source-graphql plugin has generated no Gatsby nodes. Do you need it?
After this are several graphql errors e.g.:
There was an error in your GraphQL query:
Cannot query field "wpgraphql" on type "Query".
Looks the the plugin won't install for me, not sure what to do here. Any advice appreciated!
Seems like something with your GraphQL query is not aligned with the newest version of WPGraphQL. In general the advice is to use the new v4 version of gatsby-source wordpress plugin. Sadly this tutorial is a bit out of date.
what are the pros/cons of using between
gatsby-source-graphqlandgatsby-source-wordpress?Well, the old
gatsby-source-wordpresswas using the REST API of WordPress to create the schema. This ended up being a "not so well formed" schema, which made it hard to work with. So certainly I don't recommend usinggatsby-source-wordpressas it is now.That being said Tyler Barnes is working on this PR: github.com/gatsbyjs/gatsby/issues/...
The idea is to use WPGraphQL as base, which would be similar as the approach with
gatsby-source-graphql, but with a lot of additional goodies. I think they are trying to get it ready until roughly March.So as of now I recommend using
gatsby-source-graphqlwith WPGraphQL, because that will be closest to whats coming with V4 of the Gatsby-WordPress plugin. Jason Bahl, the lead developer of WPGraphQL is working for Gatsby for some time now. So this should support the fact, that WPGraphQL is the way to go with Gatsby.Asante, gwe asinga papa