【AWS CDK Workshop】CDK PipelinesのセクションをCodeCommitではなくGitHubでやってみた

# はじめに
AWS CDKの勉強のために[CDK Workshop](https://cdkworkshop.com/)をやりました。このWorkshopの[CDK Pipelinesのセクション](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines.html)ではCodeCommitを使っています。ただ、実際の業務ではGitHubを使うことが多いので、勉強がてらGitHubに変更してやってみました。

# [CDK Pipelinesのセクション](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines.html)をCodeCommitではなくGitHubでやる方法
Workshopのセクション毎に手順を記載します。

## [GETTING STARTED WITH PIPELINES](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines/1000-setting-up.html)
CodeCommitの場合と同じです。

## [CREATE REPOSITORY](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines/2000-create-repo.html)
CodeCommitのリポジトリを作る必要はないです。GitHubにリポジトリを作成して、コードをpushしておきましょう。

## [CREATE NEW PIPELINE](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines/3000-new-pipeline.html)

### 事前準備
まず、GitHubとのConnectionを作成する必要があります。

1. [Connection](https://ap-northeast-1.console.aws.amazon.com/codesuite/settings/connections?region=ap-northeast-1&connections-meta=eyJmIjp7InRleHQiOiIifSwicyI6e30sIm4iOjIwLCJpIjowfQ)を開いて、接続の作成を押しましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/123126/600064eb-c8ea-dd28-e609-1172511cada4.png)

1. Githubへの接続を選択しましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/123126/12d7cf91-7593-9ddc-5a13-655ec16852bb.png)

1. 新しいアプリをインストールするをクリックして、リポジトリへの読み取り権限を与えて、接続を押しましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/123126/95cdcf99-764e-1f14-bda6-00fb491aac54.png)

1. 生成したConnectionのARNは後で使うのでメモしておきましょう。

### [Define an Empty Pipeline](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines/3000-new-pipeline.html#define-an-empty-pipeline)
`input`はCodeCommitではなくGitHubを指定しましょう。
また、GitHubのリポジトリ名など必要な情報はコマンドライン引数経由で取得するようにしてます。

```lib/pipeline-stack.ts
import * as cdk from 'aws-cdk-lib';
import { Construct } from 'constructs';
import * as codecommit from 'aws-cdk-lib/aws-codecommit';
import { WorkshopPipelineStage } from './pipeline-stage';
import {
  CodeBuildStep,
  CodePipeline,
  CodePipelineSource,
} from 'aws-cdk-lib/pipelines';
import { Pipeline } from 'aws-cdk-lib/aws-codepipeline';

export class WorkshopGithubPipelineStack extends cdk.Stack {
  constructor(scope: Construct, id: string, props?: cdk.StackProps) {
    super(scope, id, props);

    /* 必要な情報をコマンドライン引数経由で取得 */
    const owner = this.node.tryGetContext('Owner') as string
    const repository = this.node.tryGetContext('Repository') as string
    const branch = this.node.tryGetContext('Branch') as string
    const connectionArn = this.node.tryGetContext('ConnectionArn') as string

    // The basic pipeline declaration. This sets the initial structure
    // of our pipeline
    const pipeline = new CodePipeline(this, 'CodePipeline', {
      codePipeline: new Pipeline(this, 'Pipeline', {
        restartExecutionOnUpdate: false,
      }),
      selfMutation: false,
      synth: new CodeBuildStep('SynthStep', {
        /* GitHubから読み込み */
        input: CodePipelineSource.connection(
          `${owner}/${repository}`,
          `${branch}`,
          {
            connectionArn: connectionArn,
            triggerOnPush: false
          }
        ),
        installCommands: ['npm install -g aws-cdk'],
        commands: [
          'npm ci',
          'npm run build',
          'npx cdk synth',
        ],
      }),
    });
  }
}
```

ちなみに、本記事の主題ではないのですが、下記のオプションを指定しています。

- `selfMutation: false`
    パイプライン実行時にパイプラインの更新をしないようにする。
- `restartExecutionOnUpdate: false`
    パイプライン更新時に自動実行をしないようにする。
- `triggerOnPush: false`
    コードpush時に自動実行をしないようにする。

### [Define an Empty Pipeline](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines/3000-new-pipeline.html#define-an-empty-pipeline)

`-c`オプションを指定してデプロイしましょう。

- Owner
    GitHubリポジトリのOwner名
- Repository
    GitHubリポジトリ名
- Branch
    GitHubプランチ名
- ConnectionArn
    先ほど生成したConnectionのARN

```
cdk deploy -c Owner={Owner} -c Repository={Repository} -c Branch={Branch} -c ConnectionArn={ConnectionArn}
```

# [ADD APPLICATION TO PIPELINE](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines/4000-build-stage.html)
CodeCommitの場合と同じです。

# [POLISH PIPELINE](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines/5000-test-actions.html)
CodeCommitの場合と同じです。

# [CLEANUP](https://cdkworkshop.com/20-typescript/70-advanced-topics/200-pipelines/6000-cleanup.html)
CodeCommitの場合と同じです。

# 最後に
全体のソースコードは下記のリポジトリに公開しています。

https://github.com/shimi7o/cdk-workshop-github