Feat: deploy website on ecs

.github/workflows/deploy.yml

@@ -0,0 +1,52 @@
+name: Deploy
+
+on:
+  push:
+
+jobs:
+  deploy-dev:
+    runs-on: ubuntu-latest
+    permissions:
+      id-token: write
+      contents: read
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2.3.3
+
+      - name: Configure AWS credentials
+        uses: aws-actions/configure-aws-credentials@v1
+        with:
+          role-to-assume: arn:aws:iam::${{ secrets.AWS_ACCOUNT_ID }}:role/github-actions-frontend-access
+          aws-region: ap-south-1
+
+      - name: Build nginx and push on ECR
+        run: |
+          cd nginx 
+          sed -i "s|WEBSITE_URL|dev-stack.canopas.com|g" conf.d/default.conf
+          bash ./../deploy/deploy-ecr-image.sh dev-nginx ${{ secrets.AWS_ACCOUNT_ID }}.dkr.ecr.$AWS_REGION.amazonaws.com/canopas-blog-nginx
+
+      - name: Build frontend and push on ECR
+        run: |
+          bash ./../deploy/deploy-ecr-image.sh dev-blog ${{ secrets.AWS_ACCOUNT_ID }}.dkr.ecr.$AWS_REGION.amazonaws.com/canopas-blog
+
+      - name: Deploy cloudformation stack
+        id: canopas-blog-dev-ECS-EC2-stack
+        uses: aws-actions/aws-cloudformation-github-deploy@v1
+        with:
+          name: canopas-blog-dev-ECS-EC2-stack
+          template: infrastructure/template.yml
+          capabilities: CAPABILITY_IAM,CAPABILITY_NAMED_IAM
+          timeout-in-minutes: "10"
+          no-fail-on-empty-changeset: "1"
+          parameter-overrides: >-
+            EnvName=dev,
+            ApiBase=${{ secrets.NEXT_PUBLIC_API_BASE }},
+            IframelyKey=${{ secrets.NEXT_PUBLIC_IFRAMELY_KEY }},
+            MixpanelProjectToken=${{ secrets.NEXT_PUBLIC_MIXPANEL_PROJECT_TOKEN }},
+            RecaptchaSiteKey=${{ secrets.NEXT_PUBLIC_RECAPTCHA_SITE_KEY }},
+            StrapiDomain=${{ secrets.NEXT_PUBLIC_STRAPI_DOMAIN }},
+            StrapiURL=${{ secrets.NEXT_PUBLIC_STRAPI_URL }},
+            WebsiteURL=${{ secrets.NEXT_PUBLIC_WEBSITE_URL }},
+            ClusterName=canopas-blog-dev,
+            ImageTag=${{ github.sha }}-${{ github.run_attempt }}-dev-frontend,
+            NginxImageTag=${{ github.sha }}-${{ github.run_attempt }}-dev-nginx

Dockerfile

@@ -0,0 +1,24 @@
+# Dockerfile
+FROM node:20-alpine
+# Set the working directory
+WORKDIR /app
+
+# Copy package.json and package-lock.json to the working directory
+COPY package.json yarn.lock ./
+
+# Install dependencies
+RUN yarn install
+
+# Copy the entire project to the working directory
+COPY . .
+
+# Build the Next.js application for production
+RUN npm run build
+
+ENV PORT 3000
+
+# Expose the port that the application will run on
+EXPOSE 3000
+
+# Start the application
+CMD ["yarn", "start"]

deploy/deploy-ecr-image.sh

@@ -0,0 +1,23 @@
+#!/bin/bash
+
+set -e
+
+IMAGE_TAG="$GITHUB_SHA-$GITHUB_RUN_ATTEMPT"
+PLATFORM=$1
+IMAGE_ARN=$2
+
+aws ecr get-login-password --region ap-south-1 | docker login --username AWS --password-stdin 569704406482.dkr.ecr.ap-south-1.amazonaws.com
+
+docker build -t canopas-blog-ssr-app:$IMAGE_TAG-$PLATFORM .
+
+docker tag canopas-blog-ssr-app:$IMAGE_TAG-$PLATFORM $IMAGE_ARN:$IMAGE_TAG-$PLATFORM
+
+docker push $IMAGE_ARN:$IMAGE_TAG-$PLATFORM
+
+# delete untagged images
+aws ecr describe-repositories --output text | awk '{print $5}' | egrep -v '^$' | while read line; do
+    repo=$(echo $line | sed -e "s/arn:aws:ecr.*\///g")
+    aws ecr list-images --repository-name $repo --filter tagStatus=UNTAGGED --query 'imageIds[*]' --output text | while read imageId; do
+        aws ecr batch-delete-image --repository-name $repo --image-ids imageDigest=$imageId
+    done
+done

infrastructure/template.yml

@@ -0,0 +1,113 @@
+AWSTemplateFormatVersion: 2010-09-09
+Description: An ECS with launchType EC2 blog stack
+
+Parameters:
+  EnvName:
+    Type: String
+    Description: Name of an environment.
+    AllowedPattern: ^.*[^0-9]$
+    ConstraintDescription: Must end with non-numeric character.
+  ApiBase:
+    Type: String
+    Description: Api base.
+  IframelyKey:
+    Type: String
+    Description: Iframely Key.
+  MixpanelProjectToken:
+    Type: String
+    Description: Mixpanel Project Token.
+  RecaptchaSiteKey:
+    Type: String
+    Description: Recaptcha SiteKey.
+  StrapiDomain:
+    Type: String
+    Description: Strapi Domain.
+  StrapiURL:
+    Type: String
+    Description: Strapi URL.
+  WebsiteURL:
+    Type: String
+    Description: Website URL.
+  ClusterName:
+    Type: String
+    Description: Name of ECS cluster
+  ImageTag:
+    Type: String
+    Description: Website Docker frontend image tag
+  NginxImageTag:
+    Type: String
+    Description: NGINX Docker image tag
+
+Resources:
+  TaskDefinition:
+    Type: AWS::ECS::TaskDefinition
+    Properties:
+      Family:
+        Fn::Sub: canopas-blog-${EnvName}-task-definition
+      ExecutionRoleArn:
+        Fn::Sub: arn:aws:iam::${AWS::AccountId}:role/ecsTaskExecutionRole
+      NetworkMode: "bridge"
+      ContainerDefinitions:
+        - Name: "canopas-blog-nginx"
+          Hostname: "canopas-blog-nginx"
+          Memory: 128
+          Cpu: 128
+          Essential: true
+          Image:
+            Fn::Sub: ${AWS::AccountId}.dkr.ecr.${AWS::Region}.amazonaws.com/canopas-blog-nginx:${NginxImageTag}
+          PortMappings:
+            - ContainerPort: 80
+              HostPort: 80
+              Protocol: tcp
+          Links:
+            - canopas-blog
+
+        - Name: "canopas-blog"
+          Memory: 512
+          Cpu: 512
+          Essential: true
+          Image:
+            Fn::Sub: ${AWS::AccountId}.dkr.ecr.${AWS::Region}.amazonaws.com/canopas-blog:${ImageTag}
+          PortMappings:
+            - ContainerPort: 3080
+              HostPort: 3080
+              Protocol: tcp
+          Environment:
+            - Name: ENV
+              Value:
+                Fn::Sub: ${EnvName}
+            - Name: NEXT_PUBLIC_API_BASE
+              Value:
+                Fn::Sub: ${ApiBase}
+            - Name: NEXT_PUBLIC_IFRAMELY_KEY
+              Value:
+                Fn::Sub: ${IframelyKey}
+            - Name: NEXT_PUBLIC_MIXPANEL_PROJECT_TOKEN
+              Value:
+                Fn::Sub: ${MixpanelProjectToken}
+            - Name: NEXT_PUBLIC_RECAPTCHA_SITE_KEY
+              Value:
+                Fn::Sub: ${RecaptchaSiteKey}
+            - Name: NEXT_PUBLIC_STRAPI_DOMAIN
+              Value:
+                Fn::Sub: ${StrapiDomain}
+            - Name: NEXT_PUBLIC_STRAPI_URL
+              Value:
+                Fn::Sub: ${StrapiURL}
+            - Name: NEXT_PUBLIC_WEBSITE_URL
+              Value:
+                Fn::Sub: ${WebsiteURL}
+
+  ECSService:
+    Type: AWS::ECS::Service
+    Properties:
+      ServiceName: "canopas-blog-full-stack"
+      LaunchType: EC2
+      Cluster:
+        Fn::Sub: ${ClusterName}
+      DesiredCount: 1
+      TaskDefinition:
+        Ref: "TaskDefinition"
+      DeploymentConfiguration:
+        MaximumPercent: 100
+        MinimumHealthyPercent: 0

nginx/Dockerfile

@@ -0,0 +1,9 @@
+FROM nginx:alpine
+
+RUN mkdir -p /etc/nginx/conf.d/
+
+COPY nginx.conf /etc/nginx/
+
+COPY conf.d/* /etc/nginx/conf.d/
+
+EXPOSE 80

nginx/conf.d/default.conf

@@ -0,0 +1,10 @@
+server {
+    listen              80;
+    listen              [::]:80;
+    server_name         WEBSITE_URL;
+
+    location /resources {
+        proxy_pass         http://canopas-blog:3000;
+        proxy_set_header   Host $host;
+    }
+}

nginx/nginx.conf

@@ -0,0 +1,41 @@
+user  nginx;
+worker_processes  auto;
+
+error_log  /var/log/nginx/error.log warn;
+pid        /var/run/nginx.pid;
+
+
+events {
+    worker_connections  1024;
+}
+
+
+http {
+    include       /etc/nginx/mime.types;
+    default_type  application/octet-stream;
+
+    ssl_session_cache   shared:SSL:10m;
+    ssl_session_timeout 10m;
+
+    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
+                      '$status $body_bytes_sent "$http_referer" '
+                      '"$http_user_agent" "$http_x_forwarded_for"';
+
+    access_log  /var/log/nginx/access.log  main;
+
+    client_max_body_size 0;
+
+    sendfile        on;
+    #tcp_nopush     on;
+
+    keepalive_timeout  65;
+
+    map $http_upgrade $connection_upgrade {
+        default upgrade;
+        '' close;
+    }
+
+    #gzip  on;
+
+    include /etc/nginx/conf.d/*.conf;
+}