React와 슬랙 클론 | 시맨틱 UI | 그래프QL | PostgreSQL(4부)

이전에는 데이터베이스를 시작했습니다. 당신은 그것을 찾을 수 있습니다 article here .

오늘 우리는 Graphql 쿼리와 돌연변이에 대해 간단히 이야기할 것입니다.

간단히 말해서 GraphQL API



유형: 쿼리, 변형, 사용자 지정



유형은 끝점이 무엇인지 정의하고 반환해야 하는 내용을 **설명*합니다. *

쿼리는 다음과 같습니다 =>

type Query {
    getColors: [String]!
    getNames: [String]
    sayName: String!
  }

(예: getColors는 색상 이름이 될 문자열 배열을 반환해야 합니다.) 느낌표는 항목이 null일 수 없음을 의미합니다. 유형 쿼리 범주는 GET 끝점이 됩니다.

돌연변이는 다음과 같습니다 =>

type Mutation {
    sayHello(message: String!): String!
  }

돌연변이에도 동일한 규칙이 적용됩니다. 유일한 차이점은 유형 변형 범주가 POST, PUT, DELETE 끝점이 된다는 것입니다.

사용자 정의 유형은 다음과 같습니다. =>

type User {
  name: String!
  age: Int!
  bio: String!
}

이것은 다음과 같이 사용할 수 있는 3가지 속성( name, age, bio )이 있는 일반 사용자 정의 개체입니다.

type Query{
/** returns array of users */
  getUsers: [User!]
  getUser: User!
}

type Mutation {
/** creates a user, returns that user */
  createUser: (name: String!, age: Int!, bio:String!): User
}

확인자: 쿼리 및 돌연변이



*Resolvers는 유형에서 설명한 실제 데이터를 반환합니다. 쿼리 및 변형 이름은 type query 카테고리에 설명된 이름과 일치해야 합니다. *

쿼리는 리졸버에서 다음과 같이 보입니다 =>

Query: {
    getColors: () => ["blue", "yellow", "green"],
    sayName: () => "Ajea!"
}

리졸버에서 돌연변이는 다음과 같습니다 =>

/**args is whatever data you passed in (as an object), when you call this type. There are more params by default but we don't need them, thats way we use `_,`*/ 
Mutation: {
   sayHello: (_, args) => {
      return `hello ${args.message}`
   },
   createUser: async (_, args) => {
      try{
        /** async code happens **/
       /** create user with args data into DB, and then return user*/
      }catch(err){
       console.log(err)
      }
  }
}

이 모든 것이 여전히 모호하더라도 걱정하지 마십시오. 다음 기사에서 실제 쿼리와 변형을 생성하면 이해가 되기 시작할 것입니다. 다음 단계에서는 이를 잘 생성하고 Graphql 서버에서 실제로 테스트합니다. GraphQL API의 개요를 살펴보고 싶었습니다.

지금까지 도움이 되었기를 바랍니다.

좋은 웹페이지 즐겨찾기