[graphQL] Query 입력해보기 .01

안녕하세요 RyuWoong입니다.

graphQL이 뭔지 전 글로서는 감이 안잡히시죠?

이제 직접 쿼리를 날려봅시다.

---

접속하기.

SWAPI GraphQL API

위 사이트에 접속하면, Query 입력을 해보고 결과 값을 볼 수 있습니다.

앞 선 포스팅에서 REST API와 비교하면 된다고 말씀 드렸었는데요. 이번에 쿼리를 입력하면서 REST API와 비교하면 어떻게 다른지 조금 비교해보겠습니다.

 

입력하기.

왼쪽 메뉴에 책 아이콘을 선택하면, Docs를 볼 수 있습니다.

query라고 되어 있죠? Root를 눌려서 query 안에 어떤 내용이 있는지 살펴볼까요?

선택하면, 정말 많은 Field가 있습니다. 그럼 한번 왼쪽 에디터에 입력해봅시다.

{
  allFilms{
    totalCount
    films {
      title
    }
  }
}

입력후 실행을 하면 아래와 같은 결과 값을 전달 받을 수 있습니다!

{
  "data": {
    "allFilms": {
      "totalCount": 6,
      "films": [
        {
          "title": "A New Hope"
        },
        {
          "title": "The Empire Strikes Back"
        },
        {
          "title": "Return of the Jedi"
        },
        {
          "title": "The Phantom Menace"
        },
        {
          "title": "Attack of the Clones"
        },
        {
          "title": "Revenge of the Sith"
        }
      ]
    }
  }
}

우리는 allFilms의 totalCount 값과 Flims들의 각 Title List를 요청했습니다. REST API로 만들었다면 아래와 같이 만들수 있었을 것 같습니다.

GET api/v1/films

물론 REST API에서는 flim의 각 제목말고도 다양한 내용을 함께 전송해줄겁니다. 예를 들어 ID 값이나 개봉일 같은 것들도요. 내가 필요한 것은 제목뿐이지만 말이죠!

 

또 하나의 flim에 대해 상세하게 요청하는 쿼리를 작성해 볼까요?

{
	film(id:"ZmlsbXM6MQ==") {
    title
    director
    releaseDate
    created
  }
 }

이렇게 쿼리를 입력하면 ZmlsbXM6MQ== 라는 ID를 가진 영화정보를 전달 받을수 있습니다. 만약 REST API라면, 아래와 같이 요청 할 수 있겠죠?

GET api/v1/film?id=ZmlsbXM6MQ==

 

대충 감이 오시나요? GraphQL과 REST API 묘한 차이가 있죠?

그러면서도 GraphQL의 매력이 느껴지시나요?

다음 포스트는 Apollo graphQL을 이용하여 작은 GraphQL을 사용할 수 있는 서버를 만들어 해보도록 하겠습니다.