[TIL] What is GraphQL?

Jiwan Jeon·2022년 2월 4일
0

TIL

목록 보기
7/7
post-thumbnail
post-custom-banner

GraphQL 1탄 - gql 이란?

GraphQL은 API에 접목시킬 수 있는 Query Language 입니다.

  • GraphQL은 facebook이 만든 새로운 API 표준입니다.
  • Graph 라는 자료구조에 Query Language가 합쳐진 개념입니다.
  • server-side runtime for executing queries

  • 위의 그림과 같이 데이터가 graph 처럼 서로 얽혀있는 관계를 graph라고 합니다.

GraphQL의 장점

  • endpoint가 1개 라서 모바일 기기 사용이 증대하는 요즘 효과적인 데이터 로딩이 가능합니다.
  • 백앤드에서 API Document를 작성하지 않아도 프론트앤드 개발자들은 협업에 필요한 데이터에 보다 쉽게, 정확히 접근할 수 있습니다.
  • client단과 server단의 효과적인 커뮤니케이션에 용이합니다.

GraphQL VS REST API

먼저 REST API의 예시를 들어보겠습니다.

사용자가 블로그에 글을 쓰는 서비스를 구현하기 위해서는 최소 3가지 endpoint가 필요합니다.

/users/id
/users/id/posts
/users/id/followers

우선 id가 있어야 글을 작성할 수 있고, id를 통해서 post나 followers에 접근할 수 있습니다.

id, posts, followers 정보에 접근하기 위해 최소 3번 데이터 통신을 해야 하며,

백앤드 서버 상태에 따라 받아오는 주소 또한 상이해 질 수 있습니다.

하지만, gql과 함께 라면 어떨까요?

query {
  User (id : "22doori22dori2dr") {
    name
    posts {
      title
      likes
    }
    followers(last: 3) {
      name
    }
  }
}
  • endpoint가 하나 라서 id만 바꿔끼우면 됩니다. 한번의 요청으로 모든 데이터에 접근할 수 있습니다.
  • 데이터의 overfetching과 underfetching을 방지할 수 있습니다.

Overfetching : 불필요한 데이터까지 다 받아오는 것
Underfetching : endpoint가 데이터를 덜 받아와서 요청을 여러번 날리는 것

  • 프론트단에서 데이터 구조를 쉽게 볼 수 있습니다.

GraphQL에서 꼭 알아야 할 세 가지

  • query : 서버로부터 데이터를 받는 방식
  • mutation : 서버에 올라간 데이터를 업데이트 하는 방식
  • subscriptions : 서버와 실시간으로 연결을 유지하는 방식
profile
Jiwan Jeon
post-custom-banner

0개의 댓글