ゼロから作るWebアプリの新定番！？Amplify Gen 2 × AWS Blocksで実現する「開発速度とRDBの柔軟性のいいとこ取り」

JAWS FESTA 2026 in AKITAで発表した内容です！
https://jawsfesta2026.jaws-ug.jp/timetable/557e767c-f67e-472d-91d0-ce44b54ac4a6

Transcript

1. ゼロから作るWebアプリの新定番！？ Amplify Gen 2 × AWS Blocksで実現する 「開発速度とRDBの柔軟性のいいとこ取り」 株式会社Relic エンジニア 保 龍児（エイミ/amixedcolor）
2. こんな未来、どうですか？ ゼロからWebアプリを構築するのに 30分しかかからない もちろんRDSが使えて セキュリティも十分な水準 2
3. いやいや そんなうまい話があるわけ 3
4. いえ、実は ある可能性が高い未来なんです 4
5. 自己紹介 保 龍児（エイミ/amixedcolor） AWS Community Builder (Dev Tools) 業務内容 自社新規事業SaaS 開発責任者 兼 フルスタックリードエンジニア 好きなトピック アジャイル、スクラム、新規事業開発、 @amixedcolor AWS、完全没入型仮想現実 よくいるコミュニティ AWSコミュニティ、アジャイルコミュニティ 5
6. 自己紹介 保 龍児（エイミ/amixedcolor） AWS Community Builder (Dev Tools) 業務内容 自社新規事業SaaS 開発責任者 兼 フルスタックリードエンジニア 好きなトピック アジャイル、スクラム、新規事業開発、 @amixedcolor AWS、完全没入型仮想現実 よくいるコミュニティ AWSコミュニティ、アジャイルコミュニティ 6
7. そう！ Amplify Gen 2とAWS Blocksで 実現できるかもしれない未来 7
8. 本題に入る前に 8
9. 今日のゴール AWS Blocksに興味を持ち セッションが終わるまでに GitHubリポジトリをWatchする 9
10. 今日のゴール AWS Blocksに興味を持ち セッションが終わるまでに GitHubリポジトリをWatchする 10
11. え！？ すでに興味ある！？ 11
12. ポチポチするだけ！(1/3) https://github.com/aws-devtools-labs/aws-blocks 12
13. ポチポチするだけ！(2/3) https://github.com/aws-devtools-labs/aws-blocks 13
14. ポチポチするだけ！(3/3) ① ② https://github.com/aws-devtools-labs/aws-blocks 14
15. Watchするとどうなるの？ 新しいリリースがあると通知が来る！ 15
16. なんでWatchするの？ AWS Blocksはパブリックプレビューで 特にこれからがとても期待できるから 16
17. じゃあプロダクション環境では使えないじゃん！ そう、まだ使うのは避けたほうがいい でもとても期待できるもの 17
18. だから このセッションをきっかけに 今後の動向を注視しよう！ 18
19. ちょっとまって！ まだよくわからないよ・・・ 19
20. 大丈夫！ あなたができるだけ興味を持てるように あの未来に期待できるように話します 20
21. こんな未来でした ゼロからWebアプリを構築するのに 30分しかかからない もちろんRDSが使えて セキュリティも十分な水準 21
22. ここから本題！ 22
23. みなさん Webアプリ、つくってますか？ 23
24. みなさん Webアプリ、簡単に作れますか？ 24
25. もちろん 今はAIがある！ 25
26. でも 環境構築・インフラ構築も簡単ですか？ 26
27. 社内なら テンプレートリポジトリとか スケルトンプログラムとか 27
28. じゃあ ゼロから作る時はどうしよう？ 28
29. ご存知 PaaS (Platform as a Service) 29
30. PaaSと呼ばれる対象にブレはありますが、例えば Vercel Firebase 30
31. そうそう、便利なんだよ！ クラウドインフラ構築いらないし！ 31
32. でも 「AWSで完結できたらいいのに・・・」 32
33. 実はあります Amplify Gen 2 ※公式に「PaaS」とは言われていません。クラウドインフラ 構築がほぼ不要なため、エイミの解釈でこう表現しています。 33
34. なんだそれは！？ 34
35. Amplify Gen 2とは？(1/2) https://docs.amplify.aws/ • 曰く「ウェブ・モバイルアプリを構築する上で必要な全て」 • > AWS Amplify is everything you need to build web and mobile apps. • 曰く「簡単に始められ、簡単にスケールできる」 • > Easy to start, easy to scale. • 具体的には、認証・ストレージ・DB・Function・CI/CD・ホス ティングなどまで完備 • その環境をマネージドサービスかのように簡単に構築できる 35
36. Amplify Gen 2とは？(2/2) • Gen「2」？ • 元々無印の「AWS Amplify」というサービスがあり、大幅なアップデー トを経て「Amplify Gen 2」がリリースされました • 以来、無印は「Gen 1」と呼ばれています • 「Gen 1」は現在メンテナンスモードで、2027年5月1日にEOLです • 大幅なアップデート？ Gen 構築 構築方法 Gen 1 自動 CLI Gen 2 自動 CDK 追跡可能性 カスタマイズ性 36
37. じゃあ これでゼロからウェブアプリ作れるね！ 37
38. そうです 作れます！ 38
39. ただし 重要な留意点があります 39
40. Amplify Gen 2は DBのデフォルトがDynamoDB！ 40
41. Amplify Gen 2でDynamoDBだとどうなるか • 複雑なクエリが書きにくい • 各カラムのソートはセカンダリインデックスを張る必要がある • フィルタ処理をつくるときに独自の型に従う必要がある • ページネーションで歯抜けにならないようにページネーターを 自作する必要がある すると・・・ • よくあるあの一覧画面を作るのに一苦労！ 41
42. 去年、そんな話をしてました https://speakerdeck.com/amixedcolor/sutatoatupudegao-su-jian-zheng-surutamenoamplify-gen-2-li-bianxing-to-hamarus3ren-ke-ya-lan-hua-mian-shi-zhuang-nojie-jue-tenpureto 42
43. じゃあRDBに切り替えられないの？ 切り替えられます！が・・・ 43
44. RDBに切り替える方法 2024年8月まで • パブリックサブネットにRDSを置いて、インターネット経由でアクセス • もちろん、リスクがある • それゆえ、弊社では当時、Amplify Gen 2のテンプレート化でRDS採用を 断念 2024年9月から • RDS Data APIを活用してインターネット経由せずに接続可能に！ • ただし、そのためのCDKは全て自分で実装する必要がある • また、AIを使うとしてもDB周りのインフラ設計は不安もある • すると、AIがいてもゼロからやるには実装コストがかかる • つまり、技術的には可能だが複雑な設定や十分な知識が必要だった 44
45. そっか・・・ じゃあRDS使うのは難しいかもな・・・ 45
46. と思ったそこのあなた！！ 46
47. 今ならなんと！！ AWS Blocksがあるんです！ 47
48. え！？なにそれ！？ （こんなに引っ張らずにもっと早く教えてよ！！） 48
49. AWS Blocksとは？(1/2) https://docs.aws.amazon.com/ja_jp/blocks/latest/devguide/what-is-blocks.html • 2026年6月16日にパブリックプレビューとして公開（誕生日！） • 曰く「AWSでフルスタックアプリケーションを構築するための バックエンドツールキット」 • > AWS Blocks is a backend toolkit for building full-stack applications on AWS. • 曰く「必要な1つを選び、組み合わせれば、自動的にAWSのベス トプラクティスに沿ったインフラ構成を定義する」 • > Pick the ones you need, combine them, and AWS Blocks automatically defines the infrastructure for you following AWS best practices. 49
50. AWS Blocksとは？(1/2) https://docs.aws.amazon.com/ja_jp/blocks/latest/devguide/what-is-blocks.html • 2026年6月16日にパブリックプレビューとして公開（誕生日！） • 曰く「AWSでフルスタックアプリケーションを構築するための バックエンドツールキット」 • > AWS Blocks is a backend toolkit for building full-stack applications on AWS. • 曰く「必要な1つを選び、組み合わせれば、自動的にAWSのベス トプラクティスに沿ったインフラ構成を定義する」 • > Pick the ones you need, combine them, and AWS Blocks automatically defines the infrastructure for you following AWS best practices. 50
51. AWS Blocksとは？(2/2) • たくさんの「Block」があり、それを組み合わせるだけでインフ ラを構築できる • そのBlock数、実に20個！（※2026年10月時点） • KVStore・DistributedTable・Database・DistributedDatabase・ FileBucket・AuthBasic・AuthCognito・AuthOIDC・AsyncJob・ CronJob・Agent・KnowledgeBase・Realtime・EmailClient・ AppSetting・Logger・Metrics・Tracer・Dashboard・Hosting 51
52. AWS Blocksとは？(2/2) • たくさんの「Block」があり、それを組み合わせるだけでインフ ラを構築できる • そのBlock数、実に20個！（※2026年10月時点） • KVStore・DistributedTable・Database・DistributedDatabase・ FileBucket・AuthBasic・AuthCognito・AuthOIDC・AsyncJob・ CronJob・Agent・KnowledgeBase・Realtime・EmailClient・ AppSetting・Logger・Metrics・Tracer・Dashboard・Hosting 52
53. めちゃめちゃ便利そう！ 53
54. さらに！ 極め付きは！！ 54
55. Amplify Gen 2との接続方法が 公式ドキュメントに載っている！ 55
56. 簡単にAmplify Gen 2と接続できる https://docs.amplify.aws/react/build-a-backend/aws-blocks/get-started/ • Amplify Gen 2のプロジェクトルートでコマンド実行するだけ！ • `npx @aws-blocks/create-blocks-app` • 実行すると、Amplify Gen 2のプロジェクトを自動検知する • 必要なディレクトリ・ファイルを、自動で作成する • 必要な既存ファイルの変更を、自動で行う 56
57. するとどうなるか 57
58. Amplify Gen 2にRDSを 迅速かつ安全に組み込める！ 58
59. この未来、できそうじゃない？ ゼロからWebアプリを構築するのに 30分しかかからない もちろんRDSが使えて セキュリティも十分な水準 59
60. これでおわり？ いいえ、これはたったの5%！ 60
61. AWS Blocks、全部で20ブロックある！ KVStore・DistributedTable・Database・DistributedDatabase・FileBucket・AuthBasic・ AuthCognito・AuthOIDC・AsyncJob・CronJob・Agent・KnowledgeBase・Realtime・ EmailClient・AppSetting・Logger・Metrics・Tracer・Dashboard・Hosting 61
62. 今はパブリックプレビューだから もっと増えるかも？！ 62
63. どう？ ワクワクしてきた？ 63
64. 今日のゴール AWS Blocksに興味を持ち セッションが終わるまでに GitHubリポジトリをWatchする 64
65. ポチポチするだけ！(1/3) 65
66. ポチポチするだけ！(1/3) 66
67. ポチポチするだけ！(1/3) ① ② 67
68. さいごに 68
69. ちょっとまって！ 知りたかったのはそれじゃない・・・！ 69
70. ゼロから作るWebアプリの新定番！？ Amplify Gen 2 × AWS Blocksで実現する 「開発速度とRDBの柔軟性のいいとこ取り」 株式会社Relic エンジニア 保 龍児（エイミ/amixedcolor）
71. これ、結局どうやってつくるの！？ 71
72. 肝心なところを話していなくて ごめんなさい 72
73. 実は、作り方も結局AIに任せるだけということもあり こちらでつくっておきました！ 完成したお料理がこちらです 73
74. ぼくのかんがえたさいきょうのAmplify Gen 2テンプレート https://github.com/amixedcolor/amplify-next-rds-template-amix • して、AWS Amplifyでデプロイするだけ！ 構築たったの25分: 5分でリポジトリ作成、20分でビルド時間含めAWSにデプロイ完了！ • Amplify Gen 2のテンプレートでもある認証に、AWS Blocksの Database Blockを組み込んだだけのシンプルなもの • おまけでnpmをpnpmにしてビルド時のciエラー率を低減 • 自分は公式テンプレートから構築してると起きがちだった • ご自由にご活用ください • MIT-0ライセンスのテンプレートリポジトリです • ※AWS Blocksがパブリックプレビューであることには注意！ • プロダクション環境での利用はまだ推奨しません 74
75. ここ以外はできたかも！？ ゼロからWebアプリを構築するのに 30分しかかからない もちろんRDSが使えて セキュリティも十分な水準 まだパブリックプレビューなので不十分 75
76. つっこみ いや、それって テンプレートリポジトリが あるからじゃん！ 76
77. それはそうだけど・・・ 実現するには、AIに 「Amplify Gen 2とAWS Blocksを使って」 と任せるだけだった 77
78. すると 待機時間を除けば、作業時間は30分程度 AIが進化すれば、トータル30分な未来 78
79. おまけに（これも結局完全な0からではないが） テンプレートリポジトリに 0から作るときのプロンプトも 置いておきました！ 79
80. ゼロから作るWebアプリの新定番！？ Amplify Gen 2 × AWS Blocksで実現する 「開発速度とRDBの柔軟性のいいとこ取り」 株式会社Relic エンジニア 保 龍児（エイミ/amixedcolor）
81. 今日のゴール AWS Blocksに興味を持ち セッションが終わるまでに GitHubリポジトリをWatchする 81
82. 大志ある挑戦を創造し、日本から世界へ 想いを持った挑戦者と共に走り、共に創る