GraphQL + Apollo

- GraphQL

페이스북(현 메타)에서 만든 API를 위한 쿼리 언어이며, 클라이언트가 데이터를 서버로부터 효율적으로 가져오는 것이 목적

REST API와 비교

1. GraphQL의 구조

- Query : 데이터 요청, CRUD에서 R을 의미

 ex)

// 요청 (일반 query)
{
  tracksForHome {
    id
    title
  }
}

// 요청 (operation name query) : 변수 사용 시
query Query {
  tracksForHome {
    id
    title
  }
}

// 응답 (둘 다 응답은 같음)
{
  "data": {
    "hero": {
      "name": "R2-D2"
    }
  }
}

 

- Mutation : 데이터 변경 요청, CRUD에서 R 제외한 나머지

Mutation은 반드시 Schema에 정의해야 하며, Resolver를 통해 결과를 반환한다.

 ex) 추후 추가 예정

 

- Schema : 사용할 Query, Mutation, Type 등을 정의 

  ex)

type Movie {
  id: Int!
  title: String!
  rating: Float
  description_intro: String
  language: String
  medium_cover_image: String
  genres: [String]
}

type Query {
  movies(limit: Int, rating: Float): [Movie]!
  movie(id: Int!): Movie
  suggestions(id: Int!): [Movie]!
}
  
type Mutation {
    ...
}

사용할 Query나 Mutation은 반드시 type Query, type Mutation 내부에 작성해야 한다.

! 은 NonNullable이며 아래 사진을 참고

 

 - Resolver : Redux에서의 Reducer와 비슷하며, 쉽게 말해 Query를 어떻게 처리할 것인지를 뜻함

 ex) 추후 추가 예정

 

 

- Apollo

GraphQL을 쉽게 다룰 수 있게 해주는 라이브러리이며, client와 server 모두 사용 가능

 

(게시물 수정 예정)