본문 바로가기
junior developer :)/CS(Computer Science)지식

graphQL(github explorer) & RESTAPI

by ㅁ윤슬ㅁ 2022. 12. 1.
728x90
반응형

RESTAPI와 GraphQL는 클라이언트와 서버가 원활하게 통신을 하기 위한 역할을 한다.
그 중 가장 많이 쓰이는 방법론인 RESTAPI와 GrephQL에 대해서 적어보려고 한다.

GraphQL

graphQL(Graph + Query Language)은 facebook에서 개발한 API를 통해 정보를 주고받기 위한 쿼리 언어이다.
이 언어는 RestAPI의 단점을 보완할 수 있다는 점에서 많은 관심을 받고 있다.

GraphQL 특징

- HTTP를 통해 API 서버로 요청을 보내고 응답을 JSON 형태로  받는다.
- 서버 개발자가 작성한 각 필드에 대응하는 resolver 함수로 각 필드의 데이터를 조회할 수 있다.
- GraphQL 라이브러리가 조회대상 schema가 유효한지 검사한다.

Githob Explorer로 data 조회해보기

https://docs.github.com/en/graphql/overview/explorer

 

Explorer - GitHub Docs

 

docs.github.com

이 사이트를 통해 테스트 해볼 수 있다. 깃헙에서 제공하는 explorer이다. 로그인 후 쿼리를 작성하면 본인 또는 다른 사람들이 만든 레포지토리에도 접근이 가능하다.

github explorer에서 제공한 가이드에 있는 예시로 테스트 해봤다. query를 수정하면 다른 레포지토리의 data도 접근이 가능하다.

query {
	// 서버에서 데이터를 얻는 작업 (수정 x)
  repository(owner:"octocat", name:"Hello-World") {
	//octocat/Hello-World 저장소를 조회하고 싶기 때문에 해당 repository 객체 찾기
    issues(last:20, states:CLOSED) {
      edges {
        node {
          title
          url
          labels(first:5) {
            edges {
              node {
                name
              }
            }
          }
        }
      }
    }
  }
}

해당 query로 조회하면 아래와 같은 결과가 나온다.

위의 예시와 같이 graphQL은 하나의 endpoint로 원하는 데이터를 받을 수 있다.

GraphQL도 조금 더 사용 해보고 더 와닿을 때 스키마, 리졸버 등 디테일한 것들을 포스팅해봐야겠다.

RESTAPI

restapi는 JSON형태로 데이터를 보내거나 받고, 수정할 수 있다.
아래는 API, REST API등을 정리했던 포스팅이다.

API에 대하여(+ REST API, REST 성숙도 모델)

restapi의 이해를 위해 전에 실습했던 코드를 일부 가져와봤다.

//get
 const request = { 
    method : "get" , 
    headers : {'Content-Type': 'application/json'},
  }

//put
const likeRequest = {
	method:"PUT",
   	body:JSON.stringify(newBlog),
    headers : {'Content-Type': 'application/json'}
    }
    fetch(`http://localhost:3001/blogs/${id}`, likeRequest)
    .then (() => {
       navigate(`/blogs/${id}`)
     })
    .catch(err => {
       console.log(err)
     })

restapi는 위와 같이 get, put, patch, delete등의 메소드를 통해 역할이 구분된다.
또한 restapi를 이용할 때는 엔드포인트가 중요하다. (위의 코드에서 blogs)
restapi에 대해서 적어보자면 적을게 무지 많지만 오늘의 주인공은 restapi가 아니기 때문에 graphQL과의 코드적인 차이점을 눈으로 확인하는 것으로 마무리 하려고 한다.

RESTAPI vs GraphQL

- REST API는 여러 resource에 접근하고자 할 때 여러 번의 요청이 필요하지만, GraphQL에서는 한번의 요청에서 여러 Resource에 접근할 수 있다.
(ex. 리뷰, 커밋 등을 검색하려면 2개의 개별 호출이 필요한 RESTAPI와 달리 GraphQL은 중첩필드를 이용해 한번의 요청으로 데이터를 검색할 수 있다)
- 학생의 학년, 반번호, 이름 중 일부만 검색하고 싶은 경우 RESTAPI의 경우 해당 정보가 다 출력되기 때문에 과도한 데이터가 포함되지만 GraphQL의 경우 지정한 항목만 반환할 수 있다. 
- REST API는 URI가  Resource를 나타내고 Method가 작업의 유형을 나타내지만, GraphQL에서는 스키마가 Recource를 나타내고 Query, Mutation 타입이 작업의 유형을 나타낸다
- REST API는 Resource에 대한 형태 정의와 데이터 요청 방법이 연결되어 있지만, GraphQL에서는 Resource에 대한 형태 정의와 데이터 요청이 완전히 분리되어 있다.
- Rest API는 Resource의 크기와 형태를 서버에서 결정하지만, GraphQL에서는 Resource에 대한 정보만 정의하고, 필요한 크기와 형태는 클라이언트 단에서 요청시 결정한다.

 

오늘 공부했던 GraphQL은 낯설어서 그런지 확 와닿지 않는 느낌이였다. 하지만 처음 REST API를 접했을 때도 낯설었지만 점점 실제로 사용해보면서 이해가 되어가는 것처럼 GraphQL도 그럴 것이라 생각하고 더 많이 사용해보면서 익히려고 한다.


참고

https://docs.github.com/en/graphql/guides/migrating-from-rest-to-graphql

https://tech.kakao.com/2019/08/01/graphql-basic/

728x90
반응형