Slide 1

Slide 1 text

#jawsugibaraki #jawsug_cdk ~Everything as Codeを諦めない ~ 後からCDK 株式会社シーズ - Yuta Nakamura / よ〜ん JAWS-UG 茨城 #11 CDK支部コラボ回

Slide 2

Slide 2 text

#jawsugibaraki #jawsug_cdk 京都出身・京都在住 株式会社シーズ クラウドソリューション事業部 Twitter(X) @tesla_yoon 好き AWS Step Functions / AWS CDK Amazon Lightsail / 🉐 カミナリ(芸人) 2 Yuta Nakamura / よ〜ん

Slide 3

Slide 3 text

#jawsugibaraki #jawsug_cdk 後からCDKに対するモチベーション 最初からCDK(IaC)で管理してないと辛い...🫠 → 激しく同意 → KiroやClaude Codeといった最高のツールがあるじゃないか

Slide 4

Slide 4 text

#jawsugibaraki #jawsug_cdk 今からお話しすること ● (ざっくり)Everything as Codeとは ● 後からCDKの恩恵を知っていただく ○ サンプル構成について軽く説明 ○ 後からCDKで取り込む ■ L1からL2へのリファクタリング ○ AIにトラブルシュートしてもらう ■ CDKがない時😢 ■ CDKがある時(L1 Construct)🤣 ■ CDKがある時(L2 Construct)🤣

Slide 5

Slide 5 text

#jawsugibaraki #jawsug_cdk お持ち帰りしていただきたいこと ● 後からCDK(IaC)はアリ、むしろやるべき ● 今ある環境をIaCにするのはAI Agentに任せても良さそう

Slide 6

Slide 6 text

#jawsugibaraki #jawsug_cdk Everything as Code https://docs.aws.amazon.com/wellarchitected/latest/devops-guidance/everything-as-code.html https://pages.awscloud.com/rs/112-TZM-766/images/AWS-57_Development_AWS-Summit-JP-2025.pdf

Slide 7

Slide 7 text

#jawsugibaraki #jawsug_cdk サンプル構成

Slide 8

Slide 8 text

#jawsugibaraki #jawsug_cdk [一応] サンプル構成 デプロイフロー

Slide 9

Slide 9 text

#jawsugibaraki #jawsug_cdk サンプル構成 この構成を CDKで取り込んでいく

Slide 10

Slide 10 text

#jawsugibaraki #jawsug_cdk (ざっくり) IaCジェネレーターのスキャンを実施

Slide 11

Slide 11 text

#jawsugibaraki #jawsug_cdk (ざっくり) IaCジェネレーターのスキャンを実施

Slide 12

Slide 12 text

#jawsugibaraki #jawsug_cdk (ざっくり) IaCジェネレーターのスキャンを実施

Slide 13

Slide 13 text

#jawsugibaraki #jawsug_cdk cdk migrate --stack-name sample-dev --from-path \ ./sample-dev.yaml --language typescript テンプレートを CDKに取り込む (CDK migrate) https://docs.aws.amazon.com/ja_jp/cdk/v2/guide/ref-cli-cdk-migrate.htm

Slide 14

Slide 14 text

#jawsugibaraki #jawsug_cdk L1 constructからL2 constructへ (CloudFront Distributionの例) const distribution = new cloudfront.CfnDistribution(this, 'CloudFrontDistribution', { distributionConfig: { enabled: true, comment: '??? official website ????', defaultRootObject: 'index.html', httpVersion: 'http2', ipv6Enabled: true, priceClass: 'PriceClass_All', webAclId: webAcl.attrArn, origins: [ { id: config.originId, domainName: bucket.attrRegionalDomainName, originAccessControlId: originAccessControl.attrId, connectionAttempts: 3, connectionTimeout: 10, originCustomHeaders: [], originPath: '', originShield: { enabled: false, }, s3OriginConfig: { originAccessIdentity: '', }, }, ], defaultCacheBehavior: { targetOriginId: config.originId, viewerProtocolPolicy: 'redirect-to-https', cachePolicyId: MANAGED_CACHING_OPTIMIZED, compress: true, allowedMethods: ['HEAD', 'GET'], cachedMethods: ['HEAD', 'GET'], smoothStreaming: false, functionAssociations: [], lambdaFunctionAssociations: [], trustedSigners: [], trustedKeyGroups: [], fieldLevelEncryptionId: '', }, viewerCertificate: { cloudFrontDefaultCertificate: true, minimumProtocolVersion: 'TLSv1', }, restrictions: { geoRestriction: { restrictionType: 'none', locations: [], }, }, logging: { bucket: '', includeCookies: false, prefix: '', }, aliases: [], cacheBehaviors: [], customErrorResponses: [], originGroups: { quantity: 0, items: [], }, staging: false, continuousDeploymentPolicyId: '', }, }); const distribution = new cloudfront.Distribution(this, 'CloudFrontDistribution', { comment: '??? official website ????', defaultRootObject: 'index.html', httpVersion: cloudfront.HttpVersion.HTTP2, enableIpv6: true, priceClass: cloudfront.PriceClass.PRICE_CLASS_ALL, webAclId: webAcl.attrArn, enabled: true, defaultBehavior: { origin: s3Origin, viewerProtocolPolicy: cloudfront.ViewerProtocolPolicy.REDIRECT_TO_HTTPS, cachePolicy: cloudfront.CachePolicy.CACHING_OPTIMIZED, compress: true, allowedMethods: cloudfront.AllowedMethods.ALLOW_GET_HEAD, cachedMethods: cloudfront.CachedMethods.CACHE_GET_HEAD, smoothStreaming: false, }, minimumProtocolVersion: cloudfront.SecurityPolicyProtocol.TLS_V1, });

Slide 15

Slide 15 text

#jawsugibaraki #jawsug_cdk Resources [~] AWS::CloudFront::Distribution CloudFrontDistribution CloudFrontDistribution └─ [~] DistributionConfig ├─ [-] Removed: .Aliases ├─ [-] Removed: .CacheBehaviors ├─ [-] Removed: .ContinuousDeploymentPolicyId ├─ [-] Removed: .CustomErrorResponses ├─ [~] .DefaultCacheBehavior: │ ├─ [~] .AllowedMethods: L1 constructからL2 constructへ

Slide 16

Slide 16 text

#jawsugibaraki #jawsug_cdk Resources [~] AWS::CloudFront::Distribution CloudFrontDistribution CloudFrontDistribution └─ [~] DistributionConfig ├─ [-] Removed: .Aliases ├─ [-] Removed: .CacheBehaviors ├─ [-] Removed: .ContinuousDeploymentPolicyId ├─ [-] Removed: .CustomErrorResponses ├─ [~] .DefaultCacheBehavior: │ ├─ [~] .AllowedMethods: L1 constructからL2 constructへ 立ちはだかる大量の diff

Slide 17

Slide 17 text

#jawsugibaraki #jawsug_cdk AIに揃えさせる

Slide 18

Slide 18 text

#jawsugibaraki #jawsug_cdk AIに揃えさせる 答え(既存環境)があってそれに合わせる →AIが得意なタスク

Slide 19

Slide 19 text

#jawsugibaraki #jawsug_cdk AIに揃えさせる 答え(既存環境)があってそれに合わせる →AIが得意な奴やん Stack sample-dev There were no differences 5分ぐらいで no differencesになった

Slide 20

Slide 20 text

#jawsugibaraki #jawsug_cdk L1(Before) → L2(After)

Slide 21

Slide 21 text

#jawsugibaraki #jawsug_cdk L1(Before) → L2(After) 211行から174行まで削減

Slide 22

Slide 22 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - 検証条件 新人のフロントエンドエンジニアさん ● developmentやmainにマージしたらgithub actionsが走ることは知ってる。 ● AWSは全く知らないとする。 ● ネットワーク関連の知識についても全く知らない。 ● AIに指示されたことはできるとする。 ○ Chromeの開発者モードを見る。 ○ GitHub Actionsが成功しているか見る。 ○ ただし、AWSのマネージドコンソールにはアクセスできない。

Slide 23

Slide 23 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - 検証条件 新人のフロントエンドエンジニアさん ● developmentやmainにマージしたらgithub actionsが走ることは知ってる。 ● AWSは全く知らないとする。 ● ネットワーク関連の知識についても全く知らない。 ● AIに指示されたことはできるとする。 ○ Chromeの開発者モードを見る。 ○ GitHub Actionsが成功しているか見る。 ○ ただし、AWSのマネージドコンソールにはアクセスできない。 この条件でよ〜んがロールプレイします

Slide 24

Slide 24 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - 解決したい事象 Developmentブランチへのマージを行ったが、開発環境でエラーが発生 → よ〜んのPCが許可IPに入ってない などが原因

Slide 25

Slide 25 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - 共通条件 一発目のプロンプト developmentにマージしたんだけど、何も表示されない。 使用したエディタ Kiro 使用したモデル Claude Opus 4.5 One-shotでやります。

Slide 26

Slide 26 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - 共通条件 一発目のプロンプト developmentにマージしたんだけど、何も表示されない。 使用したエディタ Kiro 使用したモデル Claude Sonnet 4.5 One-shotでやります。 やり取りの回数・トークンの消費率で見ていきます

Slide 27

Slide 27 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - 各条件 IaCがない時 CDKがある時(L2) CDKがある時(L1) . ├── .github │ └── workflows │ └── deploy-to-s3.yml ├── iac │ └── sample-l1 │ ├── bin │ ├── cdk.json │ ├── lib │ ├── migrate.json │ ├── package-lock.json │ ├── package.json │ ├── README.md │ ├── test │ └── tsconfig.json └── src └── index.html . ├── .github │ └── workflows │ └── deploy-to-s3.yml ├── iac │ └── sample-l2 │ ├── bin │ ├── cdk.json │ ├── lib │ ├── migrate.json │ ├── package-lock.json │ ├── package.json │ ├── README.md │ ├── test │ └── tsconfig.json └── src └── index.html . ├── .github │ └── workflows │ └── deploy-to-s3.yml └── src └── index.html

Slide 28

Slide 28 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - IaCがない時

Slide 29

Slide 29 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - IaCがない時

Slide 30

Slide 30 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - IaCがない時

Slide 31

Slide 31 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - IaCがない時 どう足掻いてもマネコンに誘導される

Slide 32

Slide 32 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - CDKがある時(L2)

Slide 33

Slide 33 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - CDKがある時(L2) 一発

Slide 34

Slide 34 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - CDKがある時(L1)

Slide 35

Slide 35 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - CDKがある時(L1) 一発

Slide 36

Slide 36 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - 結果まとめ IaCがない時 CDKがある時(L2) CDKがある時(L1) やり取り回数 10↑ 1 1 トークン消費率 23% 12% 13% 解決できたか 未解決❌ 解決✅ 解決✅

Slide 37

Slide 37 text

#jawsugibaraki #jawsug_cdk AIにトラブルシュートしてもらう - 結果まとめ IaCがある時 CDKがある時(L2) CDKがある時(L1) やり取り回数 10↑ 1 1 トークン消費率 23% 12% 13% 解決できたか 未解決❌ 解決✅ 解決✅ 今回の条件下では L1とL2に有意差はなかった

Slide 38

Slide 38 text

#jawsugibaraki #jawsug_cdk まとめ ● 手段を問わずIaCすることが重要 ○ L2 Constructで記述した方が、人間もわかりやすい 。 ■ 機能追加があった時、インフラに手を加えやすい(はず) ● 既存の環境をCDKの管理下におく作業 ○ 答え合わせがしやすい。 ■ cdk diffして、変更がなければOKのため ● AIにやらせる。 ○ 手放しで走らせるためにポリシーの設定だけやる

Slide 39

Slide 39 text

#jawsugibaraki #jawsug_cdk まとめ ● 手段を問わずIaCすることが重要 ○ L2 Constructで記述した方が、人間もわかりやすい 。 ■ 機能追加があった時、インフラに手を加えやすい(はず) ● 既存の環境をCDKの管理下におく作業 ○ 答え合わせがしやすい。 ■ cdk diffして、変更がなければOKのため ● AIにやらせる。 ○ 手放しで走らせるためにポリシーの設定だけやる 後からCDK(IaC)アリ、むしろやるべき

Slide 40

Slide 40 text

#jawsugibaraki #jawsug_cdk 参考 AI Agent 時代のソフトウェア開発の型 〜 Everything as Code で叡智を伝える 〜 https://pages.awscloud.com/rs/112-TZM-766/images/AWS-57_Development_AWS- Summit-JP-2025.pdf Everything as code - DevOps Guidance https://docs.aws.amazon.com/ja_jp/wellarchitected/latest/devops-guidance/everythi ng-as-code.html cdk migrate - AWS クラウド開発キット (AWS CDK) v2 https://docs.aws.amazon.com/ja_jp/cdk/v2/guide/ref-cli-cdk-migrate.html

Slide 41

Slide 41 text

#jawsugibaraki #jawsug_cdk 🀄🀄AWS麻雀を復活させています!ぜひお祭りブースへ 🀄🀄

Slide 42

Slide 42 text

#jawsugibaraki #jawsug_cdk ありがとうございました ● 後からCDKに対するモチベーション ● Everything as Code ● 後からCDKによる恩恵 ○ サンプル構成について ○ サンプル構成をCDK管理下に ○ L1 ConstructからL2 Constructへ ○ トラブルシュートのシミュレーション ● まとめ