title: How to make a graphql client in Apollo?
body: <p>I have built a <code>graphql</code> server in <code>apollo-server-express</code>. I can use <code>apollo playground</code> to send request and get response. The request I send in the playground is </p>
  
  <pre><code>{
    query: me {username}
  }
  </code></pre>
  
  <p>and I can get the expected response on the right panel. But I get some troubles to build a client with <code>apollo-client</code>. Below is the source code:</p>
  
  <pre><code>const gql = require('graphql-tag');
  const ApolloClient = require('apollo-boost').default;
  const fetch = require('node-fetch').default;
  
  const client = new ApolloClient({
    uri: 'http://localhost:8000/graphql',
    fetch
  });
  
  client
    .query({
      query: gql`
        query me {
          username
        }
      `
    })
    .then(data =&gt; console.log(data))
    .catch(error =&gt; console.error(error));
  
  </code></pre>
  
  <p>I get <code>400</code> error response when run the above code. Below is the full error message. I am new to graphql and what's wrong with my code?</p>
  
  <pre><code>name: 'ServerError',
       response:
        Response {
          size: 0,
          timeout: 0,
          [Symbol(Body internals)]: [Object],
          [Symbol(Response internals)]: [Object] },
       statusCode: 400,
       result: { errors: [Array] } },
    message:
     'Network error: Response not successful: Received status code 400',
  </code></pre>
  
  <p>If I change the query to <code>query : me {</code> I will get this error: <code>raphQLError: Syntax Error: Expected {, found : at syntaxError ...</code></p>
  
  <p>The server code is:</p>
  
  <pre><code>const express = require('express');
  const { ApolloServer, gql } = require('apollo-server-express');
  
  const app = express();
  
  const schema = gql`
    type Query {
      me: User
    }
  
    type User {
      username: String!
    }
  `;
  
  const resolvers = {
    Query: {
      me: () =&gt; {
        return {
          username: 'Robin Wieruch'
        };
      }
    }
  };
  const server = new ApolloServer({
    typeDefs: schema,
    resolvers,
  });
  
  server.applyMiddleware({ app, path: '/graphql' });
  
  
  app.listen({ port: 8000 }, () =&gt; {
    console.log('Apollo Server on http://localhost:8000/graphql');
  });
  
  </code></pre>