GraphQL

graphQl

graphql 로 해결할 수 있는 문제

• over-fetching : 요청한 영역의 정보보다 많은 정보를 서버에서 받는 것
• under-fetching : 어떤 하나를 완성하기 위해 다른 요청들을 해야할 때 발생 (하나를 완성하기 위해 많은 소스를 요청)

query

• database에서 무언가를 요청하고 graphql 언어로 내가 원하는 정보를 알려줄 수 있음

schema

• 사용자에게 보내거나 사용자로부터 받을 data에 대한 설명
• Schema : 데이터에 대한 기술.
  1. Query : 데이터베이스로 요청하여 받을 데이터. get data (Read)
  2. Mutation : 서버, 데이터베이스, 메모리의 데이터 변경 작업. mutate data. (Create, Upadate, Delete)

GraphQL은 Query랑 Resolvers만 있음

• Resolvers를 원하는대로 프로그래밍 가능
• Query에 맞는 Resolvers를 찾음

playground: graphql-yoga에 따라오는 것으로 database를 테스트하게 해줌

GraphQL Resolvers는 GraphQL 서버에서 요청을 받음
GraphQL 서버가 Query나 Mutation의 정의 발견하면 Resolver를 찾고 해당 함수 활용

Mutation: Database 상태가 변할 때 사용

Movie GraphQL

<schema.graphql>

type Movie{
    id:Int!
    name:String!
    score:Int!
}
type Query{#여기에 사용자에게 정보를 주는 모든 것들을 넣어줌 
    movies:[Movie]! #어떤 사용자가 query에 이름을 보내면 사용자한테 String을 보냄
    # 다수의 Movie이 있는 array 형태며 필수사항이라는 뜻 
    movie(id:Int!):Movie #오직 한 person만 얻고 싶을때에는 ID가 필요 , !가 있으면 필수라는 뜻

}

type Mutation{#Mutation: Database 상태가 변할 때 사용 
    addMovie(name:String!,score:Int!):Movie!
    deleteMovie(id:Int!):Boolean!
}

<resolver.js>

//query를 해결하는 파일
import {getMovies,getById, addMovie,deleteMovie} from "./db";

const resolvers={
    Query:{ //resolve하고 싶은 query의 이름과 내용
        movies:()=>getMovies(),//어떤 사용자가 people Query를 보내면 people를 반환하는 함수로 답함 
        movie:(_,{id})=>{//처음 인자는 현재 object를 보내는 object
            getById(id);
        }        
    },
    Mutation:{
        addMovie:(_,{name,score})=>addMovie(name,score),
        deleteMovie:(_,{id})=>deleteMovie(id)
    }
};//graphql resolvers: graphql 서버가 query나 mutation정의를 발견하면 graphql서버에서 요청을 받음  

export default resolvers;

<db.js>

let movies=[
    {   id:0,
        name:"Star wars",
        score:1
    },

    {   id:1,
        name:"Avengers",
        score:8
    },
    {   id:2,
        name:"The Godfather I",
        score: 99
    },
    {   id:3,
        name:"Logan",
        score:2
    },
];

export const getMovies=()=>movies;

export const getById=id=>{
    const filteredMovies=movies.filter(movie=>movie.id===id);
    return filteredMovies[0];
};

export const deleteMovie=(id)=>{
    const cleanedMovies=movies.filter(movie=>movie.id!==id);
    if(movies.length>cleanedMovies.length){
        movies=cleanedMovies;
        return true;
    }else{
        return false;
    }
}

export const addMovie=(name,score)=>{
    const newMovie={
        id:`${movies.length+1}`,
        name,
        score
    };
    movies.push(newMovie);
    return newMovie;
}