Convention over configuration based AWS Blueprint for running Angular web apps in AWS driven by CI/CD and CloudFormation.
- Multi-stage, feature branch, CI/CD driven via CodePipeline and Codebuild
- Angular assets gzipped & CDN cached and hosted from S3 origin - supporting Angular routing
- No-maintence, free HTTPS via ACM
- Root domain apex support with redirection
- Local HTTPS support via ngrok
- Node module vendoring (aka commit
node_modules) with yarn autoclean
- Create a github access token. This token will be used by the CI/CD to pull code. Required scopes:
admin:repo_hook, repo - An SNS topic for CI/CD code promotion approvals. Subscribe your email address to it.
- Yarn
- Optional: free ngrok account required for local HTTPS support
make installmake run/local-webapp- Optonal: For local HTTPS, in another terminal tab:
make run/ngrok-webapp(free ngrok account required).
- Set values in aws/cloudformation/parameters/*.json. The CI/CD CodePipeline will pass these into the cloud formation template (aws/cloudformation/template.yml) for each stage stack that is created. Typically the values are the same for each
.jsonfile except forStageName. SettingCreateCloudFronttofalseis helpful early on to bypass slow CDN creation while you are working out kinks. - Create a new CloudFormation stack using aws/cloudformation/pipeline.yml. Stack naming convention:
[repo]--[branch]--webapp--cicd. Ex:abp-angular--master--webapp-cicd. Thispipeline.ymlcreates a CodePipeline that is your CI/CD. - Do a
git pushand watch the newly created CodePipeline. As each stage in the pipeline completes, look at theOutputstab of the executed CloudFormation changeset for theAppURL. Don't seeAppURL? Make sureCreateCloudFrontistruein aws/cloudformation/parameters/*.json (justgit pushafter changing it totrue).
Optional: setup root apex redirect (both HTTP&HTTPS). Ex: rynop.com -> https://www.rynop.com by following my directions here, jump right to step 5.