Start your GraphQL journey by creating an image board application.
Frontend: create-react-app
with Apollo Client
Backend: GraphQL API provided by Graphcool
Here's how you can get up and running with this project in just 5 minutes. For a more in-depth tutorial, check out the tutorial.md
file in the root of this repository.
git clone https://github.com/stranskycaro/graphql-react-tutorial.git
cd graphql-react-tutorial/
2. Create GraphQL API with graphcool
# Install Graphcool CLI
npm install -g graphcool
# Create a new project based on the Instagram example schema
graphcool init --schema https://graphqlbin.com/instagram.graphql
This creates a GraphQL API for the following schema:
type Post {
description: String!
imageUrl: String!
}
Copy the Simple API
endpoint and paste it into ./src/index.js
as the uri
argument in the createNetworkInterface
call:
// replace `__SIMPLE_API_ENDPOINT__` with the endpoint
const networkInterface = createNetworkInterface({ uri: '__SIMPLE_API_ENDPOINT__' })
npm install
npm start # opens http://localhost:3000 in your browser
- Dive into the intricacies of the Apollo Client with Graphcool's Learn Apollo tutorials
- Tackle some Advanced GraphQL Features
- Keep your app secure with Authorization and Permissions