🔍
俺でもわかるGraphQLでサーチ(2)
はじめに
前回はTodoをリスト表示するところまででした。今回は特定のTodoをidでサーチして取得してみます。
コード
index.js
const { ApolloServer, gql } = require('apollo-server');
const typeDefs = gql`
type Task {
id: ID!
name: String!
isActive: Boolean!
createdAt: Int
updatedAt: Int
owner: String
}
type Query {
tasks: [Task]
task(id: ID!): Task # ❶
}
`;
const tasks = [
{ id: 1, name: "Soak in an Onsen", isActive: true},
{ id: 2, name: "Sing Karaoke", isActive: false},
{ id: 3, name: "See cherry blossom", isActive: true},
]
const resolvers = {
Query: {
tasks: () => tasks,
task (parent, args, context, info) { // ❷
const { id } = args;
return context.db.find((task) => task.id == id)
}
},
};
const server = new ApolloServer({
typeDefs,
resolvers,
context: { db: tasks } // ❸
});
server.listen().then(({ url }) => {
console.log(`🚀 Server ready at ${url}`);
});
変更点は以下の3つ:
- IDを引数にとるQueryを追加
- ❶に対応するresolverとして
task
を追加。ここにtasks
の配列をidで検索する処理を追加 -
context
にdbとしてtasks
を登録。❷での検索はtasks.find()
としても同じように動くが、dbはcontext
に入れるのがapollo流みたいなのでやってみた。今回はin-memoryの配列なので、find()
している。これがRDBだとcontext.db.query('SELECT * FROM table_name');
みたいになったりするわけかな
クエリー
当初のこのリストに加えて
{
tasks {
id
name
}
}
id指定のクエリができるようになりました
{
task(id: 2){
id
name
}
}
リターンは
{
"data": {
"task": {
"id": 2,
"name": "Sing Karaoke",
"isActive": false
}
}
}
なるほど、開発サイクルも大体わかってきたぞ。こんな風にSchema更新→Resolver更新を繰り返すんだな。ネーミングはtask
とかtasks
とかとりあえずRESTと同じ感じでいっとこう。
次回
次回はTodoの追加、削除、更新かな
参考
Discussion