나름 정리해 본 GraphQL, REST 개념

캠프에서  GraphQl API와 REST API에 대해 배우고 나서, 주변 백엔드 개발자들에게 물어봤다.

"API 그래프QL 쓰세요 레스트 쓰세요?" 돌아오는 답변은 하나같이 "네?"

내가 두 개념에 대해 잘 못 이해하고 있나? 싶어 급하게 다시 찾아봤다.

 

API?

우선 API가 무엇인지 보자면, API는 Application programming Interface의 약자로 컴퓨터나 소프트웨어를 서로 연결하는 역할을 한다. 그렇다고 툴이나 프로그램의 개념이 아니라 두 애플리케이션 간 원활한 연결을 위해 정하는 규칙이나 약속?으로 보면 좋다. 이 두줄로 정리한 개념을 이해하기 위해서 유튜브도 보고 AWS 문서와 여러 블로그를 읽어봤다. API에 대해서 정리하고 보니 무슨 API 쓰세요? 라는 질문에 당황한 백엔드 개발자의 심정을 조금이나마 이해했다. API는 데이터를 쉽게 주고 받기 위한 약속 개념일 뿐.. 위와 같은 상황에서는 "어떤 api 요청 방식을 사용하나요?" "어떤 라이브러리로 api 만드시나요?" 등으로 구체적으로 질문 하는 것이 맞다.

 

REST? GraphQL?

API 요청 방식에는 rest, graphQL 등이 있다. 이런 개념이 등장한 백그라운드를 살펴보자면, 옛날에는 API를 주고 받기 위한 약속에 한가지 문제점이 있었다. 회사 혹은 개발자끼리 정한 규칙이나 약속이 모두 다르기 때문에 원활한 소통이 안된 것이다. 그래서 API를 누구나 쉽게 알아볼 수 있도록 체계를 만든 것이 REST다. REST 규칙을 잘 따른 API를 REST ful 하다고도 한단다. 

이 REST는 POST, PUT, DELETE, GET을 통해 생성, 수정, 삭제, 조회를 할 수 있다. 이 과정에서 REST는 overfetching과 underfetching의 문제를 겪는다. overgetching은 원하는 데이터 외에 한번에 많은 데이터가 넘어오는 것이고, underfetching은 한 유저에 대해 다양한 데이터가 필요할 때 여러번의 요청을 거치는 것을 말한다. 이 두가지 문제를 보완한 것이 GraphQL이다. GraphQL은 원하는 데이터를 뽑아 한번에 불러올 수 있는 장점이 있다.

 

개념 정리는 이정도이며 직접 한번 테스트해봤다.

 

REST 테스트

REST는 axios를 사용해 데이터를 불러와 봤다. 데이터는 https://koreanjson.com/에서 제공하는 데이터를 활용했다.

const onClickSync = async () => {
    const result = await axios.get("https://koreanjson.com/posts/1");
    console.log(result); //
  };

 

다음과 같이 get에 URI를 입력하면 데이터를 받을 수 있다.

아래 데이터를 받은 결과 값인데 한번에 많은 데이터를 받아 오는 것을 볼 수 있다.

 

 

GraphQL

GraphQL은 현재 캠프에서 주로 배우고 사용하고 있다. 나는 이 graphQL 통해 데이터를 활용하는 것이 아직은 복잡하다 ㅠㅠ

qeury fetchBoards라는 쿼리를 만든다. 반환값은 _id, writer, title 등 내가 원하는 정보만 받아 올 수 있다.

export const FETCH_BOARDS = gql`
  query fetchBoards {
    fetchBoards {
      _id
      writer
      title
      contents
      createdAt
    }
  }
`;

export default function BoardListContainer() {
	const { data } = useQuery(FETCH_BOARDS);

	console.log(data)
}

 

아래와 같이 조회한 데이터를 확인할 수 있다. REST와는 다르게 내가 원했던 _id, writer, title, contents, createdAt만 받아 왔다.

 

 

---

 

사실 아직은 Rest를 활용해서 프로젝트를 해보지 않았기 때문에 Rest에 대한 이해도는 낮다. graphQL 또한 익숙치 않아 현재 단계에서 이 주제의 블로그를 작성해도 될까 많이 고민했다.  그래서 그냥 개인 메모장에만 정리해두려고 했는데, 나중에 더욱 성장해서 쓰는 글과 비교하는 것도 재밌을 것 같아. 우선 개념정리나 사용기를 깊게 파지 않고 이해한 만큼만 작성했다.