Building a Cloud-Native App using Angular/Ionic with Amplify, and Java/Quarkus with Copilot ECS.

IAM User Groups and Policies.

The Backend.

ECS Copilot to the rescue.

# copilot app init timerservice
# copilot env init --name dev
# copilot svc init
# copilot storage init
# copilot storage init
const {username, host, dbname, password, port} = JSON.parse(...);
  • copilot/api/manifest.yml: used to configure the docker image hardware resources, AWS environments, and the deployment strategy.
  • copilot/api/addons/Task.yml: used to create the Task table on AWS DynamoDB.
  • copilot/api/addons/TimerServiceDBCluster.yml: used to create the Aurora Postgres Cluster (using serverless v1) on AWS.
# cd copilot/api/addons
# aws cloudformation validate-template \
--template-body file://TimerServiceDBCluster.yml
# aws cloudformation create-stack                  \
--stack-name timerservice-auroradb-test \
--template-body file://TimerServiceDBCluster.yml \
--parameters \
ParameterKey=App,ParameterValue=timerservice \
ParameterKey=Env,ParameterValue=dev \
ParameterKey=Name,ParameterValue=AuroraDBCluster \
--capabilities CAPABILITY_NAMED_IAM
# aws rds create-db-cluster                               \
--region us-east-1 \
--engine aurora-postgresql \
--engine-version 13.6 \
--db-cluster-identifier timer-service-db-cluster \
--master-username postgres \
--master-user-password postgres123 \
--db-subnet-group-name timer-service-subnet-group \
--vpc-security-group-ids sg-012121d2a33ebfe56 \
--port 5432 \
--database-name TimerServiceDB \
--backup-retention-period 35 \
--no-storage-encrypted \
--no-deletion-protection \
--serverless-v2-scaling-configuration...
# copilot svc deploy --name api --env dev

The API Gateway.

# aws cloudformation validate-template \
--template-body file://cloudformation/1_SecurityGroupIngress.yml
# aws cloudformation create-stack                                 \
--stack-name timerservice-ecs-sg-ingress \
--template-body file://cloudformation/1_SecurityGroupIngress.yml \
--parameters \
ParameterKey=App,ParameterValue=timerservice \
ParameterKey=Env,ParameterValue=dev \
--capabilities CAPABILITY_NAMED_IAM
# aws cloudformation validate-template \
--template-body file://cloudformation/2_ApiGateway.yml
# aws cloudformation create-stack                      \
--stack-name timerservice-apigateway \
--template-body file://cloudformation/2_ApiGateway.yml \
--parameters \
ParameterKey=App,ParameterValue=timerservice \
ParameterKey=Env,ParameterValue=dev \
ParameterKey=Service,ParameterValue=api \
ParameterKey=Name,ParameterValue=ApiGateway \
--capabilities CAPABILITY_NAMED_IAM
# copilot svc logs --follow

Persisting Faker Data on DynamoDB.

# cd java-faker-data-generator/
# mvn clean package
# java -jar target/java-faker-data-generator.jar

The Frontend.

# amplify init
# amplify add auth
# amplify push If you want to enable the 2nd-factor authentication to your Angular/Ionic app, you can read my last article called “Adding Amplify Auth with 2-factor authentication to your Ionic/Angular projects” and follow those steps.
# ionic build
# ionic serve

The TASK pages.

# ionic g page pages/tasks

The Native App on AWS.

# aws cloudformation update-stack                                  \
--stack-name timerservice-apigateway \
--template-body file://cloudformation/1_ApiGatewayAuthorizer.yml \
--parameters \
ParameterKey=App,ParameterValue=timerservice \
ParameterKey=Env,ParameterValue=dev \
ParameterKey=Name,ParameterValue=ApiGateway \
ParameterKey=AppClientID,ParameterValue=abcdefgh1234567890 \
ParameterKey=UserPoolID,ParameterValue=us-east-xyz123 \
--capabilities CAPABILITY_NAMED_IAM

Building Scripts

# ./run-scripts.sh

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store