做一個圖書管理 app.
首先,建立一個 Apollo Server:
(1) 建立一個新專案(Create a new project):
mkdir GraphQL-server
cd GraphQL-server
npm init -y
新目錄下面會有一個 package.json 檔案。
(2) 安裝套件(Install dependencies):
apollo-server -- 是 Apollo Server 本身的核心套件(library),用來定義資料型態(shape)和如何抓取資料。
graphql -- 功能是建立 GraphQL 的 schema 和執行 query。
npm install apollo-server graphql
(3)定義我們的 GraphQL 的 schema:
GraphQL server(包括 Apollo Server),都使用 schema,來定義 client 端可以查詢(query) 的資料的結構。schema 下會有不同定義的 type,所以我們稱它為 typeDefs,最基本的 GraphQL schema 是 屬於 object type。
這裡我們將建立一個可以查詢(query) 台語書籍的 app。
新增 server.js 定義我們的書籍資料:
const typeDefs = gql`
type Author {
name: String!
id: ID!
born: String!
}
type Book {
title: String!
published: String!
author: String!
id: ID!
genres: [String!]!
}
type Query {
bookCount: Int!
authorCount: Int!
allBooks: [Book!]!
}
`
(4)定義 data set:
let authors = [
{
name: '杉房之助',
id: "afa51ab0-344d-11e9-a414-719c6709cf3e",
born: 1952,
},
{
name: '田內八百久萬',
id: "afa5b6f0-344d-11e9-a414-719c6709cf3e",
born: 1963
},
{
name: '川合真永',
id: "afa5b6f1-344d-11e9-a414-719c6709cf3e",
born: 1821
},
{
name: '岩崎敬太郎', // birthyear not known
id: "afa5b6f2-344d-11e9-a414-719c6709cf3e",
},
{
name: '小川尚義', // birthyear not known
id: "afa5b6f3-344d-11e9-a414-719c6709cf3e",
},
]
let books = [
{
title: '新撰註解日台會話獨修',
published: 1916,
author: '川合真永',
id: "afa5b6f4-344d-11e9-a414-719c6709cf3e",
genres: ['假名']
},
{
title: '日台新辭典',
published: 1904,
author: '杉房之助',
id: "afa5b6f4-344d-11e9-a414-719c6709cf3e",
genres: ['假名']
},
{
title: '台灣語',
published: 1895,
author: '田內八百久萬',
id: "afa5b6f5-344d-11e9-a414-719c6709cf3e",
genres: ['假名', '漢字']
},
{
title: '日台會話新編',
published: 1899,
author: '杉房之助',
id: "afa5de00-344d-11e9-a414-719c6709cf3e",
genres: ['假名']
},
{
title: '埤圳用語',
published: 1911,
author: '岩崎敬太郎',
id: "afa5de01-344d-11e9-a414-719c6709cf3e",
genres: ['假名']
},
{
title: '台灣語典',
published: 1922,
author: '岩崎敬太郎',
id: "afa5de02-344d-11e9-a414-719c6709cf3e",
genres: ['假名', '白話字']
},
{
title: '日台大辭典(上冊)',
published: 1907,
author: '小川尚義',
id: "afa5de03-344d-11e9-a414-719c6709cf3e",
genres: ['假名', '漢字']
},
{
title: '日台大辭典(下冊)',
published: 1907,
author: '小川尚義',
id: "afa5de04-344d-11e9-a414-719c6709cf3e",
genres: ['假名', '漢字']
},
]
(5)定義 resolver:
const resolvers = {
Query: {
bookCount: () => books.length,
authorCount: () => authors.length,
allBooks: () => books
}
}
(6)建立 Apollo Server:
const { ApolloServer, gql } = require('apollo-server')
server.listen().then(({ url }) => {
console.log(`Server ready at ${url}`)
})
(7)啟動 server:
node server.js
在 terminal 執行 node server.js 成功,會看見 Server ready at http://localhost:4000/ 訊息。