GraphQL 맛보기

GraphQL 맛보기

해당 포스팅은 책 GraphQLr과 타입스크립트로 개발하는 웹 서비스 - 강희수 저자의 1장 일부를 정리한 내용입니다.

GraphQL은 클라이언트 애플리케이션을 위한 쿼리 언어.
페이스북이 기능이 복잡해짐에따라 발생하는 충돌과 성능 저하를 감당하기 위해 본인들의 서비스에 맞는 GraphQL을 시작함.

• 모바일 애플리케이션을 위한 Model과 View를 새롭게 구축하기 시작
• 이 과정에서 RESTful API서버를 통해 받아온 데이터 형태와 애플리케이션 화면상에서 필요한 데이터 형태에 많은 차이가 있음을 발견함.
• API 요청을 통해 받아온 데이터를 실제 화면상에서 필요한 데이터의 형태로 구성하기 위해 API서버와 프런트엔드 클라이언트 양쪽에 걸쳐 데이터를 가공하는 상당한 양의 코드를 작성해야했음.
• 데이터 중심의 워크플로와 그 생태계의 필요성을 느끼고 GraphQL을 시작.

query {
    Film(id : 13) {
        title
    }
}

graphQL 구문은 다음과 같은 JSON 포맷 결과를 반환

{
    "Film" : {
        "title" : "붉은 돼지"
    }
}

요청 정보에 응답 받을 정보가 모두 포함되어 있기 때문에 어느 누군가가 확인하여도 어떤 결과가 돌아올지 예측할 수 있음.

GraphQL 정의

GraphQL은 API와 클라이언트 픅을 위한 쿼리 언어이며 동시에 쿼리를 실행하기 위한 런타임(Runtime)이다.
클라이언트가 API 서버로부터 데이터를 검색하거나 관리하기 위한 언어이다. 데이터를 관리하고 검색하는 측면에서는 SQL과 동일하지만 사용되는 환경과 사용 형태가 다르다. GraphQL을 다루는 서버는 웹 프런트엔드, 모바일 프런트 엔드 등의 화면을 구성하는 다양한 클라이언트로부터 쿼리를 전송받는다. 쿼리를 전송받은 GraphQL서버는 쿼리에서 명시된 데이터에 접근하여 데이터를 요청 받은 형태로 반환한다.

더 많은 정보가 필요할 경우 예시

query {
    Film( id : 13) {
        title
        release
        Director {
            name
        }
    }
}

반환값 ⬇️

{
  "data": {
    "Film": {
      "title": "붉은 돼지",
      "release": "2003-12-19",
      "Director": {
        "name": "미야자키 하야오"
      }
    }
  }
}

GraphGL의 리졸버(Resolver)

GraphQL 서버에서는 각 데이터에 대한 리졸브 함수를 작성하여 데이터에 접근한다. 리졸버는 특정 데이터 필드를 조작하는 함수이다.

function query_film(request: Request) {
  const filmId = request.args.id;
  return filmStore.findOne(filmId);
}

function film_title(film: Film) {
  return film.title;
}

function film_release(film: Film) {
  return film.release;
}

RDBMS SQL과의 차이

개발자는 RDBMS의 경우 SQL을 통해 가져올 데이터에 대한 명세를 작성할 뿐, 각 필드의 데이터를 어떤 방식으로 가져올지는 DB엔진에 달려있다. 반면 GraphQL은 데이터를 어떤게 가져올지에 대해서도 개발자가 직접 리졸버 함수들로 작성하게 된다.

• GraphQL은 특정 데이터베이스나 데이터 저장소 또는 특정 언어에 종속되지 않는다.
• GraphQL은 RDBMS, NoSQL과 함께 사용할 수 있으며, 이미 구축된 자사 또는 타사의 API 서비스, SOAP, gRPC등을 통해 제공되는 데이터는 물론 심지어 단일 JSON 파일, 다양한 이진파일 등과도 함께 사용할 수 있다.

GraphQL의 설계 디자인 원칙

1. 계층적
2. 제품 중심
3. 강력한 타입 제한
4. 클라이언트 맞춤 쿼리
5. 인트로스펙티브(Instrospective)

1. 계층적

• graphQL 쿼리와 반환되는 데이터 형태 역시 계층적 구조를 지님으로써 더운 일관성 있고 자연스러운 개발이 가능. 오늘날 대표적인 계층 구조의 데이터 형태인 JSON과 유사

2. 제품 중심

• 클라이언트를 위한 쿼리 언어이므로, 클라이언트를 개발하는 프런트엔드 엔지니어의 요구사항에 의해 주도적으로 작성됨. 이를 통해 원하는 제품과 가까운 개발을 가능케한다.

3. 강력한 타입 제한

• 타입 시스템을 통해 데이터와 데이터의 관계를 정의하고 유효성 검사를 진행한다. 타입 시스템을 통해 응답되는 데이터에 대한 보장이 가능하다.

4. 클라이언트 맞춤 쿼리

• 기존에는 서버에서 응답된 데이터에 맞추어 클라이언트를 개발해 나갔다면, GraphQL의 적용으로 클라이언트가 요청한 데이터만을 서버에서 응답하게 된다.

5. 인트로스펙티브(Instrospective)

• 현재 정의된 자신의 타입 정보와 명세 등의 정보를 쿼리할 수 있어, 클라이언트 측 라이브러리 또는 도구와 같은 플랫폼 구축을 가능하게 한다.