アーキテクチャ道場＆ライブコーディング！Infrastructure as CodeでSNS風Webアプリをデプロイしてみよう！

「AWSで動かしたいサービスがあるけど、アーキテクチャはどうする？それを実際に構築する方法もわからない…」…そんな経験はありませんか？昨今アプリとインフラの境界が薄くなってきている中で、職種を問わず自らインフラ環境構築ができると便利なことは多いです。Infrastructure as Code (IaC) を使えば、インフラ構築を自動化して作業の手間を減らすだけでなく、静的解析や自動テスト、コードレビューなどのソフトウェア開発のプラクティスを適用することで、アプリ全体の信頼性とアジリティを高めることができます。AWSが提供するIaCツールの一つとして、AWS Cloud Development Kit (AWS CDK) があります。汎用プログラミング言語でインフラの構築やアプリのデプロイができるため、アプリケーション開発のスキルを活用することができます。また、インフラ構築のスキルをお持ちの方は、それを活かしてガードレールやテンプレートを作ることで組織全体に貢献することもできます。

今回は、日頃さまざまなお客様の課題解決を支援しているソリューションアーキテクトとプロトタイピングエンジニアたちが、「SNS風アプリを開発したい」という要望に対して最適なアーキテクチャを議論し、その結果を基にAWS CDK でデプロイする流れをライブコーディングでお見せします。「最適なアーキテクチャを決めるためにどのような議論をしているのか？」「そもそもIaCって何？」「IaCでアプリをデプロイするってどういうこと？」「アプリケーションエンジニアでもインフラ構築できるの？」といった疑問にお答えするセッションです。初心者にも分かりやすく学べる機会なのでお見逃しなく！

AWS Tech Talk Nightの資料です。

ブログ記事 https://techplay.jp/column/1653

動画 https://www.youtube.com/watch?v=Fn1Xi6UmnJI

Transcript

1. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. Infrastructure as Codeで SNS⾵Webアプリをデプロイしてみよう︕ アーキテクチャ道場＆ライブコーディング A W S T E C H T A L K N I G H T # 4 ⾼野 賢司 アマゾン ウェブ サービス ジャパン合同会社 ソリューションアーキテクト 友岡 雅志 アマゾン ウェブ サービス ジャパン合同会社 Prototyping Engineer ⼯藤 朋哉 アマゾン ウェブ サービス ジャパン合同会社 Prototyping Engineer 吉川 幸弘 アマゾン ウェブ サービス ジャパン合同会社 ソリューションアーキテクト
2. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. AWS Tech talk Night 開催の⽬的 AWS の最新技術やトレンド AWS では年間 3,000 以上の新サービスや機能をリリースしています。 この最新テクノロジーを⽤いたアーキテクチャや具体的な実装⽅法、実際に 導⼊いただいたお客様の事例などをご紹介します。 AWS の Solutions Architect の醍醐味 様々なバックグラウンドを持ったエンジニアたちと、お客様の課題や要件に 対して Dive Deep しつつ最新テクノロジーを⽤いて解決していく仕事は何 事にも変え難い喜びがあります。是⾮この醍醐味をお伝えさせてください。 以下の情報を様々なエンジニアの⽅に知っていただきたい
3. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. 登壇者紹介 3 ⾼野 賢司 アマゾン ウェブ サービス ジャパン合同会社 ソリューションアーキテクト 友岡 雅志 アマゾン ウェブ サービス ジャパン合同会社 Prototyping Engineer ⼯藤 朋哉 アマゾン ウェブ サービス ジャパン合同会社 Prototyping Engineer 吉川 幸弘 アマゾン ウェブ サービス ジャパン合同会社 ソリューションアーキテクト
4. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. アーキテクティングとは︖ 4 お客様⽬線で情報を整理し、システムの構造と備えるべき特性を設計するプロセス ⾃動⾞のデータを収集して 故障の原因を分析したい お客様 ソリューション アーキテクト ビジネス上の 背景と⽬的 代替案と トレードオフ 構造と特性 設計指針 要求のモデル化・アーキテクチャ設計 ▶ Invent and Simplify 設計者 合意形成・技術移管 • 幅広い技術⼒と多様な経験 • 最新の技術トレンドの把握 • 事業ドメインに関する知識 • 調整と舵取りを⾏う対⼈スキル with skills アーキテクティングに含める要素 ※ プロジェクトの背景や状況、組織などによって定義は異なります
5. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. アーキテクチャ道場 - AWS SA の仕事を⾒てみよう 5 まったく新しい SNS サービスを 思いついたぞ︕ でもどうやって AWS で動かす︖ SA に相談だ︕ boyaki ※ 架空の名称です。実在のサービスとは⼀切関連がありません。
6. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. お客様の要件をヒアリングしてみよう 6 どんなサービス︖ • インターネット公開の SNS サービス サービスにおいて重視することは︖ • 開発効率 • サービス開始時の利⽤者が少ないときのコスト効率 最⼩限でどんな機能が必要︖ (MVP) • メッセージの投稿と閲覧 将来的にはどんな拡張を予定︖ • メッセージの全⽂検索 • フォロー機能 アーキテクチャに対する希望は︖ • SPA • インフラを意識したくない ⼯藤 AWS SA 役 お客様役 ⾼野
7. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. シンプルなアーキテクチャから始める 7 AWS Cloud Region ユーザー Amazon Cognito (認証) 認証 Amazon CloudFront (CDN) Amazon S3 (静的コンテンツ) Nuxt.js アプリを取得 Nuxt.js - SPA Nuxt.js - API API エンドポイント コンピュート データベース API 呼び出し 投稿データを 書込・読出
8. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. ディスカッション#1 コンピュートに使うサービスは︖ 8 AWS Cloud Region ユーザー Amazon Cognito (認証) Amazon CloudFront (CDN) Amazon S3 (静的コンテンツ) API エンドポイント コンピュート データベース AWS Lambda? コンテナ︖ AWS App Runner Amazon Elastic Container Service (Amazon ECS) Elastic Load Balancing AWS Lambda Amazon API Gateway 多 少 オ ペ レ $ シ & ン
9. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. AWS Cloud Region レスポンス速度も、リッチな検索も欲しい ディスカッション#2 データベースは︖ 9 Amazon CloudFront (CDN) Amazon S3 (静的コンテンツ) Amazon API Gateway Amazon Cognito (認証) Lambda 関数 (投稿) データベース ユーザー Amazon Neptune Amazon OpenSearch Service Amazon DynamoDB ぼやき (投稿) を Key-value で保存 全⽂検索 フォローの 関係性を管理 Serverless New!! DynamoDB Streams
10. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. ディスカッション#3 どうやってデプロイするの︖ 10 AWS Cloud Region Amazon CloudFront (CDN) Amazon S3 (静的コンテンツ) Amazon API Gateway Amazon Cognito (認証) Lambda 関数 (投稿) Amazon DynamoDB GitHub 開発者 ユーザー CDK Pipelines AWS CodeBuild (ビルド&テスト) CloudFormation Stack AWS CDK git push
11. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. 合意したアーキテクチャ 11 AWS Cloud Region ユーザー GitHub 開発者 git push CDK Pipelines AWS CodeBuild (ビルド&テスト) CloudFormation Stack 各リソースをデプロイ Amazon Cognito (認証) 認証 Amazon API Gateway Lambda 関数 (投稿) Amazon DynamoDB API 呼び出し 投稿データを書込・読出 Amazon CloudFront (CDN) Amazon S3 (静的コンテンツ) Nuxt.js アプリを取得 Nuxt.js - SPA Nuxt.js - API AWS CDK
12. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. アーキテクティングにおいて⼤事なこと • お客様のビジネスにおいて何が重要かを⼀緒に考える • アーキテクチャを継続的に発展させる • ⾃動化によってアーキテクチャでの実験を容易にする 12 Infrastructure as Code が鍵
13. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. おすすめ育児グッズ向け SNS を AWS 新⼈が作ってみた • Amazon Neptune (グラフDB) で 「友⼈の友⼈」を探せる SNS アプリを作る過程を紹介 • サービスをデザインするために Amazon の⽂化である Working Backwards を活⽤ • 新⼈ SA の⽴ち上がり⽀援を どのように⾏っているかや、 実際に新⼈ SA が採⽤した サービスの学習⽅法も紹介 B U I L D E R S . F L A S H 記 事 紹 介 14 https://aws.amazon.com/jp/builders-flash/202208/create-childcare-goods-sns/
14. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. Infrastructure as Code (IaC) とは︖ 15 ※ ここからは通常モードでお届けします
15. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. Infrastructure as Code (IaC) とは︖ 機械が処理できる定義ファイル (またはコード) によって インフラストラクチャの管理やプロビジョニングを⾏うプロセス 16 ソースコード IaC ツール クラウドリソース
16. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. なぜ Infrastructure as Code (IaC) が必要なのか︖ ⼿動操作やスクリプトの課題＝⼿続き型 • 現在の状態がわからずリリースしづらい • ⼈による解釈違いや操作ミスのリスクあり • 何度も同じ構成を作るのが⼤変 • ⼿順書やスクリプトの作成に時間がかかり 継続的な更新やテストが困難（陳腐化） • リソースの状態による判断やエラー処理、 ロールバックを網羅しづらい 17 手順書 パラメータシート 人による 解釈と操作 クラウド リソース マネジメント コンソール クラウド リソース AWS CLI AWS SDK シェルスクリプト 汎用プログラミング言語 ⼿動操作（マネジメントコンソール） スクリプト（CLI, SDK）
17. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. Infrastructure as Code (IaC) のメリット コスト削減 • ⼿順書の作成、メンテナンス、 引継ぎコストを削減 • ⼿順書と実環境の乖離による ブラックボックス化を防⽌ • デプロイ作業時間を削減 • 必要なときにリソースを作成、 まとめて破棄 スピードアップ • CI/CD で⾃動テスト、デプロイ • 変更を予測可能にして 頻繁にデプロイ • 同じ構成を何度でもデプロイ • 構成パターンと ベストプラクティスの共有 リスク低減 • ⼈的ミスの排除 • バージョン管理による 変更の追跡と承認プロセス • 信頼できる唯⼀の情報源 としての Git リポジトリ • 必要に応じて前のバージョン にロールバック 18
18. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. AWS Cloud Development Kit (CDK) AWS CDK Meeting developers where they are 使い慣れたプログラミング⾔語で クラウドリソースを定義できる OSS のフレームワーク アプリ全体をコードで定義 ⾼レベルの抽象化 開発者体験を改善 • アプリと同じ⾔語で記述でき ドメイン固有⾔語の習得が不要 • プログラミング⾔語の表現⼒と IDE の機能を活⽤ • 静的解析とユニットテスト • クラウドリソースだけでなく AWS Lambda 関数のコードや コンテナイメージなど アプリ全体をまとめて管理 • CI/CD パイプラインを⾃動構築 • 複数の AWS アカウントに またがる環境を管理 • 複雑な設定を抽象化し コード量と学習コストを削減 • いつでも抽象化から抜け出して 個別の設定にアクセス可能 • ベストプラクティスに基づく デフォルト値と設定を提供 • チームの構成パターンや ガードレールを共有・再利⽤ TypeScript JavaScript Python Java .NET Go
19. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. AWS CDK のしくみ プログラミング⾔語で インフラ構成を定義 開発者 AWS CDK Toolkit (CLI) CloudFormation テンプレートに変換 アセットのバンドルとデプロイ AWS CloudFormation テンプレートに従い リソースを⽬的の状態にする $ cdk deploy クラウドリソース ⽬的の状態に収束 TypeScript JavaScript Python Java .NET Go Node.js Templates + Assets = Cloud Assembly 各⾔語のコンストラクトライブラリを利⽤ • S3 バケットがなかったら作成 • 状態が違っていたら更新 • 状態が同じなら何もしない etc. Node.js のコマンドラインツール API 呼び出し
20. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. AWS CDK の概念 https://docs.aws.amazon.com/cdk/v2/guide/home.html • アプリケーション全体 • 複数のAWSアカウント、リージョンに またがることが可能 App • CloudFormation スタックに対応 • デプロイ可能な最⼩単位 Stack • CDKの最も基本的なビルディングブロック • 1つまたは複数のAWSリソースを表現 • ユーザーにより定義・配布が可能 Construct • 複数の Stack をまとめて論理的な アプリ (サービス) のかたまりを表現 • 1つの Stage を定義して環境ごとに インスタンス化することで複製が可能 Stage (Optional)
21. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. AWS Constructs Library AWS CDK が標準で提供する Construct のライブラリ Patterns (L3) • 複数のリソースを含む⼀般的な構成パターンを事前に定義したもの • aws-ecs-patterns.LoadBalancedFargateService など High-level constructs (L2) • デフォルト値や便利なメソッドを定義したAWSリソースを表すクラス • 例）クラス s3 は メソッド s3.Bucket.addLifeCycleRule() を持つ Low-level constructs (L1) • CloudFormationリソースおよびプロパティと1:1で対応（⾃動⽣成される） • CfnXXX という名前 （例︓s3.CfnBucket は AWS::S3::Bucket を意味） • すべてのプロパティを明⽰的に設定する必要がある
22. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. © 2022, Amazon Web Services, Inc. or its affiliates. AWS CDK のライブコーディング 23
23. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. SNS アプリのアーキテクチャ 24 AWS Cloud Region Amazon CloudFront (CDN) Amazon S3 (静的コンテンツ) Amazon API Gateway Amazon Cognito (認証) Lambda 関数 (投稿) Amazon DynamoDB CDK Pipelines AWS CodeBuild (ビルド&テスト) GitHub CloudFormation Stack 開発者 ユーザー git push 各リソースをデプロイ Nuxt.js アプリを取得 API 呼び出し 認証 投稿データを書込・読出 Nuxt.js - SPA Nuxt.js - API AWS CDK コーディング範囲
24. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. Assets でアプリケーションをデプロイ Amazon S3 - aws_s3_deployment モジュール new BucketDeployment(this, 'WebAppDeploy', { destinationBucket: s3Bucket!, distribution: cloudFrontWebDistribution, // invalidation sources: [ // Deploy a React frontend app Source.asset('webapp/dashboard/build'), ], }); TypeScript • ローカル zip ファイル • ローカルディレクトリ • テキスト / JSON データ (デプロイ時に挿⼊可能) AWS Lambda - aws_lambda モジュール new NodejsFunction(this, 'Handler', { entry: 'lambda/metrics-handler.ts', handler: 'get', }); TypeScript • ローカルのソースコードをバンドル • aws_lambda_nodejs モジュールの場合は esbuild で TypeScript をトランスパイル＆バンドル Amazon ECS - aws_ecs モジュール const taskDefinition = new FargateTaskDefinition(this, 'Def', { cpu: 256, memoryLimitMiB: 512, }); taskDefinition.addContainer('Recorder', { image: ContainerImage.fromAsset('container/recorder'), }); TypeScript • ローカルの Dockerfile から コンテナイメージを作成し Amazon ECR リポジトリに push してデプロイ Amazon ECR
25. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. Emma's sandbox コードの変更をすばやくクラウドに反映 cdk deploy --hotswap / cdk watch • Lambda 関数、ECS コンテナ、Step Functions ステートマシンなどを CloudFormation を経由せず API で直接デプロイすることで素早く反映 https://github.com/aws/aws-cdk/blob/main/packages/aws-cdk/README.md#hotswap-deployments-for-faster-development • CloudFormation スタックとドリフトが発⽣するため、開発⽤途でのみ使⽤ • cdk watch 実⾏中はスタックに含まれる CloudWatch Logs の更新を⾃動的に受信 (tail) • ローカルマシンにエミュレーター等を導⼊しなくても、クラウドで直接開発できる $ cdk watch --all 'watch' is observing directory 'lambda' for changes ... Detected change to 'lambda/handler.ts' (type: change). Triggering 'cdk deploy' ... ✨ Deployment time: 11.48s ... [/aws/lambda/SNSHandler-SNSHandler00XXXX] 17:06:32 2022- 08-17T08:06:32.634Z INFO Hello world! Console . ├── bin │ └── sns-handler.ts ├── lib │ └── sns-handler-stack.ts └── lambda └── handler.ts 変更を検知 ⾃動でデプロイ CloudWatch Logs の更新を受信 Lambda Function CloudWatch Logs
26. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. Lambda 関数を CDK で開発: aws_lambda_nodejs esbuild を使⽤して TypeScript または JavaScript コードを ⾃動でトランスパイルおよび バンドルしてデプロイする ⾼レベルコンストラクト • 依存ライブラリから必要なコードを 抽出するためバンドルサイズが ⼩さくなる (Tree shaking) • デフォルトでは CDK プロジェクトと 同じ依存パッケージを使⽤ • esbuild がローカルインストール※ されていなければ Docker でビルド ※ npm install --save-dev esbuild@0 https://docs.aws.amazon.com/cdk/api/v2/docs/aws-cdk-lib.aws_lambda_nodejs-readme.html . ├── bin │ └── sns-handler.ts ├── lib │ └── sns-handler-stack.ts ├── lambda │ └── handler.ts └── package.json new NodejsFunction(this, 'Handler', { entry: 'lambda/metrics-handler.ts', handler: 'get', }); TypeScript import { Context, SNSEvent, SNSHandler } from 'aws-lambda'; export const publish: SNSHandler = async (event: SNSEvent, context: Context) => { console.log('Received event: ', JSON.stringify(event, null, 4)); }; TypeScript # CDK プロジェクトのルートディレクトリでインストール $ npm install --save aws-lambda @types/aws-lambda Console
27. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. AWS CDK のリソース AWS CDK Developer Guide https://docs.aws.amazon.com/ja _jp/cdk/v2/guide/home.html AWS CDK のコンセプトや ベストプラクティスなど 開発に役⽴つ情報を記載 API Reference https://docs.aws.amazon.com/cd k/api/v2/docs/aws-construct- library.html API の仕様はこちらで確認 CDK Workshop https://cdkworkshop.com/ 実際にコードを書きながら CDK を学べるワークショップ TypeScript, Python, .NET, Java, Go に対応 28 ⽇本語対応!!
28. AWS TECH TALK NIGHT #4 - アーキテクチャ道場 & ライブコーディング © 2022, Amazon Web Services, Inc. or its affiliates. Thank you! © 2022, Amazon Web Services, Inc. or its affiliates. ⾼野 賢司 アマゾン ウェブ サービス ジャパン合同会社 ソリューションアーキテクト 友岡 雅志 アマゾン ウェブ サービス ジャパン合同会社 Prototyping Engineer ⼯藤 朋哉 アマゾン ウェブ サービス ジャパン合同会社 Prototyping Engineer 吉川 幸弘 アマゾン ウェブ サービス ジャパン合同会社 ソリューションアーキテクト