GraphQL은 API를 위한 쿼리 언어이자 기존 애플리케이션 데이터를 기반으로 쿼리를 수행하는 런타임 엔진입니다.
쿼리 (Queries)
기본 쿼리 및 JSON 응답
{ status }
JSON Response:
{
"data": {
"status": "available"
}
}
중첩 객체 (Nested Objects)
{
hero {
name
height
}
}
리스트 (Lists)
{
friends {
name
}
}
인자 (Arguments)
{
hero(id: "1000") {
id
name
}
}
별칭 (Aliases)
{
luke: hero(id: "1000") {
name
}
han: hero(id: "1001") {
name
}
}
작업 이름 및 변수 (Variables)
Query Definition:
query FindHero($id: String!) {
hero(id: $id) {
name
}
}
Variables Payload (JSON):
{
"id": "1000"
}
뮤테이션 (Mutations)
mutation CreateReviewForEpisode($ep: Episode!, $review: ReviewInput!) {
createReview(episode: $ep, review: $review) {
stars
commentary
}
}
인라인 프래그먼트 (Inline Fragments)
{
search(q: "john") {
id
... on User {
name
}
... on Comment {
body
author {
name
}
}
}
}
HTTP 통신 프로토콜
GET 요청
fetch('https://api.example.com/graphql?query={me{name}}')
POST 요청
fetch('https://api.example.com/graphql', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
query: 'query GetHero($id: String!) { hero(id: $id) { name } }',
variables: { id: '1000' }
})
})
스키마 정의 언어 (SDL)
기본 타입
type Query {
me: User
users(limit: Int): [User]
}
type User {
id: ID!
name: String
}
기본 내장 스칼라 타입
| 스칼라 | 설명 |
|---|---|
Int |
부호 있는 32비트 정수 |
Float |
배정밀도 부동 소수점 수 |
String |
UTF-8 문자열 |
Boolean |
불리언 값 (true 또는 false) |
ID |
문자열로 직렬화되는 고유 식별자 |
타입 정의 키워드
| 키워드 | 설명 |
|---|---|
type |
필드 집합을 나타내는 객체 타입 |
scalar |
사용자 정의 원시 스칼라 타입 |
interface |
구현할 필드를 정의하는 추상 타입 |
union |
여러 객체 타입을 묶는 유니언 타입 |
enum |
허용된 고유 문자열 값의 열거형 |
input |
쿼리나 뮤테이션의 인자로 전달되는 복합 입력 객체 |
타입 한정자 (Type Modifiers)
| 한정자 | 설명 |
|---|---|
String |
null 허용 문자열 |
String! |
null 불가 필수 문자열 |
[String] |
null 허용 문자열을 담은 null 허용 리스트 |
[String]! |
null 허용 문자열을 담은 필수 리스트 |
[String!]! |
null 불가 문자열을 담은 필수 리스트 |
인터페이스 (Interfaces)
interface Entity {
id: ID!
}
type User implements Entity {
id: ID!
name: String
}
열거형 (Enums)
enum Direction {
NORTH
EAST
SOUTH
WEST
}
유니언 (Unions)
union SearchResult = Human | Droid | Starship
type Query {
search(text: String): [SearchResult]
}