こんにちは、mabuiです。
巷でREST.apiを代替すると騒がれているGraphQLのチュートリアル、Getting Started With GraphQL.jsを読みましたので、記事にしました。
GraphQLとは
チュートリアルコード紹介の前に、GraphQLについて紹介します。
GraphQLは、fackbook社が開発しているクエリ言語です。
APIを作成するときに、RESTの代わりに使用できます。
RESTの場合、/hoge/userや/hoge/itemといったapiのエンドポイントをリクエストごとに作成する必要がありますが、GraphQLではそれを1つにまとめることができます。
また、リクエストの際にクライアント側から必要なレスポンスのみを返すよう設定できるため、無駄な通信を省けます。
さらにRESTは通信プロトコルである反面、GraphQLは型を持つ言語のため、ApolloServerやGraphQL Faker等のライブラリを使用することで、スキーマを設計するのみでモックの値を返してくれるapiを簡単に用意することができ、これがフロントエンド開発において非常に生産性を高めてくれます。
チュートリアルコード紹介
ディレクトリ作成からGraphQLでクエリ結果を出力するまでのコードになります。
ディレクトリ作成
1 2 3 |
% mkdir graphql_demo % cd graphql_demo |
インストール
1 2 |
% yarn add graphql |
server.js作成
1 2 |
% touch server.js |
server.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
var { graphql, buildSchema } = require('graphql'); // Construct a schema, using GraphQL schema language var schema = buildSchema(` type Query { hello: String } `); // The root provides a resolver function for each API endpoint var root = { hello: () => { return 'Hello world!'; }, }; // Run the GraphQL query '{ hello }' and print out the response graphql(schema, '{ hello }', root).then((response) => { console.log(response); }); |
チュートリアルページからのコピペですw
node server.js
コマンド実行で、下記が出力されます。
1 2 |
{ data: { hello: 'Hello world!' } } |
server.jsについて解説
buildSchemaメソッド
GraphQLのスキーマ言語から、GraphQLのスキーマオブジェクトを作成するメソッドです。スキーマとはデータベースの構造のことと考えてください。
スキーマ言語のドキュメントはこちら
graphqlメソッド
第一引数にスキーマオブジェクト、第二引数にリクエストするクエリのキー指定、第三引数にルート値(デフォルト値、オプション)を指定して、クエリを実行します。
以上、簡単でしたがチュートリアルコードの紹介でした!