API에 대한 개념에 이어 실제로 API를 구축해보며 API 서버의 구조를 알아가고자 한다.
GraphQL API는 많은 type들의 집합이다. (REST는 URL)
GraphQL 서버에게 서버에 있는 데이터의 타입을 설명해주어야 한다. 즉, return 하려는 '데이터, 사용자가 보낼 수 있는 데이터' 등은 서버가 실행하기 전에 graphql한테 설명해줘야 하는 것들이다.
사용자가 request 할 수 있는 모든 것들은 type Query 안에 있어야 한다.
text와 hello를 Run 하면 null이 출력되는 것을 확인할 수 있다.
첫 번째로 해야할 것은 우리가 API가 생긴 모양(구조)을 graphql에게 설명해줘야 한다.
그러고 나서, 사용자가 원하는 데이터를 보여줄 수 있도록(가공) 코드를 작성해야 한다.
Scalar type
Scalar type은 graphql에 내장되어 있는 것이다. (string, ID, int, boolean 등과 같이 내장되어 있는 type이다)
Tweet이라는 새로운 type을 만들었고 이 안에는 id와 text가 포함된다.
const typeDefs = gql `
type User {
id: ID
username: String
}
type Tweet {
id: ID
text: String
author: User
}
type Query {
allTweets: [Tweet]
}
`;
Tweet의 list로 [Tweet]을 쓰는 것과 User 하나를 쓰는 것은 엄청나게 다르다고 한다.
[Tweet]은 데이터베이스에서의 관계에 따라 결정된다.
즉, Tweet이 하나의 author를 갖는다는 의미이고, allTweets는 여러 개의 Tweet을 준다는 것이다.
type Query {
allTweets: [Tweet]
tweet(id: ID): Tweet
}
tweet의 request를 받을 때 tweet의 id를 함께 받을 것이다.
(이 코드는 실행되는 코드가 아닌 type에 대한 설명이다. 어떤 field가 return 될 지에 대한 설명인 것이다. (value는 무엇이고 어떤 argument가 필요한지에 대해서))
Explorer로 돌아와 확인해보니 Argument가 생성되었다.
Mutation type
type Query {
allTweets: [Tweet]
GET /api/v1/tweets
Query에 allTweets를 넣는 것은 url을 만들고 노출시켜서 GET request를 하는 것과 같다.
Mutation type은 사용자가 보낸 데이터로 변형하는 동작들을 모두 넣는 것이다. 백엔드를 변형하는 것이다.
예를 들어 데이터베이스가 있다고 하자. 사용자가 데이터를 보내고 데이터에 mutation(변형)이 발생한다면 이는 mutation type 안에 있어야 한다.
type Mutation {
postTweet(text: String, userId: ID): Tweet
}
사용자가 데이터를 보내서 백엔드에 업로드하고 싶거나, 데이터베이스를 수정하고 cache를 지우고 logout 기능을 작동하게 만드는 상황 등등 변형이 된다면 Mutation에 넣어줘야 한다.
POST /api/v1/tweets
Mutation type에 field를 추가하는 것은 url을 노출시키고 POST HTTP method로 관리하는 것과 같다.
postTweet의 Argument는 postTweet을 호출할 때 text와 userId를 보내야 한다는 뜻이다.
그럼 id, text, author를 받을 것이다.
REST api에서 무언가를 삭제하고 싶다면 DELETE request를 보내야 한다.
무언가를 업데이트 하고 싶다면 PUT request를 보낸다.
하지만, graphql은 (큰 맥락에서 볼 때) Query이거나 Mutation 둘 중 하나이다.
트윗을 지우려고 한다면 Mutation 안에 있어야 한다.
트윗을 수정하려 한다면 그것도 Mutation 안에 있어야 한다.
post, delete, put 모두 Mutation 안에 있어야 한다. 왜냐하면 데이터베이스를 변형(mutate)한다는 것이니까. (반복,,중요,,)
반면, 사용자가 데이터를 받고 싶은 경우에는 이를 위한 코드가 Query type 안에 있어야 한다.
이 모든 설명은 API의 형태를 GraphQL에 설명하는 부분이다.
또한 데이터에 일어날 수 있는 작업들을 설명하는 부분이기도 하다!
'클론코딩' 카테고리의 다른 글
Tweet API 클론코딩5 (1) | 2022.06.12 |
---|---|
Tweet API 클론코딩 4 (0) | 2022.06.11 |
Tweet API 클론코딩 3 (0) | 2022.06.10 |
Tweet API 클론코딩 1 (0) | 2022.06.08 |