K

2023.04.26-05.02 두 번째 프로젝트가 끝났습니다 👏 일차별 작업 진행 사항과 모든 트러블슈팅은 TIL로 정리하였기 때문에, 해당 회고에서는 변경점이나 주요 트러블슈팅 등을 기록합니다! (TIL 링크: 마일스톤1 마일스톤2 마일스톤3 마일스톤4 마일스톤5-1 마일스톤5-2 마일스톤6 마일스톤7 마일스톤8 마일스톤9 마일스톤10) 프로젝트 목표 섹션 2 파트에 학습했던 내용을 완전히 이해하고 실습한다. AWS 리소스에 대한 이해를 통해 실제 AWS에 서비스를 배포한다 WAS를 Docker image로 빌드하여 컨테이너화(Docker, Yaml, AWS, 지속적통합) 컨테이너화한 이미지를 AWS에 배포(Docker, AWS) AWS 배포 자동화(AWS, 배포자동화) CDN을 통한 캐싱 및 HTTP..

실습과제: 서버 애플리케이션 CRUD 구현 Bare minimum requirement API 요구사항에 맞춰 서버 애플리케이션을 작성합니다. 데이터베이스에 접속해, 원하는 데이터가 잘 들어갔는지 확인해 봅니다. 프론트엔드가 잘 작동하는지도 같이 확인합니다. mongoDB에 접속한다 데이터베이스를 생성하고 내용을 넣어준다 데이터가 잘 들어간 것을 확인할 수 있다 데이터베이스의 값을 불러오기 위한 코드를 작성한다 /api/restaurants 엔드포인트로 접근하기 위한 코드를 작성한다 프론트엔드에서 디비의 값을 정상적으로 불러오는 것을 확인할 수 있다! 그런데 식당 목록이 안나온다.. 다시 생각해보니 데이터베이스를 로컬로 연결해놨는데, 처음에 데이터 추가는 ecs에 했었다 ㅎㅎ; 다시 로컬에서 데이터를 추..

연습과제: 프론트엔드-서버 연결 확인 Goal 프론트엔드가 잘 작동하도록, WAS 측 코드를 변경합니다. WAS가 CORS를 허용해야 합니다. 프론트엔드가 올바른 서버를 바라볼 수 있도록 환경변수를 설정할 수 있어야 합니다. routes/api/restraunts/index.js 파일 생성 로컬에서 서버 실행 로컬에서 프론트엔드 실행 프론트엔드 실행 완료 그러나 cors 정책이 없기 때문에 서버와 연결 되지 않는다 서버 폴더에 plugins/cors.js 파일을 생성해준다 npm i @fastify/cors 명령어를 통해 cors 패키지를 설치해준 후 npm start를 실행한다 프론트엔드로 접속시 정상적으로 연결된다 이제 로컬이 아닌 aws 서비스를 통해 실행시키기 위해 환경변수를 변경한다 ecs 서비..

실습과제: 프론트엔드 HTTPS 적용 Bare minimum requirement CloudFront를 이용하여, S3 정적 웹사이트를 캐싱합니다. Route 53을 이용해 https://www.yourdomain.click의 트래픽이, CDN(CloudFront)에 연결되도록 만들어야 합니다. CloudFront 배포 생성 연결할 S3 버킷 선택 Redirect HTTP to HTTPS 선택 HTTP 방법 선택 대체 도메인 입력 기존 발급받은 인증서 선택 클라우드 프론트 생성 완료 클라우드 프론트의 dns 주소로 접근 시 S3 버킷에 배포된 내용으로 접속할 수 있는 것을 확인할 수 있다 Route 53 레코드 생성 https://www.도메인 으로 접속 가능한 것을 확인할 수 있다

실습과제: 프론트엔드 배포 자동화 Bare minimum requirement 프론트엔드 프로젝트의 배포 자동화를 구현합니다. GitHub Action 또는 CodePipeline + CodeBuild 조합 중 하나를 선택해서 구현합니다. 프론트엔드의 변경사항이 S3에 배포가 되는지 확인합니다. 정적 웹사이트 설정을 통해 S3 웹사이트 URL로 접근 시 웹 페이지가 제대로 보여야 합니다. AWS S3 버킷 생성 퍼블릭 액세스 허용 정적 웹사이팅 호스팅 활성화 설정 버킷 정책 생성 GitHub Action을 이용하여 S3 버킷 배포 자동화 진행 yml 파일 작성 및 환경변수 추가(액세스 키, 시크릿 키) 트러블슈팅 Treating warnings as errors because process.env.CI ..

실습과제: 서버 애플리케이션의 HTTPS 적용 Bare minimum requirement https://본인도메인.click의 트래픽이 서버 컨테이너, 즉 애플리케이션 로드 밸런서로 연결되도록 만들어야 합니다. 기존에 구매한 도메인과 발급받은 인증서를 이용해서 진행했다 application load balancer 에 리스너를 추가해준다 https 접속을 할 것이기 때문에 443 포트를 열어준다 기존에 발급받은 인증서를 선택한다 리스너가 추가된 모습을 확인할 수 있다 route 53 에서 레코드를 생성한다 레코드가 정상적으로 생성된 것을 확인할 수 있다 https://도메인 으로 접속했을 때 정상적으로 값을 불러오는 것을 확인할 수 있다

연습과제: ECS에서 민감 정보 다루기 Goal 데이터베이스 연결 등에 필요한 민감정보를 어떻게 컨테이너에 주입시키는지 알아봅니다. helloworld-was/route/root.js 파일 수정 AWS Secerets Manager 이용하여 보안 암호 생성 환경 변수 등록 기존 태스크 정의에서 새 개정 생성 환경 변수에 secrets manager arn 주소 복사 값 유형은 valuefrom 으로 설정해줘야 함 새로 만든 개정으로 서비스 업데이트 트러블슈팅 Secerets Manager 접근 권한 없음(ResourceInitializationError: unable to pull secrets or registry auth) 태스크 정의에서 시크릿 매니저에 등록해놓은 보안 암호에 접근하기 위해서는 권한..

실습과제: 새 버전 릴리즈와 ECS 배포 Bare minimum requirement 웹 서버 이미지의 새 버전이 준비되었을 때, 새로운 작업 정의와 서비스를 만들고, 새 버전이 배포되도록 해야 합니다. 고의적으로 애플리케이션이 정상적으로 실행되지 못하게 만들어서, 배포가 실패하는 것을 로그를 통해 확인할 수 있어야 합니다. yml 파일 작성 push 후 github action 작동 트러블슈팅 image를 찾을 수 없다는 오류 발생 yml 파일의 문제인 것 같았는데, 팀원분의 코드와 비교해봐도 다른 점이 없었다.. 팀원분의 코드를 복사 붙여넣기 하였고, 실제로 다른 부분이 없었다 그러나 그 코드로 작동시 해결되었다..;; 가끔 vscode에서 같은 코드여도 뭔가 인식 못할때가 있는데 그런 상황인 것 같..

연습과제: 서버 이미지 ECS 배포 Goal ECS의 클러스터, 태스크 정의, 태스크, 서비스에 대한 개념을 이해합니다. ECR에 저장된 웹 서버 이미지를 ECS로 배포해 봅니다. ECS 태스크의 로그를 읽어봅니다. 로드 밸런서와 ECS 서비스를 연결해 봅니다. 테스크 정의 생성 ECR 레포지토리의 이미지 URI (꼭 태그까지 붙일 것) 컨테이너 포트 3000으로 설정 클러스터 생성 후 서비스 생성 생성한 테스크 정의 선택 네트워킹 탭에서 보안그룹 설정 (3000번 포트 열어줘야함) alb 생성 트러블슈팅 테스크가 생성됐다 삭제됐다 반복되며 서비스가 제대로 작동하지 않음 타겟 그룹의 헬시체크를 봤을 때 타겟 등록 -> 삭제 만 반복하는 것을 확인 서비스 로그를 확인했을 때 타겟 등록 -> 삭제 만 반복하..

연습과제: 도커 이미지 빌드 자동화 Goal GitHub Action을 이용해 도커 이미지 빌드를 자동화합니다. GitHub Action workflow 생성 후 yml 파일 작성 릴리즈 후 작동 확인 실전과제: 레지스트리 push 자동화 Bare minimum requirement GitHub Action을 이용해 AWS 로그인 후, 이미지 빌드 및 push를 자동화해야 합니다. 코드에 민감한 정보를 담지 않고, AWS 로그인을 위한 액세스 키와 시크릿 키를 별도로 관리해야 합니다. 릴리즈 후 작동 확인 트러블슈팅 오류 1: requested access to the resource is denied 구글링 결과 이미지 태그의 문제라는 의견이 절대적이었다 태그를 아무리 수정하고.. 이미지를 지우고 다시..