All things GraphQL

General_Ideas

Problems with Rest API
  - no idea the data structure from the api
  - too many network apis /proprietory api - baking api into applications for react native and needs to deploy each version api endpoint for each version app api/v1/user, api/v2/user...etc

// ---------------------------------------------
// GraphQL Server

- query language for both client and server
- client specified queries not api request
  1. Exposes a single endpoint
  2. endpoint parses and executes a query
  3. Executes over a type system
  4. Type system available via introspection (graphQL API)
  
  GraphQL Core <=> Type Definition <=> Application code (Bus logics)
  
// ---------------------------------------------
// GraphQL Core

  1. Compiler Frontend(Lexer/Paser): changes Query text to AST (in memory abstract syntax stream)
  2. Type System: API for Type Definitions
  3. Introspection: GraphQL API for querying types (includes metadata such as documentation and deprecation)
  4. Validation: Is a query valid within an app's schema? (meaningful error message)
  5. Execution: Manage Query Execution (exploits parallelism inherent in GraphQL queries)
  
  The technical preview is a JS implementation of the core
  
 
    

  
  

query_on_client

{
  author(firstName: 'Paul', lastName:'Simon') {
    firstName
    lastName
    posts{
      title
      text
      author{
        firstName
        lastName
      }
    }
  }
}

resolvers.js

// /data/resolvers.js

const resolvers = {
  Query: {
    author(_, args) {
      return {id: 1, firstName: 'Hey', lastName: 'You'};
    },
  },
  Author: {
    posts(author) {
      return [{ id: 111, title: '123', text: 'good' }];
    }
  }

}

export default resolvers;

schema.js

// ./data/schema.js

// at minimum, we need to have a schema that defines the query.
// telling GraphQL what types of data exists in the query and how they relate to each other
// ex builds a small blog with user/post/view

const typeDefinitions = `
  type Author {
    id: Int,
    firstName: String,
    lastName: String,
    posts: [Post]
  }

  type Post {
    id: Int,
    title: String,
    text: String,
    author: Author
  }

  typeQuery {
    author(firstName: String, lastName: String): Author 
  }
  
  Schema {
    query: Query
  }
`;

export default [typeDefinitions];

Server.js

//dependencies: express, graphql-tools

import express from 'express';
import { ApolloServer } from 'graphql-tools';
import Schema from './data/schema';
import Resolvers from './data/resolvers';

const GRAPHQL_PORT = 8080;

const graphQLServer = express();

graphQLServer.use('/', apolloServer({ // apolloServer is a middleware we pass in to this route
  graphiql: true, // optional: gui to inspect the schema
  pretty: true, // optional: pretty printing
  schema: Schema,
  resolvers: Resovlers
}));

graphQLServer.listen(GRAPH_PORT, () => console.log(
  `GraphQL Server is now running on http://localhost:${GRAPHQL_PORT}`
));