GraphQL에서의 모든 데이터는 그래프 형태로 연결되어있다고 전제한다.
그리고 이를 통해 클라이언트 요청에 따라 트리 구조의 JSON 데이터를 응답으로 전송할 수 있다.
GraphQL은 클라이언트 요청에 따라 🌈유연하게 자원을 가져올 수 있다.
즉, 트리 구조로 쿼리 결과를 받기 위해 그래프를 탐색하는 언어이다.
그래프에서 트리 추출하기
query {
책(ISBN이 "9791160507621") {
책 이름
저자 {
이름
}
옮김
}
}
//이 요청을 보내면
{
책 : {
책 이름 : "커리어스킬",
저자 : [
{ 이름 : "존 손메즈"}
옮김 : "이미령"
]
}
}
//이렇게 응답(쿼리)이 온다.REST API
- Overfetch : 필요 이상의 데이터 제공
- Underfecth : endpoint가 필요한 정보를 충분히 제공하지 못함
각각의 자원에 따라 엔드포인트를 구분하기 때문에 n가지 엔드포인트에 요청을 보내야한다. - 클라이언트 구조 변경 시 엔드포인트 변경 또는 데이터 수정 필요
자원의 크기와 형태를 서버에서 결정한다. 클라이언트가 결정할 수 없음.
GraphQL 장단점
장점
하나의 endpoint 요청(
/graphql, 모든 클라이언트 요청은 POST 메서드 사용)
원하는 데이터 정확하게 요청하고 얻을 수 있음
playground라는 GUI를 이용해 resolver, schema 한눈에 볼 수 있음
클라이언트 구조 변경이 수월함
단점
캐싱이 REST보다 복잡하다.(Apollo 엔진의 캐싱과 영속 쿼리로 보완)
고정된 요청과 응답만 필요한 경우에 RESTful API보다 요청 크기가 커진다.
GraphQL 구조
Query: 데이터 가져오기
Mutation: 데이터 수정하기
Create: 새로운 데이터 생성
Update: 데이터 수정
Delete: 데이터 삭제
Subscription(구독): 특정 이벤트가 발생 시 대응하는 데이터를 실시간으로 클라이언트에게 전송
쿼리(데이터 조회)
필드
{ hero { #필드 hero name } } //-> { #쿼리와 결과가 같은 모양을 하고 있다. "data": { #string 타입 반환. "hero": { "name": "betman", "family": [ {"name": "Night wing"}, {"name": "Red hood"}, {"name": "Red robin"}, {"name": "Robin"} ] } } }#으로 주석
,으로 필드 중첩전달인자 Arguments
필드에 인수를 전달하는 부분을 추가하면 쿼리의 필드 및 중첩된 객체들에 전달해 원하는 데이터만 받을 수 있다.
별명 Aliases
필드 이름을 중복해서 사용할 수 없다. 필드 이름을 중복으로 사용해서 쿼리를 해야 할 때에는 별명을 붙이면 된다.
{ betmanFamily: hero(title: betman family) { name } supermanFamily: hero(title: superman family) { name } }오퍼레이션 네임 Operation name
약식으로 작성하지 않는 한 반드시 필요하다.
query, mutation, subscription, describes ..등query HeroFamily { //앞의 `query`가 오퍼레이션 네임. hero { name family { name } } }변수 Variables
오퍼레이션 네임 옆에 변수를
$변수이름:타입이런식으로 정의.
뒤에 !가 붙기도 한다.($ep: Episode! 일때 ep는 반드시 Episode여야한다는 의미)
뮤테이션 mutation(데이터 수정)
스키마/타입 Schema/Type
구성요소: 객체의 종류, 객체 유형
type Character {
name: String!
appearsIn: [Episode!]!
}- Character : GraphQL객체타입. 필드가 있는 타입임.
스키마에 있는 대부분의 타입은 객체타입이다. - name과 appearIn은 Character 타입의 필드.
- String은 내장된 스칼라 타입.
스칼라 타입: ID, Int, String, Float, Boolean - !가 붙는다면 null이 아니어야 한다는 의미.
- []는 배열을 의미한다.
리졸버 Resolver
요청에 대한 응답을 결정해주는 함수.
스키마를 정의한 후 그 스키마 필드에 사용되는 함수의 실제 행동을 Resolver에서 정의한다.
Query: {
human(obj, args, context, info) {
return context.db.loadHumanByID(args.id).then(
userData => new Human(userData)
)
}
}
