Wordpress - Gutenberg - dynamic blocks - Can I completey avoid PHP and go full React?

Question

Recently I've created a Sanity.io - Gatsby.js project. And the current project I'm working on is a Wordpress website. Now, I'm working for the first time on a custom Gutenberg Block and was happy to find out a big part of it is in Javascript.

I was happy to start learning more about this. But soon I found out that Gutenberg, when it comes to dynamic content, immediately jumps back to PHP with a callback. And from there on, it's well, php.

So that got me wondering. Is there a way to avoid PHP in gutenberg blocks? And work with React Functional Components. As a "simple" learning project I want to create the following.

• Create a Gutenberg dynamic block Post Grid with front and backend filters
• After initializing the block no PHP
• In the backend/edit select post items amount and offset (skip first x amount) (when you know this you can filter on more cases)
• In the frontend a (dropdown)filter that filters on category (if you know this you can live alter the query on other ways)

Thoughts

• I guess WP's REST API would be best to query from.
• GraphQL for querying? (Or GROQ?)
• Would turning to React make your block more future proof/ready? (future is relative of course)
• Would this approach benefit you if you later convert your Frontend to a live or static React web app? Since it's already fully JS.
• Are there know downsides on this approach?

Now, I won't expect you guys to write me a block :) But any pointers/ tutorials/ known (git)projects are more than welcome.

Answer 1

As of now, no, you cannot write dynamic Gutenberg blocks purely in React without PHP. The linked issue goes in good detail why you have to use at least some PHP , and various approaches people have taken to minimize making duplicate PHP and JS.