gistfile1.js

import React from "react";
import ReactDOM from "react-dom";
import { map } from "async";
import { userInfo } from "os";

import { ApolloProvider, Query } from "react-apollo";
import ApolloClient from "apollo-boost";
import gql from 'graphql-tag'

const client = new ApolloClient({
  uri: "http://localhost:4000/graphql"
});



const Index = () => (
    <ApolloProvider client={client}>
      <Query
        query={ USERS_QUERY }
      >
      {({ loading, error, data }) => {
        if( loading ){
          return 'Loading';
        }

        return (
          <div>
            <h2>My first Apollo app 🚀</h2>
            <ul>
              { data.users.map(( user ) => (
                  <li key={ user.id }>{ user.name }</li>
                ))
              }
            </ul>
          </div>
        );  
      }}
        
      </Query>
    </ApolloProvider>
  );


const USERS_QUERY = gql`
  query Users {
    users {
      id
      name
      email
    }
  }
`;



ReactDOM.render(<Index />, document.getElementById("index"));