Skip to content

Instantly share code, notes, and snippets.

@yano3nora

yano3nora/amplify-with-cdk.md

Last active January 23, 2022 05:16
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save yano3nora/1e13c35c8e1e8b55db8b7a6c6f4316b6 to your computer and use it in GitHub Desktop.
Save yano3nora/1e13c35c8e1e8b55db8b7a6c6f4316b6 to your computer and use it in GitHub Desktop.
Download ZIP
[dev: Amplify + CDK] Add custom resource to Amplify using CDK. #dev #aws
Raw
amplify-with-cdk.md

Overview

Use CDK to add custom AWS resources - docs.amplify.aws
AWS CDK API Reference
Amplify x CDK でカスタムリソースを作る& CDK v2 に移行する

  • Amplify で提供されてない AWS Resource を追加したい場合は amplify add custom から
    • CDK か CloudFormation の 2 択
    • CloudFormation を手動で組むの人間のやることじゃないので CDK を頑張る
  • AWS CDK (Cloud Development Kit) は TypeScript などを使って IaC するやつ
  • 通常の CDK CLI で構成するより楽に Amplify プロジェクト CloudFormation に組み込めそう
    • CDK CLI だと構成ファイル cdk-stack.ts 書いてから cdk synth で CloudFormation 用のテンプレート json にバラして cdk deploy で適用 ... という感じぽい
    • Amplify 統合だと cdk-stack.ts 書くだけでよさそう

CDK 自体の概念や利用方法は ↓ あたりでさらっとくとよき。

Getting Started

AWS CDKまたはCloudFormationを使用し、カスタムAWSリソースでAmplifyバックエンドを拡張する新機能「カスタム」のご紹介

$ amplify add custom

? How do you want to define this custom resource? …  (Use arrow keys or type to filter)
❯ AWS CDK
  AWS CloudFormation

# ↑ ののち amplify/backend/custom/xxx/cdk-stack.ts を編集

# ts のビルド
$ npm run build

# CDK のビルド (多分だけど CloudFormation テンプレの生成かな？)
$ amplify build

# AWS リソースのデプロイ (amplify build を内部的に実行してから)
$ amplify push

公式ぱっと見た感じだと、プロジェクト名と環境名をリソース命名規則に入れる感じでいいみたい。

import * as cdk from '@aws-cdk/core'
import * as AmplifyHelpers from '@aws-amplify/cli-extensibility-helper'

// こいつら (SNS) をカスタムとして入れる
import * as sns from '@aws-cdk/aws-sns'
import * as subs from '@aws-cdk/aws-sns-subscriptions'

// クラス名とファイル名関係してるのかわからんが変更 NG だった
export class cdkStack extends cdk.Stack {
  constructor(
    scope: cdk.Construct,
    id: string,
    props?: cdk.StackProps,
    amplifyResourceProps?: AmplifyHelpers.AmplifyResourceProps
  ) {
    super(scope, id, props)

    // こいつはうごかさない
    /* Do not remove - Amplify CLI automatically injects the current deployment environment in this input parameter */
    new cdk.CfnParameter(this, 'env', {
      type: 'String',
      description: 'Current Amplify CLI env name',
    })

    // Amplify のプロジェクト名、環境 (ENV) 名はこんな感じで取得
    const project = AmplifyHelpers.getProjectInfo().projectName
    const stage = cdk.Fn.ref('env')
    
    const topic = new sns.Topic(this, 'sns-topic', {
      topicName: `sns-topic-${project}-${stage}`
    });

    // SNS なので ↑ topic を受信したときに email 通知を送信するような感じ、多分
    topic.addSubscription(new subs.EmailSubscription("my-email-address@example.com"))
  }
}

Refs Amplify Resource

Reference Amplify-generated resources

Amplify で作成した AWS Resource (Lambda とか) を参照もできる。

const dependencies: AmplifyDependentResourcesAttributes = AmplifyHelpers.addResourceDependency(this,
  amplifyResourceProps.category,
  amplifyResourceProps.resourceName,
  [
    {
      category: "function", // api, auth, storage, function, etc.
      resourceName: "<resource-name>",
    },
  ],
)

// 現在の ENV 環境に応じたリソースを参照するために ↓ cdk.Fn.ref() で取得するらしい
const myFunctionArn = cdk.Fn.ref(dependencies.function.<resource-name>.Arn)

Usage

Aurora Serverless

RDS Proxy + RDS

cdk-patterns/serverless - serverless/the-rds-proxy/typescript/lib/the-rds-proxy-stack.ts

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment