2

As some of you may know Wordpress came out with an API not to long ago that you can make HTTP requests to and not really worry so much about the routes as they handle the backend for you.

Now my question is how can I mix ReactJs with Wordpress API?

This has been driving me insane because I cannot find any solid content online about how to do this (NOT EVEN STACKOVERFLOW).

Help is greatly appreciated, thank you!

Addition to Question

I completely understand both ReactJs and Wordpress, the Ajax calls would be made with something like Jquerys $.ajax() method. I just have no clue how these two can mingle together and don't even know where to begin.

Improve this question
1
  • React is a frontend library, just drop the project folder into the www directory of apache and make api calls to the wordpress API of your other site hosted on same server, should work fine. Commented Feb 8, 2017 at 6:34

1 Answer 1

Reset to default
1

Great question!

Here are my thoughts. I'm seeing two possible approaches.

(1) Create SPA with React and Wordpress

In that case the Wordpress will act as REST API and Administration. React will be responsible for the routes management and handling all Front end logic. You can think about it as two different projects. Therefore you will have two clean installs of React and Wordpress.

Pros:

  1. Таке full advantage of React and its shine ecosystem. Here I mean performance, scalability, community and so on.
  2. Back end, REST API, Administration are up to you, thanks by Wordpress.

Cons:

  1. You can't use Wordpress's plugins on the Front end side.

Please take a look at WP-Calypso for inspiration. You can take some good practices from there:

Calypso is the new WordPress.com front-end – a beautiful redesign of the WordPress dashboard using a single-page web application, powered by the WordPress.com REST API

(2) Using Wordpress platform in its default fashion

You can include React in the default Wordpress way of including js libraries. Here React will handle some heavy user interaction on any page you want. React can communicate again with the Wordpress REST API, but the routes will be managed by Wordpress.

What approach should I use?

It depends. Let's look at the next two cases:

  1. We have a betting platform and we want our users to receive live updates on coefficient and scores changes. We assume that Wordpress Back end structure can handle it and perfectly fits to our requirements. In that scenario I would prefer to create SPA and using Wordpress as Back end and Administration (#1 approach).

  2. We have a company site with almost static content. The only one dynamic (heavy interactions) feature is the user board. There the users can send messages to others ones, receive newsletter feeds. So here I would prefer using the Wordpress as main platform (#2 approach), while React would handle only the dynamic page.

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

Thanks for the reply Jordan really appreciate that, i'm going to do some experimenting with some of the advice on this question and will get back to you and this thread. Like I mentioned there is no solid content anywhere online on how this can be done so I want to try to make this Stackoverflow questions a good source of information for people who want to know how they can mix ReactJs with Wordpress. I'll let you know how this goes and the technical approach I took.
Okay. Sounds great! Please let me know if you need support. I have experience with both platforms.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.