[GraphQL] 그래프큐엘 등장 배경과 강점 (feat. REST API)

REST API, GraphQL은 클라이언트와 서버가 데이터를 주고받는 형식이다.

 

< REST API >

요청형식	용도
GET	정보 받아옴
POST	정보 입력
PUT/PATCH	정보 전체 수정/ 정보 부분 수정
DELETE	정보 삭제

이런 방식으로 데이터를 주고받는다. 그래서 각 데이터를 받아 올 때 기본 API주소에 특정 id를 추가하거나 변수들을 추가해서 필요한 데이터를 주고받을 수 있다. 

하지만, REST API는 예를 들어서 A팀의 주장 이름만 받아오고 싶다 하는 경우에도 특정 데이터만 콕 찝어서 받아올 수 없고 큰 범주의 데이터를 해당 URI를 통해 받아온 후 사용해야 한다.  이런 경우를 Overfetching이라고 한다. 

 

또한, REST API는 각 요청 형식마다 URI주소가 전부 다르기 때문에 각 작업에 해당하는 요청을 매번 다르게 해줘야 하는 번거로움이 있다. 물론 데이터를 한 번에 많이 가져오기 위한 작업에는 적합한 방식이지만, 특정 위치의 특정 데이터만 필요한 경우에는 굳이 많은 데이터를 받아올 필요가 없기 때문에 효율성이 떨어진다. 이런 단점을 보완할 수 있게 하는 것이 바로 GraphQL방식이다.

 

< GraphQL >

그래프큐엘의 최고 강점은 필요한 데이터만 필요한 곳에 사용할 수 있다는 점이다. 그래프 큐엘에서 데이터를 받아오려면 필요한 정보만 입력해서 받아오면 된다.

query {
  teams {
    id
    manager
    office
    extension_number
    mascot
    cleaning_duty
    project
  }
}

만약 manager정보만 필요하다면? 안에 있는 내용들을 전부 지우고 manager만 남겨두면 해당 데이터만 사용 가능하다. 

 

 

💠 특정 id를 가진 팀의 정보만 받아오고 싶다면?

query {
  team(id: 1) {
    manager
    office
  }
}

 

💠 여러가지 정보를 섞어서 가지고 오고 싶을 때?

query {
  teams {
    manager
    office
    mascot
  }
  roles {
    id
    requirement
  }
}

이와 같은 형식으로 해당 데이터의 이름만 명시해주면 데이터를 받아올 수 있다.

 

💠 새 데이터를 추가하고 싶을 때? 

mutation {
  postTeam (input: {
    manager: "John Smith"
    office: "104B"
    extension_number: "#9982"
    mascot: "Dragon"
    cleaning_duty: "Monday"
    project: "Lordaeron"
  }) {
    manager
    office
    extension_number
    mascot
    cleaning_duty
    project
  }
}

mutation을 사용해서 데이터를 수정, 삭제, 추가할 수 있다.(사전에 해당 동작을 정의해둬야 함)

 

 

🔸 이와 같이, GraphQL은 REST API의  여러 가지 문제를 해결해줄 수 있다.

 

- Overfetching문제를 해결하면서 데이터 전송량 🔽

- 여러 계층의 데이터들을 한 번에 받아올 수 있기 때문에 데이터 요청 횟수 🔽

- 하나의 end point(URI)에서 REST API의 GET, POST, PUT, DELETE ⭕

 

* 참고 사이트

https://www.yalco.kr/

얄코 홈