GraphQL: 쿼리 및 변형에 대한 간략한 소개

"쿼리"와 "돌연변이"에 대해 여러 번 들어보셨을 것입니다. 이 기사에서는 이들이 무엇이고 어떻게 사용하는지에 대한 기본 사항을 살펴보겠습니다.

요컨대

기본적으로 쿼리는 RESTful API의 GET 요청과 동일한 작업을 수행하는 것으로 생각할 수 있습니다. 돌연변이는 DELETE , PUT 및 PATCH 또는 데이터를 업데이트하는 다른 방법과 비교할 수 있습니다.

쿼리

쿼리는 JavaScript의 함수와 비슷합니다. 이름이 지정되거나 익명이 될 수 있고 인수를 받거나 받지 않을 수 있지만 항상 일종의 데이터를 반환합니다.

{
  posts{
    title
    author
  }
}

쿼리는 개체의 특정 필드를 요청하는 것으로 생각할 수 있습니다. 전체 개체를 쿼리할 수 없으며 개체에 포함된 필드를 쿼리해야 합니다.

// won't work
{
  posts{
  }
}

GraphQL은 이름이 없거나 'query' 작업 유형을 사용하는 경우에도 여전히 쿼리를 인식합니다. 속기 구문이지만 우리가 만드는 작업 유형을 지정하고 이름을 지정하는 것이 좋습니다. 작업 유형은 쿼리, 변형 또는 구독이 될 수 있으며 이에 대한 이름을 자유롭게 선택할 수 있습니다.

무슨 일이 일어나고 있는지(모든 게시물을 가져오는 GetPosts, 게시물을 업데이트하는 UpdatePost 등)를 반영하는 이름을 선택하는 것이 가장 좋으며 쿼리 및 변형의 이름을 지정할 때 PascalCase를 사용하는 것이 일반적입니다.

인수

함수와 같은 쿼리는 인수를 사용할 수 있습니다. 경우에 따라 필요할 수도 있습니다. 인수(또는 필드)가 필요한 경우 뒤에 느낌표가 표시되며 필요한 매개변수 없이 쿼리를 시도하면 작동하지 않습니다.

query{
  postByID(id:3){
    title
  }
}

변수

위의 코드 스니펫에서 우리는 인수를 쿼리 문자열에 직접 작성하고 있지만 쿼리 기준이 무엇인지 미리 알 수 없기 때문에 인수를 동적으로 만들고 싶을 때가 있습니다. 작성자가 ___인 모든 게시물을 제공합니다.

변수를 사용하여 이 작업을 수행할 수 있습니다. 변수를 사용하려면 쿼리에 작업 유형과 이름이 있어야 합니다.

query GetPostByID($id:Int!){
  postByID(id:$id){
    title
  }
}

쿼리에 이름을 지정하고 쿼리에 사용되는 매개변수와 해당 인수의 유형을 선언했습니다. 우리는 이미 이 쿼리가 스키마에서 매개변수와 유형을 취한다고 선언했을 것이므로 여기에서 사용하는 것이 무엇이든 이미 선언한 것과 동일한지 확인하는 것이 좋습니다.

이제 쿼리의 하드 코딩된 값을 $arg 로 바꿀 수 있습니다. 이arg는 매개변수와 이름이 같아야 합니다. $는 특별한 작업을 수행하지 않으며 단지 변수를 강조 표시합니다.

변수를 사용하면 코드를 보다 건조하고 동적으로 만들 수 있습니다.

기본 변수

유형 선언 뒤에 기본값을 추가하여 기본값을 제공할 수 있습니다.

query GetPostByID($id:Int!=2){
  postByID(id:$id){
    title
  }
}

이렇게 하면 변수를 전달하지 않고 쿼리를 호출할 수 있습니다. 변수를 전달하면 기본값이 무시됩니다.

돌연변이

같은 방식으로 돌연변이를 작성합니다. 변형 작업 유형을 사용하고 변형하려는 데이터를 전달하고 변수를 사용하여 변형을 보다 동적으로 만들 수 있습니다.

직접 테스트

기본 쿼리 및 변형을 직접 처리하고 싶다면 이 작업을 수행할 수 있습니다super basic demo app. 행복한 코딩 :)