Finish this React application and future plan

This is the last part of Create react app with GraphQL way of WordPress data

In this finishing part, we build this application for production and plan for the next development workflow.

Building an application with the help of npm is pretty simple. Run

npm run build

and upload the files in the build folder in the server. You can see our application at reactblog.mrinalbd.com/. Also, can see the code if any need https://github.com/mrinal013/reactblog

Awesome experience to build this simple application. I heard some roar of Gatsby. Within a few days, I am going to build some stuff with Gatsby with WordPress.

Post Component in React

This is the sixth part of Create react app with GraphQL way of WordPress data

In this part, we will develop a Post component for our application. But, before diving in this, we will develop a Loading component for seeing landing or search status in our application. Let’s dive into Loading component development.

Continue reading “Post Component in React”

AppRouter setup with React, GraphQL, WordPress App

This is the second part of Create react app with GraphQL way of WordPress data

In this part, we will build src/AppRouter.js.


We will use { BrowserRouter, Route, Switch } from react-router-dom.
We will use ApolloClient and {gql} from apollo-boost package to connect React with Apollo. And import milligram CSS.
We will use the App component here. Also, import Post and NotFound components in src/AppRouter.js from respective files.

Continue reading “AppRouter setup with React, GraphQL, WordPress App”

Setup for React front-end with GraphQL to fetch WordPress back-end

This is the first part of Create react app with GraphQL way of WordPress data

Download WP-GraphQL from https://github.com/wp-graphql/wp-graphql and rename it wp-graphql. Install it in WordPress and active this plugin as usual. Then, visit

domain.name/?graphql
WP-Graphql success message
wp-graphql success message

If it shows a page of error, then confirmed wp-graphql plugin works.

Continue reading “Setup for React front-end with GraphQL to fetch WordPress back-end”

Create react app with GraphQL way of WordPress data

I am not going to compare REST vs GraphQL. As a silly Web developer, it is out of my boundary. If you are curious about this comparison, here are some good resources I found –

Also, GraphQL is topics in WordPress now-a-day.
https://kinsta.com/blog/wordpress-revolution-with-graphql/

You can find some other article about this tech war.

Anyhow, lets go to our main topics.
To make our journey a little easier, I will divide this development process in some parts.
Remember, I am writing these posts with share my development process. So, any part can be update in future part.
All posts are not completed yet. I am trying to complete all in next few days.

Create a react application with WordPress Rest API

Assume, create-react-app installed. Otherwise, follow https://mrinalbd.com/start-adventure-with-react/

Install brand new app with bash command.

npx create-react-app mrinalreact

Then, change directory and npm start with following command

cd mrinalreact && npm start

App will start at http://localhost:3000/

Continue reading “Create a react application with WordPress Rest API”