Apollo Client 모듈 설치 : npm install @apollo/client graphql import { ApolloProvider, ApolloClient, InMemoryCache } from '@apollo/client'; ApolloProvider : React에 ApolloClient를 연결시켜주기 위한 컴포넌트 ApolloClient : React에 실제로 연결될 Client 생성자 InMemoryCache : 쿼리 응답 개체를 내부 저장소에 저장시 사용하는 컴포넌트 // App.js const client = new ApolloClient({ uri : 'http://localhost:4000', cache : new InMemoryCache() }); function App()..

Apollo 서버 모듈 설치 : npm i apollo-server const { ApolloServer, gql } = requires("apollo-server") ApolloServer : GraphQL 서버 인스턴스 만들어주는 생성자 const server = new ApolloServer({ typeDefs, resolvers }); typeDefs : 어떤 형식의 데이터를 불러올 것인지 정의 resolvers : 어떻게 데이터를 불러올 것인지 구현 -> 두 인자모두 Array 지원하므로(공식 사이트 참고) 서버를 모듈화해서 사용하는 것이 유지보수에 용이 gql : 자바스크립트로 GraphQL 스키마 정의하기 위해 사용되는 템플릿 리터럴 태그 const typeDefs = gql` type Eq..

GraphQL이란? 페이스북이 공식적으로 발표한 데이터 질의어 Apollo란? GraphQL을 이용하여 실질적인 서비스를 제공할 수 있게 도와주는 라이브러리 중 하나(프론트, 백 모두 제공되어 사용이 많이 됨) Rest API : URI형식(어떤 정보를) + 요청방식(GET/POST/PUT/PATCH/DELETE) Rest API의 한계 불필요 데이터도 받아야함(overfetching) 특정 조건으로 필터링된 여러 데이터를 받아야할 경우 여러번의 통신을 통해 조합해야함(underfetching)