pipeline-serverless-backend-npm-frontend.yml

AWSTemplateFormatVersion: "2010-09-09"
Description: Serverless deployment pipeline for a serverless backend and a npm/react frontend
Parameters:
  GithubOauthToken:
    Type: String
  GithubRepoOwner:
    Type: String
  GithubRepoName:
    Type: String
  GithubRepoBranch:
    Type: String
    Default: master
Metadata:
  AWS::CloudFormation::Interface:
    ParameterGroups:
      - Label:
          default: Source Code Repository
        Parameters:
          - GithubRepoOwner
          - GithubRepoName
          - GithubRepoBranch
          - GithubOauthToken
Resources:
  WebsiteBucket:
    Type: AWS::S3::Bucket
    Properties:
      AccessControl: PublicRead
      WebsiteConfiguration:
        IndexDocument: index.html
  WebsiteBucketPolicy:
    Type: AWS::S3::BucketPolicy
    Properties:
      Bucket:
        Ref: WebsiteBucket
      PolicyDocument:
        Version: "2012-10-17"
        Statement:
          Effect: Allow
          Principal: "*"
          Action: s3:GetObject
          Resource:
            Fn::Join:
              - ""
              - - "arn:aws:s3:::"
                - Ref: WebsiteBucket
                - "/*"
  ArtifactStoreBucket:
    Type: AWS::S3::Bucket
    Properties:
      VersioningConfiguration:
        Status: Enabled
      AccessControl: BucketOwnerFullControl
  Pipeline:
    Type: AWS::CodePipeline::Pipeline
    Properties:
      RoleArn: !GetAtt PipelineRole.Arn
      ArtifactStore:
        Location:
          Ref:
            ArtifactStoreBucket
        Type: S3
      Stages:
        - Name: Source
          Actions:
            - InputArtifacts: []
              Name: Source
              ActionTypeId:
                Category: Source
                Owner: ThirdParty
                Version: 1
                Provider: GitHub
              OutputArtifacts:
                - Name: SourceOutput
              Configuration:
                Owner: !Ref GithubRepoOwner
                Repo: !Ref GithubRepoName
                Branch: !Ref GithubRepoBranch
                OAuthToken: !Ref GithubOauthToken
              RunOrder: 1
        - Name: DeployApp
          Actions:
          - Name: DeployBackend
            ActionTypeId:
                Category: Build
                Owner: AWS
                Version: 1
                Provider: CodeBuild
            OutputArtifacts:
              - Name: DeployBackendOutput
            InputArtifacts:
              - Name: SourceOutput
            Configuration:
                ProjectName: !Ref DeployBackendBuild
            RunOrder: 1
          - Name: DeployFrontend
            ActionTypeId:
                Category: Build
                Owner: AWS
                Version: 1
                Provider: CodeBuild
            InputArtifacts:
              - Name: DeployBackendOutput
            OutputArtifacts:
              - Name: DeployFrontendOutput
            Configuration:
                ProjectName: !Ref DeployFrontendBuild
            RunOrder: 2
  PipelineRole:
    Type: AWS::IAM::Role
    Properties:
      AssumeRolePolicyDocument:
        Version: "2012-10-17"
        Statement:
          Effect: Allow
          Principal:
            Service: codepipeline.amazonaws.com
          Action: sts:AssumeRole
      Path: /
      ManagedPolicyArns:
        - arn:aws:iam::aws:policy/AdministratorAccess

  DeployFrontendBuild:
    Type: AWS::CodeBuild::Project
    Properties:
      Artifacts:
        Type: CODEPIPELINE
      Environment:
        ComputeType: BUILD_GENERAL1_SMALL
        Image: aws/codebuild/eb-nodejs-4.4.6-amazonlinux-64:2.1.3
        Type: LINUX_CONTAINER
        EnvironmentVariables:
          - Name: WEBSITE_BUCKET
            Value: !Ref WebsiteBucket
      Name: !Sub ${AWS::StackName}DeployFrontendBuild
      ServiceRole: !Ref DeployFrontendBuildRole
      Source:
        Type: CODEPIPELINE
        BuildSpec: |
          version: 0.1
          phases:
            install:
              commands:
                - cd frontend && npm install
            build:
              commands:
                - cd frontend && REACT_APP_API_ENDPOINT=$(cat ../service_endpoint.txt) npm run build
            post_build:
              commands:
                - cd frontend && aws s3 sync build/ s3://$WEBSITE_BUCKET/


  DeployBackendBuild:
    Type: AWS::CodeBuild::Project
    Properties:
      Artifacts:
        Type: CODEPIPELINE
      Environment:
        ComputeType: BUILD_GENERAL1_SMALL
        Image: aws/codebuild/eb-nodejs-4.4.6-amazonlinux-64:2.1.3
        Type: LINUX_CONTAINER
      Name: !Sub ${AWS::StackName}DeployBackendBuild
      ServiceRole: !Ref DeployBackendBuildRole
      Source:
        Type: CODEPIPELINE
        BuildSpec: |
          version: 0.1
          phases:
            install:
              commands:
                - npm install -g serverless@1.5.0
                - cd backend && npm install
            build:
              commands:
                - "cd backend && serverless deploy"
                - "cd backend && aws cloudformation describe-stacks --stack-name $(serverless info | grep service: | cut -d' ' -f2)-$(serverless info | grep stage: | cut -d' ' -f2) --query 'Stacks[0].Outputs[?OutputKey==`ServiceEndpoint`].OutputValue' --output text > ../service_endpoint.txt"
          artifacts:
            files:
              - frontend/**/*
              - service_endpoint.txt

  DeployFrontendBuildRole:
    Type: AWS::IAM::Role
    Properties:
      AssumeRolePolicyDocument:
        Version: "2012-10-17"
        Statement:
          Effect: Allow
          Principal:
            Service: codebuild.amazonaws.com
          Action: sts:AssumeRole
      ManagedPolicyArns:
        - arn:aws:iam::aws:policy/AdministratorAccess

  DeployBackendBuildRole:
    Type: AWS::IAM::Role
    Properties:
      AssumeRolePolicyDocument:
        Version: "2012-10-17"
        Statement:
          Effect: Allow
          Principal:
            Service: codebuild.amazonaws.com
          Action: sts:AssumeRole
      ManagedPolicyArns:
        - arn:aws:iam::aws:policy/AdministratorAccess

Outputs:
  WebsiteUrl:
    Description: URL of the Website hosted in S3
    Value: !GetAtt WebsiteBucket.WebsiteURL