How to Set Up your Project with CDK and Amplify

AWS Amplify can host a web site directly from a source code repository, such as git or AWS Code Commit. The AWS Cloud Developer Kit, or CDK, makes it easy to create and deploy site without ever having to log in to the AWS Console.

Prerequisites

This post describes how to deploy existing code for a website. For this example, the steps assume that the code is in a CodeCommit repository.

You will also need the AWS CLI installed. For instructions on installing the AWS CLI, see here: https://docs.aws.amazon.com/cli/latest/userguide/cli-chap-install.html

Steps

Install the CDK if you don't already have it. It can be installed with npm using npm install -g aws-cdk. To confirm that the installation was successful, check the installed version by running cdk --version.
Create a directory for your CDK project and navigate to that directory. In the new directory, run cdk init --language typescript. This will create a Typescript project with a blank stack. The stack definition can be found in the lib folder, and will be named [directory name]-stack.
We want to use an existing Code Commit repo, so we will need the Code Commit CDK module. To install it, run npm install @aws-cdk/aws-codecommit. To add the repository to the stack, open the stack file and add the following:
```
import { Repository } from '@aws-cdk/aws-codecommit'

const repoName = 'my-repository-name'
const repo = Repository.fromRepositoryName(this, 'MyRepo', repoName)
```

To create an AWS Amplify app, start by adding the Amplify CDK module: npm install @aws-cdk/aws-amplify. Now we can create the app in our stack by adding the following to our stack file:

import { App, CodeCommitSourceCodeProvider } from '@aws-cdk/aws-amplify'

let amp = new App(this, 'MyBlogApp', {
      sourceCodeProvider: new CodeCommitSourceCodeProvider({ repository: repo })
    })

To use a Code Commit repository as the source for an Amplify app, we need to designate which branch of the repo it should use. We also need to add an address to be used:
```
let master = amp.addBranch('master')
let domain = amp.addDomain('example.com')
domain.mapRoot(master)
```
To check that your stack definition is valid, run cdk synth. If this is successful, you can deploy to AWS:
```
cdk deploy
```
The new Amplify app will be automatically configured to build and deploy whenever a change is checked in to the source repository. To see it in action, push a change to your repository. Once the build and deploy process has completed, you should see your new site at the address you provided!

Resources

AWS CDK API Reference