react-apollo-todo-example

• React: Frontend framework for building user interfaces
• Apollo Client: Fully-featured, production ready caching GraphQL client
• Graphcool: Flexible backend platform combining GraphQL + AWS Lambda

Example (Live demo & GraphQL Playground)

Quickstart

For more information on how to get started refer to the full react-apollo-todo tutorial.

1. Clone example repository

git clone https://github.com/graphcool-examples/react-apollo-todo-example.git
cd react-apollo-todo-example

2. Create GraphQL API with graphcool

# Install Graphcool CLI
npm install -g graphcool

# Create a new project based on the Todo schema
graphcool init --url http://graphqlbin.com/todo.graphql

This creates a GraphQL API for the following schema:

type Todo {
  text: String!
  complete: Boolean!
}

3. Connect the app with your GraphQL API

Copy the Simple API endpoint to ./src/index.js as the uri argument in the createNetworkInterface call:

// replace `__SIMPLE_API_ENDPOINT__` with the endpoint from the previous step
const networkInterface = createNetworkInterface({ uri: '__SIMPLE_API_ENDPOINT__' })

4. Install depdendencies & run locally

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

Next steps

• Advanced GraphQL features
• Authentication & Permissions
• Implementing business logic with serverless functions

Help & Community

Join our Slack community if you run into issues or have questions. We love talking to you!