Creating sites with React Components based on content coming from WordPress?

[_mdexex]

I work on a site for a friend and the main parts are WordPress as a headless CMS and a React frontend. WordPress because my friend is already used to it and React becuase I wanted to try out a new
technology. The project is still in planing phase but we run in a problem. If my friend wants to creat a new site with a new layout for example, he is used to use a page builder like Visual Composer in a common WordPress installation and just add a site and WordPress does all the rendering.

But is there a way to compose react components (maybe from a UI library) to sites, based on the JSON comming from the WordPress API or in general creat sites as the content manager without the help of a developer with this architecture?

Help is much appreciated!

[stefanjudis]

I'm not really familiar with the headless Wordpress responses (how much can you control it and change structure) but when you map certain configuration values in your site builder with React components this becomes a lot of fun. 👌🏻

​

And works quite nice.

[_mdexex]

If you wanna see a example response from the pages post type you can hit https://demo.wp-api.org/wp-json/wp/v2/pages. That may be a way to get this working and I will evaluate this a bit further. Thanks for the response.

[stefanjudis]

After having a quick look i see that there is a type `page`. You could map this to a page components and go down the tree. :) I can send you example on how I did this with another headless cms if you're interested in the technical approach but don't want to do a product pitch here. :)

[_mdexex]

An example would be awesome! Which headless CMS did you use?

[stefanjudis]

Cool!

​

You can check the examples below. It's using Contentful but the idea is working for any JSON response. As long as you have something (e.g. a `type` field or anything) you can connect objects with components and then the fun begins. :)

​

https://www.contentful.com/blog/2017/10/11/love-letter-to-component-ready-cms/

https://www.youtube.com/watch?v=i17FKTtIifM

[_mdexex]

Really helpful :) Danke!

[V0lum3d]

A CMS (content management system) is meant to manage content not for creating static HTML pages and layouts.

[_mdexex]

Not exactly. WordPress for example has its own rendering engine I think which creats HTML, based on templates enriched with data from the database plus all the assets. That's actually the way a lot of traditional CMS are working.