AWS클라우드챌린지

Cloud Resume Challenge에 대한 내 블로그를 시작합니다. 도전을 완료하기 위해 취한 모든 단계를 자세히 설명합니다.

HTML 및 CSS

이력서를 작성하는 데 2주를 투자하는 것으로 여행을 시작했습니다. 리뉴얼한지 좀 되었지만 완성했습니다.

나는 barebones html을 작성하기 시작한 다음 CSS를 추가하려고 시도했습니다.



내가 원했던 것보다 너무 좋아 보이지 않아서 포기하고 곧 훌륭한 프런트 엔드 웹 사이트 디자이너가 될 수 없다는 현실에 직면했습니다. 템플릿 탐색을 시작했고 styleshout에서 이 템플릿을 찾았습니다.



나는 내 미학에 맞고 자랑스럽게 달릴 수 있도록 모든 것을 재정렬했습니다.

웹사이트 백엔드

웹사이트의 프런트엔드가 완성되면서 웹사이트의 인프라 백엔드를 다루기 시작했습니다. 이것은 재미 있고 도전적이기 시작한 곳입니다.

챌린지는 AWS에서 SAM을 사용하여 인프라인 IaC(Infrastructure as Code)를 배포할 것을 제안했습니다. 나는 Terraform을 한동안 지켜보고 있었지만 실제로 학습을 시작할 프로젝트를 찾지 못했기 때문에 Terraform을 사용하려고 선택했습니다.

여기에서 이 YouTube 채널을 찾았습니다.

Terraform과 코드 활용 및 작성 방법에 대해 완전히 이해할 수 있었습니다. 약 반나절 동안 그의 비디오를 본 후 저는 Terraform Documentation을 활용하여 직접 코드를 작성하기 시작했습니다.

모든 것을 작성하는 데 약간의 시간이 걸렸지 만 진행했습니다. 내 도메인을 확인하는 데 문제가 있었습니다.



DNS는 최악이었습니다. 나는 그 설정을 얻으려고 노력하는 데 너무 많은 문제가있었습니다 hahaha. 올라가면 절대 5분도 안걸려서 트러블슈팅이 좀 어려웠습니다.



하지만 그 후 마침내 작동하게 되었습니다! Route53(DNS) 및 CloudFront를 설정하면 내 HTTP에 반짝이는 문자 "S"가 표시됩니다.



나머지 백엔드 코드를 마무리하고 테스트를 시작했습니다. 나는 그것을 끝내고 깨끗하고 변경해야 할 경우 쉽게 돌아갈 수 있도록 관리했습니다.

Github 작업(CI/CD 파이프라인) 및 코딩

모든 것이 완벽하게 작동하기 시작한 것 같을 때 CI/CD 파이프라인을 구현하기 시작했습니다. 여기에서 GitHub Actions를 시작했습니다. Terraform이 만든 인프라의 구성을 유지하려면 Terraform 상태 파일이 필요합니다. Terraform이 이전에 무엇을 했는지 알기 위해서는 이것이 있어야 했습니다. 로컬 시스템에서 GitHub 리포지토리로 이동할 때 Terraform이 구성 파일에 액세스할 수 있도록 해당 상태 파일의 저장소로 S3 버킷을 사용하도록 Terraform을 구성했습니다.



첫 페이지에 방문자 수를 추가하여 이력서 웹사이트를 마무리했습니다. 방문자 수는 데이터베이스에 저장된다고 가정합니다. 이것이 바로 AWS DynamoDB가 필요한 이유입니다.



데이터베이스와 상호 작용해야 했기 때문에 AWS Lambda를 활용하여 Lambda 함수가 실행될 때마다 데이터베이스 내 방문자 수를 업데이트하고 가져왔습니다. 이를 위해 파이썬으로 작성한 코드는 다음과 같습니다.

import boto3

table_name = "visitor-count"
dynamodb = boto3.resource("dynamodb")
db_client = boto3.client("dynamodb")
table = dynamodb.Table(table_name)


def increment_visitor():
    response = db_client.update_item(
        TableName=table_name,
        Key = {
            'Primary Key': {
                'N': "0"
            }
        },
        ExpressionAttributeValues = { ":inc": {"N": "1"}},
        UpdateExpression = "ADD visitor :inc"
    )


def retrieve_visitor_count():
    item = table.get_item(
        Key = {
            "Primary Key": 0
        }
    )
    visitcount = (item["Item"])["visitor"]
    return visitcount


def lambda_handler(event, context):
    increment_visitor()
    return retrieve_visitor_count()

마지막으로 안전한 방식으로 코드와 상호 작용할 무언가가 필요했습니다. 그것이 AWS API Gateway가 등장한 곳입니다.



API는 작성된 Javascript가 웹 사이트에서 상호 작용할 수 있도록 웹에 노출됩니다.

결론

드디어! 이 도전을 한동안 미루고 있었습니다. 잘 마무리해서 자랑할 수 있는 완성품이 생겨서 너무 기쁘고 행복합니다 ㅎㅎ.

이 문제로 인해 JavaScript, Terraform을 배우고 AWS 클라우드 리소스를 활용하게 되었습니다. 저는 DNS가 웹사이트 구축뿐 아니라 헬프 데스크 기술자로서 문제를 해결하는 데 여전히 골칫거리라는 것을 배웠습니다. AWS 콘솔을 활용하는 것보다 코드로 리소스를 배포하는 것이 얼마나 쉬운지 배웠습니다(클릭이 훨씬 더 많음).

leighiamvirrey.com에서 웹사이트를 확인하세요. 소스 코드는 제 GitHub에 있습니다. 다음은 frontend 및 backend 링크입니다.