Deploying React w/ WordPress as Backend using WP Rest API Deploying React w/ WordPress as Backend using WP Rest API wordpress wordpress

Deploying React w/ WordPress as Backend using WP Rest API


You have a handful of options. You have the power to host React and Wordpress separately, but I prefer to host mine on the same server using docker.

If your curious, check out this starter template: https://github.com/postlight/headless-wp-starter

It's one of my favorites, and it has react pre-wrapped in a docker container with straight forward instructions.


You probably has access to CPanel or similar tools to deploy your files onto server.

Reminder is to put your build files into a sub-folder rather than deploy onto server directly,

then public_html/your_project_sub_folder_name,

then you will be able to use that domain/your_project_sub_folder_name to access the reactjs(You cannot have 2 apps deployed at the same time if they are not sub_folder separated)

At the same time, you gain original access to WP_REST to get post data in json format already, you can create your own custom end points if needed.

Here is the anwser on how to create your own custom endpoint:

Creating custom endpoints Wordpress


Yes you can host your React App and WP separately or Host it together in one.I tried this creating React Build Files inside WP Theme. Not yet perfect but working.

This simple WP Theme with React Build files:(React Build Folder inside WP Theme).

https://github.com/jun20/Simple-WP-ReactJS-Theme-Demo

And this is the reactjs dev files:

https://github.com/jun20/wp-theme-reactjs-dev/tree/master/Final/end

although this is not production ready and not tested.

Or

You can use the Generated React JS Build Files only with the custom Routes and Endpoints from your WP Rest API.

Like in this example: (this the build files in repo Simple-WP-ReactJS-Theme-Demo)This React JS Build folder -> https://github.com/jun20/wp-theme-reactjs-dev/tree/Final-Build/buildit has a routes and endpoints of posts, primary navigation, at pages from live wp site site.