How to make requests to GraphQL-server from my redux action?

Question

I have react+redux application and I want to replace rest-requests in my actions to grapqhl-requests. What is the most simple method to do it?

I read about apollo, but I just to want add graphql in my existing requests.

Answer 1

You must change the way you will get the data because Apollo is a layer between you and the Api requested where you can join many Apis into one single query call. The example above is very simple and just to explain the way will place your querys and how it connects to Apollo Server. You can set middlewares to log requests on add some headers too.

You will install [ https://github.com/apollographql/react-apollo] and [ https://github.com/apollographql/graphql-tag]

After that create a connection file in your project that imports

graphClient.js

import { ApolloClient, createNetworkInterface } from 'react-apollo';
const networkInterface = createNetworkInterface({
  uri: 'yourserver address'
});
const client = new ApolloClient({
  networkInterface,
});
export default client;

yourRequestFile.js

import gql from 'graphql-tag';
import client from './graphClient';

export const getYourData = () => ({
  query: gql`
  query {
    products() {
      info {
        value {
          qty
          value
        }
      }
    }
  }`,
});
const returnYourData = async () => client.query(getYourdata());
export default returnYourData;