amplify codegen・amplify status について🍎

はじめに

表題について

• amplify add codegen と amplify codegen
• amplify status と amplify status --verbose

の違いがよくわからなかったので調べた内容を記載します。

目次

1. amplify add codegen と amplify codegen
2. amplify status と amplify status --verbose
3. amplify status における変更に問題がないかの判断基準
4. まとめ
5. 参考文献

🧷 amplify add codegen と amplify codegen

✅ amplify add codegen （初回設定用）

プロジェクト内に GraphQL のコード生成機能を追加 し、設定を行います。

amplify add codegen

実行時に聞かれる質問：以下？部分

⠦ Getting API detailsSuccessfully added API devCotsAdminApi to your Amplify project

✔ Getting API details
? Choose the code generation language target javascript
? Enter the file name pattern of graphql queries, mutations and subscriptions src/graphql/**/*.js
? Do you want to generate/update all possible GraphQL operations - queries, mutations and subscriptions Yes
? Enter maximum statement depth [increase from default if your schema is deeply nested] 2
✔ Downloaded the schema
✔ Generated GraphQL operations successfully and saved at src/graphql

• GraphQLコードを生成する言語の選択
  • JavaScript, TypeScript, Swift, Kotlin など
• GraphQLのクエリ・ミューテーション・サブスクリプションが含まれるファイルのパターン
  • src/graphql/**/*.js は、src/graphql 配下のすべてのサブディレクトリの .js ファイルを対象としています。
• すべてのGraphQL操作を生成または更新するか
  • Yes を選択しているため、全操作（クエリ・ミューテーション・サブスクリプション）を自動生成します。
• 最大のネスト深度を設定するか
  • 2 を選択しており、スキーマのネストが深くない場合はこれで十分ですが、ネストが多い場合は 3 や 4 に増やす必要がある。

🌟 このコマンドは一度だけ実行すればOK！
　　→ amplify codegenを実行する準備が整う。

✅ amplify codegen （コード生成のみ）

設定済みの GraphQL API をもとに、GraphQL のクエリ・ミューテーション・サブスクリプション・型定義 を再生成します。

amplify codegen

または、特定の動作を実行したい場合

amplify codegen statements  # GraphQL クエリ・ミューテーション・サブスクリプションを再生成
amplify codegen types       # TypeScript の型定義だけを再生成

🧷 amplify status と amplify status --verbose

✅ amplify status （初回設定用）

ローカルで変更されたリソースの一覧 を表示します。

amplify status

実行結果

    Current Environment: dev
    
┌──────────┬─────────────────┬───────────┬───────────────────┐
│ Category │ Resource name   │ Operation │ Provider plugin   │
├──────────┼─────────────────┼───────────┼───────────────────┤
│ Api      │ xxxApi          │ No Change │ awscloudformation │
├──────────┼─────────────────┼───────────┼───────────────────┤
│ Api      │ xxxApi          │ No Change │                   │
├──────────┼─────────────────┼───────────┼───────────────────┤
│ Auth     │ nuxtxxx         │ No Change │ awscloudformation │
├──────────┼─────────────────┼───────────┼───────────────────┤
│ Function │ helloWorld      │ No Change │ awscloudformation │
└──────────┴─────────────────┴───────────┴───────────────────┘

GraphQL endpoint: https://e27c2ivlbrdszhaxhf2yq6cm4q.appsync-api.ap-northeast-1.amazonaws.com/graphql
⚠️ GraphQL API is configured to use API_KEY authentication, but API Key deployment is disabled, don't forget to create one.

GraphQL transformer version: 2
REST API endpoint: https://ob4hq95cke.execute-api.ap-northeast-1.amazonaws.com/dev

表示される情報（例）

| Category  | Resource name   | Operation |  Provider plugin  |
|-----------|-----------------|-----------|-------------------|
| Auth      | myauth          | Create    | awscloudformation |
| API       | mygraphql       | No Change | awscloudformation |
| Function  | myLambda        | Update    | awscloudformation |

• Create → 新規作成されたリソース
• Update → 変更されたリソース
• No Change → 変更なし

✅ amplify status --verbose

--verboseをつけることで、通常のstatusより詳細な情報（ローカルの設定や CloudFormationのスタック情報） を確認できます。

amplify status --verbose

表示される情報（例）

Category: auth
  - Resource: myauth
  - Service: Cognito
  - Operation: Create
  - Configured Authentication Providers: [Google, Facebook, Amazon]
  - MFA Configuration: Optional
  - User Pool ID: us-east-1_ABC123
  - App Client ID: xyz789

Category: api
  - Resource: mygraphql
  - Service: AppSync
  - Operation: No Change
  - GraphQL Schema: /amplify/backend/api/mygraphql/schema.graphql
  - Auth Mode: API Key
  - Endpoint: 
https://abcdefg123456.appsync-api.us-east-1.amazonaws.com/graphql

📝 --verbose を使うメリット

• ローカルの詳細な設定を確認できる（認証プロバイダー、APIエンドポイントなど）
• Amplifyの設定ミスを発見しやすいCloudFormation のリソース情報も見られる

🧷 amplify status における変更に問題がないかの判断基準

amplify statusやamplify status --verboseの出力をチェックすることで、ローカルの変更が適切であり、問題がないかを確認 できます。

🔹 amplify status で基本的なチェック

| Category  | Resource name   | Operation |  Provider plugin  |
|-----------|-----------------|-----------|-------------------|
| Auth      | myAuth          | No Change | awscloudformation |
| API       | myAPI           | Update    | awscloudformation |
| Function  | myLambda        | Create    | awscloudformation |

Operation列を見て、意図した変更が正しく適用されているかを判断できます。

• Operation：問題なしと判断できる条件
• No Change：変更なし
  　⇨ 変更を加えていないリソースがすべて No Change になっていること
• Create：新規作成追加したリソースのみ Create になっていること
• Update：更新変更したリソースのみ Update になっていること
• Delete：削除不要なリソースのみ Delete になっていること

✅ 問題なしと判断できる条件

• 意図しない変更がない（例えば、何も変更していないのに Update や Delete になっていると怪しい）
• No Change のリソースが多い（変更していない部分に影響が出ていないことを確認）
• 新規作成 (Create) のリソースが正しく追加されている
• 更新 (Update) したリソースのみが Update になっている
• 削除 (Delete) されるリソースが意図通りである

🔹 amplify status --verbose でより詳細なチェック

amplify status --verboseを実行すると、より詳細な変更情報が表示されます。

Category: api
  - Resource: myAPI
  - Service: AppSync
  - Operation: Update
  - GraphQL Schema: /amplify/backend/api/myAPI/schema.graphql
  - Auth Mode: API Key
  - Endpoint: 
https://abcdefg123456.appsync-api.us-east-1.amazonaws.com/graphql

Category: function
  - Resource: myLambda
  - Service: Lambda
  - Operation: Create
  - Runtime: Node.js 18
  - Handler: index.handler

✅ 確認すべきポイント

• 意図したリソースのみ変更されているか
  例えば、GraphQL のスキーマを変更したなら API カテゴリのみ Update になるべき。
• Lambda 関数を新規追加したなら Function カテゴリに Create があるべき。
• 変更の詳細が正しいかGraphQL Schema のパス → 変更したスキーマファイルが正しいか
• Auth Mode → 認証モードが意図したものになっているか
• Runtime（Lambda 関数の場合）→ 言語やバージョンが正しいか
• 意図しない削除がないかDelete がある場合、それが意図した削除かどうかチェック

✅ 追加チェック

以下のコマンドを実行することで、さらに問題がないかを確認できます。

1. 変更の詳細を確認
変更ファイルが意図通りか確認する
（Amplify設定ファイル(amplify/以下)の変更が予期しないものになってないか確認）

git status

2. 変更点を詳細に確認
具体的にどの設定ファイルが変更されたか確認する

git diff amplify/backend

3. amplify push する前にプレビュー
変更がクラウドに反映される前に、実際の影響をシミュレーション

amplify push --dry-run

🎉 まとめ

amplify add codegen

最初に一度だけGraphQL のコード生成機能を追加 & 設定

amplify codegen

API の変更後クエリ・ミューテーション・型定義を再生成

👉 つまり

• プロジェクトに最初に追加するとき ⇨ amplify add codegen
• スキーマが変わったときに再生成するとき ⇨ amplify codegen

どちらを使えばいいか迷ったら、初回は amplify add codegen、2回目以降は amplify codegen でOK！ 🚀

amplify status

変更されたリソースの一覧を表示

amplify status --verbose

各リソースの詳細情報を確認

👉 ローカルの設定を詳しくチェックしたいときは amplify status --verbose を使おう！ 🚀

チェックポイント問題なしと判断できる条件

• amplify status
  Create / Update / Delete のリソースが意図したものだけ
• amplify status --verbose
  詳細な変更点が正しいかgit status予期しないファイル変更がないか
• git diff amplify/backend
  変更内容が適切か
• amplify push --dry-run
  クラウドに反映前の確認

👉 これらをチェックすれば、意図しない変更を防ぎ、問題なくamplify push可能！ 🚀

💫 参考文献

• [AWS Hands-on for Beginners]
  AWS Amplify を用いた Web サイトの構築方法を学ぼう
• amplify codegenの参照先スキーマにAppSyncのGraphQLのIDを指定する方法🚀