🛍️

ShopifyのGraphQLスキーマを図に変換する

2022/12/03に公開

まともに見れるものは生成されません。やり方とやってみたらこうなるという知見です。

GraphQLのスキーマを取得

Shopify GraphQL - No Schema File Exists Even Though It Does
このコミュニティの回答からリンクされている YuanWenqing/shopify4j graphql-admin-schema/schema/admin-schema.gql のクエリをGraphQL Admin APIに発行する。

GraphQLの発行にはアクセストークンが必要なので、アクセストークンを取得できるアプリが手元にある前提。

結果のJSONをファイルに保存しておく。

GraphQLスキーマを図に変換

sheerun/graphqlviz を使って図に変換する。Graphviz が必要なので先にインストールしておく。macOSでbrewを使う場合は次のような手順で生成できる。

# Graphvizをインストール
$ brew install graphviz

# graphqlvizを実行できるようにする
$ mkdir shoipfy-graphqlviz
$ cd shoipfy-graphqlviz
$ npm install graphviz

# 図を生成
$ node node_modules/graphqlviz/cli.js /path/to/schema.json | dot -Tsvg > shoipfy-graphql.svg

dotコマンドでCPU 100%使いながら5分くらい時間がかかる(マシンスペックに依る)。-Tpng で画像を生成しても文字が読めないドット絵になるのでSVGを生成する。

成果物

線画が生成されます。

近寄って見ても学びはありません。

まとめ

潔くドキュメントを読んで理解しましょう。

Discussion