JAWS FESTAに向けて！ AWS Amplify Gen2による 金沢観光地マッピングアプリケーション開発

AWS Meetup Kansai for APNでの登壇にて使用したスライドとなります。
AWS Amplify Gen2を利用し、個人で金沢の観光地マッピングアプリケーション（かなまっぷ）の開発を行いました。開発した所感やAmplify Geo、Amplify Dataについてまとめました。
「かなまっぷ」使ってみたの章では登壇時動画を流す予定でしたが、SpeakerDeck上では流せませんでした。ご容赦ください。

Transcript

1. 2025/10/06 JAWS FESTAに向けて！ AWS Amplify Gen2による 金沢観光地マッピングアプリケーション開発 NRIネットコム株式会社 NTシステム事業一部 松澤武志 AWS Meetup Kansai For APN
2. 2 Copyright（C） NRI Netcom, Ltd. All rights reserved. 1. 自己紹介 2.ことの発端 3.「かなまっぷ」 使ってみた 4.「かなまっぷ」 開発の軌跡 • アーキテクチャ • Amplify Geo • Amplify Data 5.今後の展望 目次
3. 3 Copyright（C） NRI Netcom, Ltd. All rights reserved. 1. 自己紹介
4. 4 Copyright（C） NRI Netcom, Ltd. All rights reserved. 1. 自己紹介 名前：松澤武志 出身：兵庫県小野市 趣味： お弁当作り 推し活（金沢が舞台のコンテンツ） 好きな金沢の観光地：ひがし茶屋街 保有AWS認定 職種：アプリケーションエンジニア Spring Boot(Java)・Angular(TypeScript) 2025年7月より C# デスクトップアプリケーション開発 その他： 社会人歴：2年目  「2025 Japan AWS Jr. Champion」に選出 2025年10月 JAWS FESTA 2025参加予定 AWS Meetup Kansai運営
5. 5 Copyright（C） NRI Netcom, Ltd. All rights reserved. 2. ことの発端
6. 6 Copyright（C） NRI Netcom, Ltd. All rights reserved. JAWS-FESTA 2025に参加される方々に向けて、金沢の魅力を伝えたい 2. ことの発端 金沢の思い出の写真 鼓門 石川県立図書館 近江町市場の海鮮丼 ひがし茶屋街の 金箔ソフトクリーム
7. 7 Copyright（C） NRI Netcom, Ltd. All rights reserved. アプリを作りたい 2. ことの発端 AWS Amplify Gen2 ∴個人開発によるアプリ開発にもってこい  Backendにtypescriptのコードを記載するだけで様々なAWSサービスと連携  AWS Lambda  Amazon S3  Amazon DynamoDB  Amazon Cognito  GitHub / GitLabなどのバージョン管理ツールと統合  ブランチのドリフトを検知して自動デプロイ  開発者ごとにサンドボックス環境の生成  独立した環境で開発  本番環境、開発環境などのリソースも利用できる
8. 8 Copyright（C） NRI Netcom, Ltd. All rights reserved. そうだ、金沢の観光地紹介アプリケーションを作ろう！ 2. ことの発端 AWS Amplify Gen2 金沢の観光地 ※ かなまっぷはまだリリースしていません。間に合いませんでした。。。β版をご紹介します。
9. 9 Copyright（C） NRI Netcom, Ltd. All rights reserved. 3. 「かなまっぷ」使ってみた
10. 10 Copyright（C） NRI Netcom, Ltd. All rights reserved. 3. 「かなまっぷ」使ってみた
11. 11 Copyright（C） NRI Netcom, Ltd. All rights reserved. 4. 「かなまっぷ」開発の軌跡
12. 12 Copyright（C） NRI Netcom, Ltd. All rights reserved. アーキテクチャ図 4. 「かなまっぷ」開発の軌跡
13. 13 Copyright（C） NRI Netcom, Ltd. All rights reserved. アーキテクチャ図 4. 「かなまっぷ」開発の軌跡 今回は Amplify Geo Amplify Data についてお話します！
14. 14 Copyright（C） NRI Netcom, Ltd. All rights reserved. Amplify Geo Amplify Geoでできること  地図表示機能  ジオコーディング（検索）機能  ピン表示  Amazon Location Serviceの統合 機能一覧  地図表示機能 • インタラクティブな地図の操作  ジオコーディング（検索）機能  観光地一覧表示機能 難しかったところ  拡張性がやや低い  検索窓のインスタンス（Geocoder）に 「.on(“click”, event）」でイベントバウンディ ングができない 4. 「かなまっぷ」開発の軌跡 Amplify Geoとは…… 地図と位置情報を組み込める機能
15. 16 Copyright（C） NRI Netcom, Ltd. All rights reserved. Amplify Data Amplify/data/resource.tsにスキーマを定義  型の定義  キーの定義  非null制約 スキーマを定義したテーブルのCRUD処理の自動生成  Create  List/get  Update  Delete observeQuery  リアルタイムイベントのサブスクライブ createdAt, updatedAtの自動生成 機能一覧  観光地登録機能  コメント登録機能  観光地・写真URL登録機能 4. 「かなまっぷ」開発の軌跡 Amplify Dataとは…… GraphQLを用いたデータ管理機能
16. 17 Copyright（C） NRI Netcom, Ltd. All rights reserved. Amplify Data ひと工夫 4. 「かなまっぷ」開発の軌跡 Entityクラスを用いる リポジトリでCRUDをまとめる create list
17. 18 Copyright（C） NRI Netcom, Ltd. All rights reserved. 5. 今後の展望
18. 19 Copyright（C） NRI Netcom, Ltd. All rights reserved. Bedrockで推論 → Lambda + Strands Agentの構成に変更 Toolの自由度が向上 DynamoDBのMCPサーバーを利用可能 Amazon Location Service SDKを利用した地図機能の拡充 現在地表示 ルート検索機能 各種機能改善 聖地・コメント・写真削除 聖地登録UIの作成 5. 今後の展望 ひゃくまんさん 是非、金沢にきまっしね～！