[GraphQL] GraphQL .00 알아보기

안녕하세요. RyuWoong입니다.

이번에 해볼 이야기는 GraphQL 입니다.

React Query와 Component에 대한 공부를 하다보니 한번씩 접했던 단어인데요,

GrapQL이 뭔지, 어떤 용도로 쓰이는지 한번 알아보도록 하겠습니다.

---

GraphQL?

GraphQL은 Meta(구 FaceBook)에서 만든 Query Language(이하 QL) 입니다.

QL이지만, 기존에 우리가 사용하던 SQL과는 꽤 차이가 있습니다. 사용하는 방법부터 용도, 목적이 다릅니다. 한번 살펴볼까요?

 

SQL은 DB에 저장된 데이터를 효율적으로 불러오기위해 사용하는 언어이며 주로 BackEnd에서 사용하고

GraphQL은 Web Client가 서버로부터 효율적으로 데이터를 가져오기 위해 사용하는 언어로 주로 FrontEnd에서 사용합니다.

 

SQL

select id, name from user

 

GraphQL

{
	users {
    	id,
    	name
    }
}

 

그리고 특정 DB나 플랫폼에 종속되지 않습니다. 다양한 언어에서 지원하기 때문에 원하는 언어에서 쉽게 사용할 수 있습니다.

 

Rest 와 GraphQL

Web Client가 서버로부터 효율적으로 데이터를 가져오기 위해 사용하는 Rest API와 GraphQL를 비교해볼까 합니다.

 

우선 Rest API는 여러 End Point가 존재하지만 GraphQL은 하나의 End Poin만 사용합니다.

// Rest API
example.com/api/get-user
example.com/api/login

// GrapQL
example.com/api

Rest API는 필요한 데이터에 따라 다양한 End Point에 요청해야하는데에 비해, GraphQL은 하나의 End Point에 다른 쿼리를 전달함으로서 필요한 데이터를 요청할 수 있습니다.

 

그리고 Rest API는 요청에 따라 전달하는 값이 항상 똑같지만, GraphQL은 원하는 값만 받을 수 있습니다.

// Rest API
GET example.com/api/get-user?id=1

// 전달 받는 값.
{
	id: 1,
    name: 홍길동,
    birth: 1970-09-01,
    email: gildong@kakao.com
 }

위는 Rest API 요청과 응답 값이고, 아래는 GraphQL 요청과 응답 값입니다.

// GrapQL
 Query {
 	user(id:1){
    	id,
        name,
    }
 }
 
 //전달 받는 값
 
 {
 	id:1,
    name: 홍길동,
 }

예제 코드처럼, GraphQL은 원하는 데이터를 Query에 담아서 요청을 하고 원하는 데이터만 전달 받을 수 있습니다.

 

장점과 단점.

위 비교를 통해 GraphQL의 장점과 단점을 생각해 봅시다.

 

장점.

1. HTTP 요청 횟수를 줄일수 있습니다. (underFetching)

REST API는 원하는 데이터가 있다면 그 데이터를 전달해주는 API를 전부 요청해야하지만, GrapQL은 원하는 데이터를 쿼리에 담아 전달하면 한번에 다 전달 받을 수 있습니다.

 

2. HTTP 전송 데이터 크기 감소. (overFetching)

Rest API는 고정된 내용을 전달해주기 때문에 필요 없는 내용도 함께 전달 받을 수 있습니다. 하지만 GrapQL은 원하는 내용만 요청해서 전달 받을 수 있기 때문에 불필요한 네트워크 비용이 줄어듭니다.

 

단점.

1. 고정된 요청, 고정된 응답만 필요할때는 REST API보다 비효율적일 수 있습니다..

2. 파일 업로드 구현이 어렵습니다.

string으로 쿼리를 전달하기 때문에 파일 업로드 구현이 어렵습니다.

 

 

참조.

GraphQL 개념잡기

다음에는 포스팅엔 간단하게 GrapQL 서버를 구축하고 응답을 받아보도록 하겠습니다!