More than 3 years have passed since last update.

AWS Amplify フレームワークの使い方Part5〜GraphQL Transform @model編〜

Last updated at 2020-11-25Posted at 2020-01-17

はじめに

Amplifyでの肝の部分であるAPI(AppSync = GraphQL)のスキーマ設計についてまとめていきます。その第一弾として、まず基本的な@modelの解説から行っていきます。

定義

@modelは以下のように定義されています。

directive @model(
    queries: ModelQueryMap,
    mutations: ModelMutationMap,
    subscriptions: ModelSubscriptionMap
) on OBJECT
input ModelMutationMap { create: String, update: String, delete: String }
input ModelQueryMap { get: String, list: String }
input ModelSubscriptionMap {
    onCreate: [String]
    onUpdate: [String]
    onDelete: [String]
    level: ModelSubscriptionLevel
}
enum ModelSubscriptionLevel { off public on }

解説

@modelの宣言をすることで、DynamoDBにテーブルが作成することができ、AppSyncで呼び出しができるように設定してくれます。
graphlqlフォルダが自動生成され、その中にqueries.js、mutations.js、subscriptions.jsが作られることで、CRUDが簡単に行えるようになります。

基本設定

下記の例では、idをプライマリーキーとして、Postテーブルが作成されます。

type Post @model {
    id: ID!
    title: String!
    tags: [String!]!
}

PostデータのCRUDするために、queries.jsにはgetPostとlistPost。mutations.jsにはcreatePostとupdatePost、deletePost。subscriptions.jsにはonCreatePostとonUpdatePost、onDeletePostがそれぞれ自動生成されます。

具体的な使用方法については、別記事でまとめていますので、下記の記事をご確認ください。
AWS Amplify フレームワークの使い方Part4〜API実践編〜

詳細設定

@modelのあとに、記述を追加することで自動生成されるCURDを制御することができます。
下記のように記述した場合は、mutations.jsとsubscriptions.js内に自動生成なしでqueries.js内にgetPostのみが生成されます。

type Post @model(queries: { get: "post" }, mutations: null, subscriptions: null) {
    id: ID!
    title: String!
    tags: [String!]!
}

おわりに

もう少し細かい事もできるようですが、現状試しているのはここまでになります。@modelさえ使えれば、簡単なアプリはできてしまうので、一度は触ってもらうとわかりやすいと思います。

参考

GraphQL Transform(公式ドキュメント)

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up

AWS Amplify フレームワークの使い方Part5〜GraphQL Transform @model編〜

はじめに

定義

解説

基本設定

詳細設定

おわりに

参考

関連記事