💥

Local Development with Amplify Gen 2

2024/06/05に公開

Sandbox と言われる Amplify Gen 2 (Amplify) でのローカル開発について。

Amplify の実用性について調べる。

Code はこれ。

https://github.com/danny-yamamoto/buttermilk-backend-app.git

tl;dr

  • Sandbox は本番と同等で構成され、停止すると自動で Resources は削除される。
  • Amplify で Frontend から Backend、Database まで全て定義できる。理論上。

Implement the API

  • NestJS で API を実装する。CRUD まで generate される。 nest g resource todo [1]
  • CRUD の HTTP Method に Prisma で実装を追加する。[2]

Set up local AWS profile [3]

  • AWS CLI は VS Code の extension を使用する。

https://github.com/danny-yamamoto/buttermilk-backend-app/blob/f8d8625a75740e0ebb81b8a2cc40224d7c04579b/.devcontainer/devcontainer.json#L9

  • Sandbox を deploy するため、Profile を準備する。Profile の ID を確認する。
aws configure sso
# Set AWS environment variables
vi ~/.aws/credentials
cat ~/.aws/credentials

Bootstrap your AWS account [4]

  • Sandbox を起動する。
cat ~/.aws/config # Get profile
npx ampx sandbox --profile <profile-name>
log
node ➜ /workspaces/buttermilk-backend-app (main) $ npx ampx sandbox --profile hoge-99999
  
  Amplify Sandbox
  
  Identifier:   node
  Stack:        amplify-buttermilkbackendapp-node-sandbox-99999

...

✨  Total time: 572.82s


NOTICES         (What's this? https://github.com/aws/aws-cdk/wiki/CLI-Notices)

30241   (cli): Upgrading to v2.142.0 errors out on cdk diff with `Cannot read properties of undefined`

        Overview: A change was made to diff in CDK v2.142.0 to include changes
                  to properties that are only present in the change set. This
                  introduced cases where the resource type could be undefined
                  which resulted in an error from calling 'includes' on
                  undefined.

        Affected versions: cli: 2.142.0

        More information at: https://github.com/aws/aws-cdk/issues/30241


If you don’t want to see a notice anymore, use "cdk acknowledge <id>". For example, "cdk acknowledge 30241".
[Sandbox] Watching for file changes...
File written: amplify_outputs.json
  • 今回構成されるのは VPC + Amazon Aurora
  • Frontend から Backend、Database まで全て定義できる。理論上。

https://github.com/danny-yamamoto/buttermilk-backend-app/blob/main/amplify/backend.ts

Clean up

  • ctl + c で停止と削除が実行される。完了後、Resources は削除されている。
? Would you like to delete all the resources in your sandbox environment (This cannot be undone)? y
[Sandbox] Deleting all the resources in the sandbox environment...
amplify-buttermilkbackendapp-node-sandbox-99999: destroying... [1/1]

...

 ✅  amplify-buttermilkbackendapp-node-sandbox-99999: destroyed

NOTICES         (What's this? https://github.com/aws/aws-cdk/wiki/CLI-Notices)

30241   (cli): Upgrading to v2.142.0 errors out on cdk diff with `Cannot read properties of undefined`

        Overview: A change was made to diff in CDK v2.142.0 to include changes
                  to properties that are only present in the change set. This
                  introduced cases where the resource type could be undefined
                  which resulted in an error from calling 'includes' on
                  undefined.

        Affected versions: cli: 2.142.0

        More information at: https://github.com/aws/aws-cdk/issues/30241


If you don’t want to see a notice anymore, use "cdk acknowledge <id>". For example, "cdk acknowledge 30241".
[Sandbox] Finished deleting.

Tips

  • Database との接続を行う場合、Amplify の Custom Resources [5] を参考に実装が必要。なぜなら、既存の Database と接続する場合、認証を考える必要がある。

Conclusion

転職して 2 ヶ月が経過した

あれこれ手をつけて、何も出来ていないw

今度、機会があれば、1 年くらいで去っていく外国出身の Engineer の仕事に対する Stance を聞いてみたい

私は欲張りすぎなのか。何かに集中するべきなのか

脚注
  1. https://docs.nestjs.com/recipes/crud-generator ↩︎

  2. https://docs.nestjs.com/recipes/prisma#set-up-prisma ↩︎

  3. https://docs.amplify.aws/react/start/account-setup/#4-set-up-local-aws-profile ↩︎

  4. https://docs.amplify.aws/react/start/account-setup/#5-bootstrap-your-aws-account ↩︎

  5. https://docs.amplify.aws/react/build-a-backend/add-aws-services/custom-resources/ ↩︎

GitHubで編集を提案

Discussion