Quickstart with Relay Modern

React: Frontend framework for building user interfaces
Relay: Powerful GraphQL client developed by Facebook
Graphcool: Flexible backend platform combining GraphQL + AWS Lambda

Example

Quickstart

For more information on how to get started refer to the full react-relay-instagram tutorial.

1. Clone example repository

git clone https://github.com/graphcool-examples/react-graphql.git
cd react-graphql/quickstart-with-relay-modern

2. Create GraphQL API with `graphcool`

# Install Graphcool CLI
npm install -g graphcool

# Create a new project based on the Instagram schema
graphcool init --schema https://graphqlbin.com/instagram.graphql

This creates a GraphQL API for the following schema:

type Post {
  description: String!
  imageUrl: String!
}

3. Connect the app with your GraphQL API

Copy the Relay API endpoint to ./src/createRelayEnvironment.js as the argument for the call to fetch replacing __RELAY_API_ENDPOINT__ :

// replace `__RELAY_API_ENDPOINT__ ` with the endpoint from the previous step
return fetch('__RELAY_API_ENDPOINT__', {
 ...
})

4. Install dependencies & run locally

yarn install
yarn relay # invoke relay compiler
yarn start # open http://localhost:3000 in your browser

Next steps

Help & Community

Say hello in our Slack or visit the Graphcool Forum if you run into issues or have questions. We love talking to you!

latik/react-graphql