graphQLFirstApp.md

Backend

Vocabulary:

• GraphQL: a query language that allows us to build even complex queries quickly and concisely, helping to make sure our queries fetch data -- and only the data we need -- quickly.

• Apollo Sandbox: an Apollo Studio Explorer tool and is a great way to to visually explore how GraphQL can be used to request and fetch data while in development. (Not a production tool). We create queries here to fetch data. Query looks like:

query classes{
  classes {
    name
  }
}

• Apollo server: a type of GraphQL server that uses a schema to describe the shape of your available data.

• typeDefs:

  (1) defines fields on a database record (like the schema)

  (2) queries: functions that retrieve data - GET

  (3) mutations: functions to modify data - POST/DELETE/UPDATE

• resolvers:

  (1) function definitions where we make db calls

Queries in Apollo Sandbox

query GetAllUsers {
  getAllUsers {
    email
  }
}

Mutations

mutation {
 createUser (name: "Sam", email: "mike@email.com", age: 30) {
   name
   email
   age
 }
}

Resources:

• Video: GraphQL Tutorial For Beginners - Apollo Server Express Tutorial, https://youtu.be/xCzm1bbOpfw
• Complete repo - https://github.com/loriculberson/graphql-users-demo

graphQLWithReact.md

Frontend

Vocabulary:

Apollo Client: a library that allows us to handle data using the GraphQL on the front end.

useQuery

useMutation

cache: Apollo Client stores the results of your GraphQL queries in a local, normalized, in-memory cache. This enables Apollo Client to respond almost immediately to queries for already-cached data, without even sending a network request.

Resources:

• https://www.apollographql.com/docs/react/
• https://www.apollographql.com/docs/react/data/mutations/
• https://www.apollographql.com/docs/react/data/mutations/#result
• https://www.apollographql.com/docs/react/caching/overview