Amazon Q Developer for CLI を使って PHP Conference 新潟 2025 参加者向けにグルメサイトを構築した話 / 20250620niigata-5min-tech

2025/06/20 (金) Niigata 5分 Tech #20 で発表した資料

イベントサイト
https://niigata-5min-tech.connpass.com/event/358195/

Transcript

1. Amazon Q Developer for CLIを使って PHP Conference 新潟 2025 参加者向けに グルメサイトを構築した話 2 0 2 5 / 0 6 / 2 0 Niigata 5 分 Tech # 2 0 笠原 宏
2. 自己 紹介 2 笠原 宏 wクラスメソッド株式会社 データ事業本部ソリューションアーキテクト w新潟県新潟市在住 w好きなAWSサービス: S 3 、Lambda、Step Functions wJAWS-UG新潟 支 部 ／ Python機械学習勉強会in新潟 ／ JaSST新潟 ／ ASTER ／ SWANII ／ Cloud fl are Meetup Niigata ／ AI CRAFT Hacks Niigata ／ etc. wAWS Community Builder / 2 0 2 4 Japan AWS All Certi fi cations Engineer @kasacchiful @kasacchiful
3. 宣伝
4. 6/22 ( 日 ) AI CRAFT Hacks Niigata # 3 〜 Claude Codeを使いたおす 〜 4 IUUQTBJDSBGUIBDLTOJJHBUBDPOOQBTTDPNFWFOU
5. 7/5 ( 土 ) JAWS-UG 新潟 #25 夏のハンズオン祭り 5 IUUQTKBXTVHOJJHBUBDPOOQBTTDPNFWFOU
6. 7/19 ( 土 ) Python機械学習勉強会 in 新潟 #20 6 IUUQTQZNMOJJHBUBDPOOQBTTDPNFWFOU
7. 8 月 に JAWS-UG新潟 × Python機械学習勉強会 in 新潟 コラボ会開催予定 7 生 成AI特化！ スペシャルゲストによる講演あり！ Python製「Strands Agents SDK」を 用 いた 自 作 生 成AIエージェント作成ハンズオンも予定 詳細は後 日 connpassで公開します！
8. 本題
9. きっかけ 9 PHP Conference 新潟 2025 が5/31 ( 土 ) 開催！ ◦ PHP 5 . 3 止 まりで10年以上まともに触ってないワイ、CFPは流 石 に出せない 前 日 5/30 ( 金 ) に前夜祭あり！LT枠あり！ ◦ テーマは特に指定されてないから、PHPじゃなくても良さそう ◦ 県外参加者が 大 半だから、新潟のグルメでも紹介しようか ◦ せっかくならPHP絡めて、グルメサイトをPHP使って構築しよう
10. こんな感じのグルメサイト 10 ※ 画 面 は開発中のものです
11. 技術要素 11 フロントエンド: React v 1 8 . 2 ◦ AWS Amplify Hosting にて配信 バックエンド: PHP v 8 . 3 / Slim Framework v 4 . 1 4 ◦ AWS Lambda (Container with Lambda Web Adapter) / AWS Lambda Function URLs ◦ Amazon DynamoDB PHP Conferenceなので、バックエンドにPHPを使ったものの、 Amazon Q Developer for CLIのAIエージェントに作ってもらったので、コーディングしてない 2週間程度でまったり構築（ほとんどお店データの作成に時間かける）
12. Amazon Q Developer for CLI 12 無料で使える ◦ 有料のPro版もあるが、今回は無料のまま利 用 ◦ AWS Builder ID (AWSアカウントとは異なる) を登録すれば使える 基盤モデルは Anthropic Claude 3 . 7 Sonnet ◦ 利 用 当時はモデル変更不可 ◦ 2025/06現在は、Claude Sonnet 4 に変更可能
13. 初期プロンプトはこんな感じ 13 context.md に簡単な仕様を書く Amazon Q Developer for CLIのチャットで、 「context.md の内容に従って、Webサイト のソースコードを作成してください」と 入力 する → Amazon Q Developer for CLIのエージェン トによって、ソースコードが続々と作られる 動作確認しながら、context.mdに機能追加 してエージェントに作らせることを繰り返す # Niigata Gourmet Location Site 以下の内容のWebサイトを構築したい。 ## サイト内容 - 新潟駅周辺のグルメスポットを紹介するWebサイト - 画面内に大きな地図を表示して、グルメスポットにピンが表示されている - そのピンをクリックすると、グルメの画像と詳細項目が表示される - 詳細項目に該当グルメスポットのWeb URLも表示されるので、そのURLをク リックするとそのURLのWebページに別タブで画面遷移してほしい ## 仕様 - PCおよびモバイルデバイス上のWebブラウザで最適化表示してほしい。 - フロントエンドは React ベースで構築してほしい。 - バックエンドは PHP / Slim ベースで構築してほしい。 - データベースは Amazon DynamoDB を想定して構築してほしい。 - デプロイ先は AWS Lambda のコンテナイメージとし、Lambda Web Adopterと Lambda Function URLsを利用してほしい。
14. デプロイは 自 分で実施 14 デプロイ 手 順が 生 成されるので、それに従う 一 部おかしい部分があったが、それはワイの 方 です ぐ直した ◦ DockerfileのLambda Web Adapterの記述がおか しい等 フロントエンドのデプロイ先仕様を渡してなかった ので、 手 順書にはS 3 + Cloudfrontによる配信 手 順が 出てきた ◦ ワイの 方 でAmplify Hostingへのデプロイにした ◦ ついでにサブドメインで動作するように設定し た
15. データ整備は時間かける 15 サンプルデータができているので、フォー マットはそれに合わせて、データを作成 全部は載せきれないので、ある程度絞る ◦ それでも43件 画像は全てワイが過去に撮影したもの ◦ 画像なしのお店も 一 部ある（探すの疲れ たため） YAMLで定義してCLIでDynamoDBに投 入 niigata_gourmet_spots: - PutRequest: Item: id: S: spot1 name: S: "ラーチャン家 バスセンター店" tags: L: - S: "ラーメン" - S: "朝にオススメ" address: S: "新潟県新潟市中央区万代1-6-1 万代シテイバスセンタービル 1F" business_hours: S: "08:00-19:00 (土: 08:00-17:00)" website_url: S: "https://tabelog.com/niigata/A1501/ A150101/15020100/" image_url: S: "/images/spot1-rachanya.jpg" latitude: N: "37.916791360571864" longitude: N: “139.05572372595645" - PutRequest: Item: id: S: spot2 name: S: "万代そば" tags: L: - S: "カレー" - S: "朝にオススメ"
16. 前夜祭LT当 日 の模様 16 IUUQTXXXXBOUFEMZDPNDPNQBOJFTEJQQPTU@BSUJDMFT
17. 稼働後
18. アクセス数 18 Google Analytics 4 を仕込んでおいた Google Analytics 4 の集計によれば、80名のユーザがアクセス PHPカンファレンス新潟2025の参加者数: 115名 ざっくり約7割の参加者がアクセスしてくれた！
19. AWS費 用 19 AWS WAF: 約3USD AWS Amplify Hosting: 約0.3USD (内全てがビルド料 金 ) Amazon ECR: 約0.2USD (コンテナイメージのデータ転送料) AWS LambdaやAmazon DynamoDBは無料枠の範囲内のため無料 HTTPS証明書はAmplifyからACMの無料証明書を設定したので、費 用 かからず。 サーバーレス構成であるため、スポット的なサイトであったものの費 用 は格安！ トータル約3.5USD
20. 利 用 者の声 20
21. まとめ 21 PHP Conference 新潟 2025 前夜祭 LTで、新潟の 食 を掲載するグルメサイトを公開 Amazon Q Developer for CLIを使って、グルメサイトを構築 生 成AIでの構築はだいぶ当たり前になってきたので、サクッと作りたいものが作れる時代 作った後のデプロイやデータ 生 成もある程度できるようになってきている サーバーレスで構成すれば、ランニングコストはほとんどかからない 地 方 でこそ、 生 成AIとサーバーレスを活 用 して少ない費 用 で構築 ・ 運 用 していくべき
22. 最後に
23. KomeKaigi 始動 23 新潟で新たなITカンファレンス KomeKaigi 今秋開催予定！ ハッシュタグは #komekaigi
24. おしまい