Table of Contents

Aws - Modern Web App Workshop

About

Note about the Aws project Build a Modern Web Application

Steps

git clone -b python https://github.com/aws-samples/aws-modern-application-workshop.git
cd aws-modern-application-workshop
:: Taking the python code
git checkout python

Create the bucket

aws s3 mb s3://web-app-modern

Create a static web hosting with cloudfront

Create a static web hosting with cloudfront from this bucket

aws s3 website s3://web-app-modern --index-document index.html
aws cloudfront create-cloud-front-origin-access-identity --cloud-front-origin-access-identity-config CallerReference=Mysfits,Comment=Mysfits
aws s3api put-bucket-policy --bucket web-app-modern --policy file://module-1/aws-cli/website-bucket-policy.json
aws cloudfront create-distribution --distribution-config file://module-1/aws-cli/website-cloudfront-distribution.json
aws s3 cp module-1/web/index.html s3://web-app-modern/index.html

Aws Moder App Mysfits Home Page

Create the API

Module Two

Build the container

cd module-2\app
docker build . -t REPLACE_ME_AWS_ACCOUNT_ID.dkr.ecr.REPLACE_ME_REGION.amazonaws.com/mythicalmysfits/service:latest
docker run -p 8080:8080 REPLACE_ME_WITH_DOCKER_IMAGE_TAG

Push the Docker Image to Amazon ECR

aws ecr create-repository --repository-name mythicalmysfits/service
aws ecr get-login --no-include-email
:: execute the output
# in bash
$(aws ecr get-login --no-include-email)
docker push REPLACE_ME_WITH_DOCKER_IMAGE_TAG
aws ecr describe-images --repository-name mythicalmysfits/service

Create a cluster

aws ecs create-cluster --cluster-name MythicalMysfits-Cluster

Create a log group

aws logs create-log-group --log-group-name mythicalmysfits-logs

Register an ECS Task Definition

Register an ECS task definition. Example: Aws - Elastic Container Service (Ecs)

aws ecs register-task-definition --cli-input-json file://module-2/aws-cli/task-definition.json

Load balancer

Create a Network Load Balancer
aws elbv2 create-load-balancer ^
  --name mysfits-nlb ^
  --scheme internet-facing ^
  --type network ^
  --subnets REPLACE_ME_PUBLIC_SUBNET_ONE REPLACE_ME_PUBLIC_SUBNET_TWO ^
> %HOME%/environment/nlb-output.json

Keep the output to extract:

Create a Load Balancer Target Group

Create an NLB target group. You get back a TargetGroupArn.

aws elbv2 create-target-group ^
   --name MythicalMysfits-TargetGroup ^
   --port 8080 ^
   --protocol TCP ^
   --target-type ip ^
   --vpc-id REPLACE_ME_VPC_ID ^
   --health-check-interval-seconds 10 ^
   --health-check-path / ^
   --health-check-protocol HTTP ^
   --healthy-threshold-count 3 ^
   --unhealthy-threshold-count 3 ^
> %HOME%/environment/target-group-output.json
Create A Load Balancer Listener

Create a load balancer listener for the network load balancer

A load balancer listener configure the forwarding of requests received on a specific port to targets that have registered to the target group.

aws elbv2 create-listener ^
  --default-actions TargetGroupArn=REPLACE_ME_NLB_TARGET_GROUP_ARN,Type=forward ^
  --load-balancer-arn REPLACE_ME_NLB_ARN ^
  --port 80 ^
  --protocol TCP

Create a service with Fargate

Steps:

aws ecs create-service --cli-input-json file://module-2/aws-cli/service-definition.json
http://mysfits-nlb-123456789-abc123456.elb.us-east-1.amazonaws.com/mysfits

Capture User Behavior

Aws - Click Event Rest API (Capture user behavior)

Documentation / Reference